added image support and horizontal line support

src/components/SlashMenu.tsx

@@ -2,9 +2,12 @@ import { type Component, createSignal, For, createEffect } from "solid-js";
 import {
     Heading1, Heading2, Heading3,
     List, ListTodo, Type,
-    Code, Quote
+    Code, Quote,
+    Image as ImageIcon, Minus
 } from "lucide-solid";
-import { cn } from "@/lib/utils";
+import { cn, convertImageToWebpFile } from "@/lib/utils";
+import { activeTaskId, uploadTaskAttachment } from "@/store";
+import { toast } from "solid-sonner";
 
 export interface CommandItem {
     title: string;
@@ -79,6 +82,62 @@ export const getSuggestionItems = ({ query }: { query: string }): CommandItem[]
                 editor.chain().focus().deleteRange(range).toggleBlockquote().run();
             },
         },
+        {
+            title: "Image",
+            description: "Upload an image.",
+            icon: ImageIcon,
+            command: ({ editor, range }: { editor: any, range: any }) => {
+                editor.chain().focus().deleteRange(range).run();
+                const taskId = activeTaskId();
+                if (!taskId) {
+                    toast.error("Cannot upload image outside of a task.");
+                    return;
+                }
+
+                const input = document.createElement("input");
+                input.type = "file";
+                input.accept = "image/*";
+                input.onchange = async () => {
+                    if (input.files?.length) {
+                        const originalFile = input.files[0];
+                        toast.promise(
+                            (async () => {
+                                const webpFile = await convertImageToWebpFile(originalFile);
+                                return uploadTaskAttachment(taskId, webpFile);
+                            })(),
+                            {
+                                loading: "Processing & uploading image...",
+                                success: (url) => {
+                                    // Insert image, then run enter to add a newline (paragraph) below it.
+                                    // Without this, the image stays selected and the next keypress deletes it.
+                                    editor.chain()
+                                        .focus()
+                                        .setImage({ src: url })
+                                        .run();
+
+                                    // Manually force a new paragraph at the end so the user can keep typing
+                                    editor.chain()
+                                        .focus('end')
+                                        .insertContent('<p></p>')
+                                        .run();
+                                    return "Image uploaded.";
+                                },
+                                error: "Failed to upload image."
+                            }
+                        );
+                    }
+                };
+                input.click();
+            },
+        },
+        {
+            title: "Divider",
+            description: "Insert a horizontal rule.",
+            icon: Minus,
+            command: ({ editor, range }: { editor: any, range: any }) => {
+                editor.chain().focus().deleteRange(range).setHorizontalRule().run();
+            },
+        },
     ].filter(item => item.title.toLowerCase().startsWith(query.toLowerCase()));
 };