From 66dd6c8096a2f4037448ee6283f415d2d4c8a5ed Mon Sep 17 00:00:00 2001 From: John O'Keefe Date: Fri, 2 Oct 2026 21:31:13 -0400 Subject: [PATCH] feat(reader): note length counter and save guards in the reader UI MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Oversized notes previously failed only at save time, surfacing the raw backend validator error to the reader. The reader now handles the limit inline and keeps oversized input editable: - Live character counter under both note textareas (annotations drawer "Add a note" and the selection popover note editor), formatted "12,345/100,000" — muted normally, red once over - Pasting is never truncated; the full text stays in the textarea so the reader can shrink it however they see fit - The three save actions (Add Note, Highlight with note, Save note) disable while over the limit, with a toast fallback in addNote / createHighlight / saveHighlightChanges so the guard holds even outside the disabled-button path - noteMaxLength mirrors the server-side cap (100,000, see internal/handlers/media.go) so client and server stay linked Also truncate note rows in the drawer list — highlight rows already truncated, but a long note previously stretched the drawer body. The resize handle needed no work: .reader-note-input already ships resize: vertical in the compiled CSS; style.css is rebuilt only for the new disabled:* utility classes. --- templates/reader.templ | 23 ++++++++++++++++++++--- templates/reader_templ.go | 16 ++++++++-------- web/src/reader/reader.ts | 31 +++++++++++++++++++++++++++++++ web/static/style.css | 2 +- 4 files changed, 60 insertions(+), 12 deletions(-) diff --git a/templates/reader.templ b/templates/reader.templ index 84b7031..aaee80c 100644 --- a/templates/reader.templ +++ b/templates/reader.templ @@ -179,10 +179,17 @@ templ Reader(user User, metadata ReaderMetadata) { class="reader-note-input" placeholder="Note…" > +
@@ -651,14 +658,24 @@ templ ReaderAnnotationsDrawer() { class="reader-note-input" placeholder="Add a note at the current position…" > -