UI polish pass: word count, slash commands, task lists, graph peek, bulk delete, export

- WordCount component (toggle words/chars vs read time, persisted mode) - TipTap: TaskList/TaskItem extensions, slash command menu (H1-H3, lists, code, quote, task) - Markdown serializer: task list → `- [ ]` / `- [x]` roundtrip - GraphView: slide-in peek panel for note/task nodes (body, tags, linked nodes); tag nodes still navigate - ChatView: bulk-select conversations with two-click confirm delete + chat retention policy (default 90d) - NoteEditorView: pill tab bar with animated edit/preview toggle + WordCount in toolbar - WorkspaceNoteEditor: inline search with tag matching, inline new-note creation, WordCount - WorkspaceTaskPanel: task body rendered in slide-over + Edit link - Settings: data export (Markdown ZIP / JSON) via GET /api/export - Accessibility: skip-to-content link, aria-labels on all icon-only buttons - Fix: export route used non-existent fabledassistant.database — corrected to async_session() - Fix: ToolCallRecord.status type now includes "running" (was causing TS build error) - Dockerfile: upgrade npm to latest before install to suppress major-version notice - npm audit fix: patched minimatch (ReDoS) and rollup (path traversal) — 0 vulnerabilities Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-07 23:15:01 -05:00
parent de7709039a
commit ef141f07f8
28 changed files with 2980 additions and 160 deletions
@@ -0,0 +1,69 @@
+import { Extension } from "@tiptap/vue-3";
+import { PluginKey } from "@tiptap/pm/state";
+import Suggestion from "@tiptap/suggestion";
+import { createSuggestionRenderer } from "./suggestionRenderer";
+import type { SuggestionItem } from "@/components/SuggestionDropdown.vue";
+import type { Editor } from "@tiptap/vue-3";
+
+const slashCommandsKey = new PluginKey("slashCommands");
+
+interface SlashCommand {
+  label: string;
+  value: string;
+  keywords: string[];
+}
+
+const COMMANDS: SlashCommand[] = [
+  { label: "Heading 1",      value: "h1",    keywords: ["heading", "h1", "title"] },
+  { label: "Heading 2",      value: "h2",    keywords: ["heading", "h2", "subtitle"] },
+  { label: "Heading 3",      value: "h3",    keywords: ["heading", "h3"] },
+  { label: "Bullet List",    value: "ul",    keywords: ["bullet", "list", "ul", "unordered"] },
+  { label: "Numbered List",  value: "ol",    keywords: ["numbered", "ordered", "ol", "number"] },
+  { label: "Task List",      value: "task",  keywords: ["task", "todo", "checkbox", "check"] },
+  { label: "Code Block",     value: "code",  keywords: ["code", "block", "pre", "codeblock"] },
+  { label: "Blockquote",     value: "quote", keywords: ["quote", "blockquote"] },
+];
+
+function applyCommand(editor: Editor, value: string) {
+  const chain = editor.chain().focus();
+  switch (value) {
+    case "h1":   chain.toggleHeading({ level: 1 }).run(); break;
+    case "h2":   chain.toggleHeading({ level: 2 }).run(); break;
+    case "h3":   chain.toggleHeading({ level: 3 }).run(); break;
+    case "ul":   chain.toggleBulletList().run(); break;
+    case "ol":   chain.toggleOrderedList().run(); break;
+    case "task": chain.toggleTaskList().run(); break;
+    case "code": chain.toggleCodeBlock().run(); break;
+    case "quote": chain.toggleBlockquote().run(); break;
+  }
+}
+
+export const SlashCommands = Extension.create({
+  name: "slashCommands",
+
+  addProseMirrorPlugins() {
+    return [
+      Suggestion<SuggestionItem>({
+        editor: this.editor,
+        pluginKey: slashCommandsKey,
+        char: "/",
+        allowSpaces: false,
+        items: ({ query }): SuggestionItem[] => {
+          const q = query.toLowerCase();
+          return COMMANDS
+            .filter((cmd) =>
+              !q ||
+              cmd.label.toLowerCase().includes(q) ||
+              cmd.keywords.some((k) => k.includes(q))
+            )
+            .map((cmd) => ({ label: cmd.label, value: cmd.value }));
+        },
+        command: ({ editor, range, props: item }) => {
+          editor.chain().focus().deleteRange(range).run();
+          applyCommand(editor as Editor, item.value);
+        },
+        render: createSuggestionRenderer,
+      }),
+    ];
+  },
+});