Editor: document tone, right-click word lookup, expanded stats
Four enhancements to make the editor fit real school usage:
- Per-document tone (academic/professional/casual/humorous/creative/
persuasive/general): new documents.tone column (migration 0002), threaded
through the docs API, a bilingual ToneSelect dropdown on the title row, and
injected into the grammar-checkpoint LLM prompt so advice fits the register.
The voice pass stays tone-agnostic.
- Right-click word lookup: a new offline `lexicon` package serves definitions
(Wordset, modern ESL-friendly glosses) and synonyms (WordNet synsets first,
then frequency+stopword-ranked Moby for breadth) from gzipped embedded data,
behind /api/word/{word} with light morphology. The WordCard popover shows the
definition and tappable synonym pills that swap the word in place.
- Expanded writing stats: clicking the word count opens a StatsPanel with page
count, sentences, paragraphs, reading time, average word length, word variety,
and Flesch-Kincaid reading level — all computed client-side.
Claude-Session: https://claude.ai/code/session_016Yr6jELuRc7hyzYLccQKZd
This commit is contained in:
prosolis
@@ -5,6 +5,7 @@ import { useCheckpoint } from './hooks/useCheckpoint'
|
||||
import { useSpellChecker } from './hooks/useSpellChecker'
|
||||
import { DocList } from './components/DocList/DocList'
|
||||
import { EditorCore, type EditorChange } from './components/Editor/EditorCore'
|
||||
import { ToneSelect } from './components/Editor/ToneSelect'
|
||||
import { StatusBar } from './components/StatusBar/StatusBar'
|
||||
import { PetalCompanion } from './components/Companion/PetalCompanion'
|
||||
import { UpdateBanner } from './components/UpdateBanner/UpdateBanner'
|
||||
@@ -16,6 +17,10 @@ export default function App() {
|
||||
const [currentDoc, setCurrentDoc] = useState<Document | null>(null)
|
||||
const [title, setTitle] = useState('')
|
||||
const [wordCount, setWordCount] = useState(0)
|
||||
// The current document's target tone (steers checkpoint advice) and its live
|
||||
// plain text (drives the expanded writing-stats panel in the StatusBar).
|
||||
const [tone, setTone] = useState('general')
|
||||
const [docText, setDocText] = useState('')
|
||||
const [ready, setReady] = useState(false)
|
||||
// Distraction-free mode: entered on editor focus, collapses the doc-list
|
||||
// sidebar. Escape or a click outside the editor canvas restores it.
|
||||
@@ -49,6 +54,8 @@ export default function App() {
|
||||
setCurrentDoc(doc)
|
||||
setTitle(doc.title)
|
||||
setWordCount(doc.word_count)
|
||||
setTone(doc.tone || 'general')
|
||||
setDocText(doc.content_text)
|
||||
},
|
||||
[saveNow],
|
||||
)
|
||||
@@ -68,6 +75,8 @@ export default function App() {
|
||||
setCurrentDoc(fresh)
|
||||
setTitle(fresh.title)
|
||||
setWordCount(0)
|
||||
setTone(fresh.tone || 'general')
|
||||
setDocText('')
|
||||
} else {
|
||||
setDocs(list)
|
||||
await openDoc(list[0].id)
|
||||
@@ -90,6 +99,8 @@ export default function App() {
|
||||
setCurrentDoc(fresh)
|
||||
setTitle(fresh.title)
|
||||
setWordCount(0)
|
||||
setTone(fresh.tone || 'general')
|
||||
setDocText('')
|
||||
}, [saveNow])
|
||||
|
||||
const handleDelete = useCallback(
|
||||
@@ -104,6 +115,8 @@ export default function App() {
|
||||
setCurrentDoc(null)
|
||||
setTitle('')
|
||||
setWordCount(0)
|
||||
setTone('general')
|
||||
setDocText('')
|
||||
}
|
||||
}
|
||||
return remaining
|
||||
@@ -126,6 +139,7 @@ export default function App() {
|
||||
const handleEditorChange = useCallback(
|
||||
(change: EditorChange) => {
|
||||
setWordCount(change.word_count)
|
||||
setDocText(change.content_text)
|
||||
setEditTick((n) => n + 1)
|
||||
if (currentDoc) {
|
||||
patchSummary(currentDoc.id, { word_count: change.word_count })
|
||||
@@ -136,6 +150,20 @@ export default function App() {
|
||||
[currentDoc, patchSummary, schedule, scheduleCheckpoint],
|
||||
)
|
||||
|
||||
// Changing the tone persists it and re-runs the checkpoint so Petal's advice
|
||||
// re-tunes to the new register. The auto-save (1.5s) lands before the
|
||||
// checkpoint debounce (4s), so the server reads the updated tone.
|
||||
const handleToneChange = useCallback(
|
||||
(value: string) => {
|
||||
setTone(value)
|
||||
if (currentDoc) {
|
||||
schedule({ tone: value })
|
||||
scheduleCheckpoint()
|
||||
}
|
||||
},
|
||||
[currentDoc, schedule, scheduleCheckpoint],
|
||||
)
|
||||
|
||||
// Accept applies the replacement in the editor (handled in EditorCore) and
|
||||
// marks the suggestion accepted; dismiss just rejects it. Both drop it locally.
|
||||
const handleAccept = useCallback(
|
||||
@@ -209,14 +237,17 @@ export default function App() {
|
||||
className="flex flex-1 flex-col overflow-y-auto px-6 py-8"
|
||||
>
|
||||
<div ref={canvasRef} className="mx-auto flex w-full max-w-[720px] flex-1 flex-col">
|
||||
<input
|
||||
value={title}
|
||||
onChange={(e) => handleTitleChange(e.target.value)}
|
||||
placeholder="Untitled"
|
||||
aria-label="Document title"
|
||||
className="mb-5 w-full bg-transparent text-3xl font-extrabold text-plum focus:outline-none"
|
||||
style={{ fontFamily: 'var(--font-ui)' }}
|
||||
/>
|
||||
<div className="mb-5 flex items-center gap-3">
|
||||
<input
|
||||
value={title}
|
||||
onChange={(e) => handleTitleChange(e.target.value)}
|
||||
placeholder="Untitled"
|
||||
aria-label="Document title"
|
||||
className="min-w-0 flex-1 bg-transparent text-3xl font-extrabold text-plum focus:outline-none"
|
||||
style={{ fontFamily: 'var(--font-ui)' }}
|
||||
/>
|
||||
<ToneSelect value={tone} onChange={handleToneChange} />
|
||||
</div>
|
||||
<EditorCore
|
||||
key={currentDoc.id}
|
||||
docId={currentDoc.id}
|
||||
@@ -236,6 +267,7 @@ export default function App() {
|
||||
<div onMouseDown={handleChromeDown}>
|
||||
<StatusBar
|
||||
wordCount={wordCount}
|
||||
text={docText}
|
||||
saveStatus={status}
|
||||
checking={checking}
|
||||
voicing={voicing}
|
||||
|
||||
Reference in New Issue
Block a user