Upload image button

This commit is contained in:
2026-03-12 15:51:37 -05:00
parent 092e139f6e
commit 75723ed133
5 changed files with 127 additions and 55 deletions
+33 -2
View File
@@ -2,7 +2,7 @@ import { type Component, createSignal, createMemo, createEffect, onCleanup, For,
import { store, renameTagDefinition, updateNote, removeNote, restoreNote, setActiveNoteId, cleanupNoteAttachments, getFavoriteTag } from "@/store";
import { pb } from "@/lib/pocketbase";
import { type Note } from "@/store";
import { Trash2, Lock, Unlock, Search, Link, X, ChevronRight, ChevronDown, FileText, Plus, Star, MoreHorizontal } from "lucide-solid";
import { Trash2, Lock, Unlock, Search, Link, X, ChevronRight, ChevronDown, FileText, Plus, Star, MoreHorizontal, Type, Image as ImageIcon } from "lucide-solid";
import { Button } from "@/components/ui/button";
import { Popover, PopoverTrigger, PopoverContent } from "@/components/ui/popover";
import { DragDropProvider, DragDropSensors, SortableProvider, createSortable, closestCenter } from "@thisbeyond/solid-dnd";
@@ -22,6 +22,7 @@ export const NotepadView: Component<{
const [linkSearchQuery, setLinkSearchQuery] = createSignal("");
const [isLinkedTasksOpen, setIsLinkedTasksOpen] = createSignal(false);
const [isDragging, setIsDragging] = createSignal(false);
const [editorInstance, setEditorInstance] = createSignal<any>(null);
const currentUserId = pb.authStore.model?.id;
@@ -432,9 +433,38 @@ export const NotepadView: Component<{
/>
)}
</Show>
{/* Editor Commands Row */}
<div class="flex items-center gap-2 mt-1 px-1">
<Button
variant="ghost"
size="sm"
class="h-7 px-2 text-[0.625rem] font-bold uppercase tracking-wider hover:bg-muted/50 flex items-center gap-1.5 text-muted-foreground hover:text-foreground transition-all rounded-lg border border-border/40 shadow-sm"
onClick={() => {
const instance = editorInstance();
if (instance) instance.chain().focus().insertContent("/").run();
}}
title="Text Commands"
>
<Type size={14} class="opacity-70" />
<span>Commands</span>
</Button>
<Button
variant="ghost"
size="sm"
class="h-7 px-2 text-[0.625rem] font-bold uppercase tracking-wider hover:bg-muted/50 flex items-center gap-1.5 text-muted-foreground hover:text-foreground transition-all rounded-lg border border-border/40 shadow-sm"
onClick={() => {
const instance = editorInstance();
if (instance) instance.chain().focus().uploadImage().run();
}}
title="Upload Image"
>
<ImageIcon size={14} class="opacity-70" />
<span>Image</span>
</Button>
</div>
</div>
<div class="flex items-center gap-2 shrink-0 pt-1">
{/* Mobile Tabs Dropdown Moved to Footer */}
<Button
variant="ghost"
@@ -490,6 +520,7 @@ export const NotepadView: Component<{
<TaskEditor
content={note().content}
onUpdate={(html) => handleUpdateContent(note().id, html)}
onEditorReady={setEditorInstance}
editable={canEdit}
class={hasTopViewer() ? "[&>*:not(.file-viewer-wrapper:first-child)]:px-4 md:[&>*:not(.file-viewer-wrapper:first-child)]:px-6 [&>*:not(.file-viewer-wrapper:first-child)]:max-w-3xl [&>*:not(.file-viewer-wrapper:first-child)]:mx-auto pb-20" : ""}
/>