feat: integrate Milkdown editor for note-taking functionality

- Added Milkdown dependencies: @milkdown/kit, @milkdown/react, @milkdown/theme-nord.
- Implemented MilkdownEditor component for rich text editing in notes.
- Updated /notes/$noteId route to include editable title and auto-saving functionality.
- Enhanced UI with loading states, saving indicators, and delete confirmation dialog.
- Applied Milkdown-specific CSS overrides for consistent theming and styling.
- Improved note update logic with debounced saving and cleanup on unmount.
This commit is contained in:
Roberto Musso
2026-02-22 22:47:05 +01:00
parent 7860ca6ad1
commit 2308158976
9 changed files with 3016 additions and 34 deletions

View File

@@ -297,8 +297,8 @@
"Verify in browser using dev-browser skill"
],
"priority": 16,
"passes": false,
"notes": ""
"passes": true,
"notes": "Completed: @milkdown/kit + @milkdown/react + @milkdown/theme-nord installed. MilkdownEditor wrapper component at src/renderer/components/notes/MilkdownEditor.tsx using official React recipe (MilkdownProvider + useEditor + Editor.make() with commonmark, listener, history plugins). Route /notes/$noteId rewritten with: editable title (borderless Input, saves on blur), Milkdown editor with auto-save (500ms debounce via useRef+setTimeout, notes.update mutation), 'Saving...' Badge (variant=secondary) shown while save pending, back button (ghost Button + ArrowLeft, window.history.back()). Editor CSS overrides in globals.css using semantic color variables (var(--foreground), var(--muted), var(--border), etc.). Typecheck passes."
},
{
"id": "US-017",