Phase 2: document CRUD + auto-save

Backend internal/docs: chi sub-router (list/create/get/update/delete)
mounted at /api/docs, scoped to the local user. Create uses RETURNING;
update is a COALESCE partial-update so rename and full editor save share
one PUT. JSON 404/400 errors; handlers_test.go walks the lifecycle.

Frontend: api/client.ts, useAutoSave (1.5s debounce + saveNow flush
before doc switch), EditorCore (Tiptap StarterKit/Underline/TextAlign/
Placeholder/CharacterCount) + Toolbar, DocList/DocListItem, StatusBar,
and an App.tsx that orchestrates load/select/create/delete with
optimistic sidebar patching. content + content_text + word_count are
emitted together on every edit. .petal-prose styling (Lora body, Nunito
headings).

Verified: tsc clean, vite build, go build, full CRUD smoke test incl.
CJK title round-trip and SPA serve.

Claude-Session: https://claude.ai/code/session_016Yr6jELuRc7hyzYLccQKZd
This commit is contained in:
prosolis
2026-06-25 20:30:39 -07:00
parent 9c98e97030
commit 5e00cdce88
13 changed files with 1006 additions and 42 deletions

View File

@@ -0,0 +1,48 @@
import type { DocSummary } from '../../api/client'
interface Props {
doc: DocSummary
active: boolean
onSelect: () => void
onDelete: () => void
}
// One row in the sidebar: title + word count, a delete affordance on hover, and
// a rose wash when it's the open document.
export function DocListItem({ doc, active, onSelect, onDelete }: Props) {
return (
<div
onClick={onSelect}
className="group flex cursor-pointer items-center gap-2 px-3 py-2.5"
style={{
borderRadius: 'var(--radius-card)',
background: active ? 'var(--color-surface)' : 'transparent',
boxShadow: active ? 'var(--shadow-soft)' : 'none',
}}
>
<div className="min-w-0 flex-1">
<div
className="truncate text-sm font-semibold"
style={{ color: active ? 'var(--color-plum)' : 'var(--color-muted)' }}
>
{doc.title || 'Untitled'}
</div>
<div className="text-xs" style={{ color: 'var(--color-muted)' }}>
{doc.word_count} {doc.word_count === 1 ? 'word' : 'words'}
</div>
</div>
<button
type="button"
aria-label="Delete document"
onClick={(e) => {
e.stopPropagation()
onDelete()
}}
className="flex h-6 w-6 shrink-0 items-center justify-center text-base opacity-0 group-hover:opacity-100"
style={{ borderRadius: 'var(--radius-pill)', color: 'var(--color-muted)' }}
>
×
</button>
</div>
)
}