René's URL Explorer Experiment

{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"Live word / character count indicator in the chat composer","articleBody":"## Problem or Motivation\n\nOpenWork's chat composer (`FreeFormInput`) gives no feedback about how much\nyou've written. The composer toolbar already surfaces a **context-usage\nindicator** (tokens used / total), a model picker, a thinking-level picker and an\nattach control — but there is **no length feedback for the draft itself**. When\ncomposing a long prompt (a spec, a big paste, a multi-paragraph instruction) you\nhave no glanceable sense of its size.\n\nComparable desktop composers and editors ship exactly this. The **Codex desktop**\ncomposer and editor status bars (VS Code, Google Docs, the Claude/ChatGPT desktop\nmessage boxes) all show a live **word / character count** of what you're\ncurrently typing. It is a small, universally-expected affordance that OpenWork's\notherwise feature-rich composer toolbar is missing.\n\n## Proposed Solution\n\nAdd a small, unobtrusive **draft count indicator** to the composer toolbar\n(left-of-center, next to the attach / working-directory badges, mirroring their\n`!compactMode` rule):\n\n- Shows the **word count** of the current draft inline (e.g. `Words: 12`), only\n  while the composer has non-whitespace text — so the empty composer stays clean.\n- A hover **tooltip** breaks down the full stats: **Words**, **Characters**, and\n  **Lines**.\n- Counts update live on every keystroke (derived from the existing controlled\n  `input` text — no extra state).\n- Hidden in `compactMode` (mirroring the context-usage / thinking / model\n  controls) and hidden entirely when the draft is empty.\n\nThe counting itself (`words` / `characters` / `lines`) lives in a small **pure,\nunit-tested module** so its semantics (Unicode-aware character count,\nwhitespace-collapsing word count, newline-based line count) are locked down\nwithout a DOM.\n\n## Feasibility\n\n**Classification: pure frontend — candidate.** No qwen-code backend involvement.\n\n- The composer already stores the draft as a plain-text string in its controlled\n  `input` state (`FreeFormInput.tsx`); the indicator is pure derived state over\n  that value — no new IPC, no main-process change, no persistence.\n- The indicator reuses the existing composer-toolbar layout (it slots between the\n  left badge group and the flex spacer) and the shared `Tooltip` primitives.\n- Three new i18n keys (`chat.composerWords`, `chat.composerCharacters`,\n  `chat.composerLines`) added to all locales, using a **plural-neutral\n  label form** (`\"Words: {{count}}\"`) so no per-locale plural categories are\n  needed.\n\n## Alternatives Considered\n\n- **Character count only:** simpler, but word count is the more meaningful metric\n  for prose prompts; showing words inline and the full breakdown (words /\n  characters / lines) on hover covers both without clutter.\n- **A live token count of the draft:** more useful in theory but requires a\n  tokenizer that matches the backend model — that is backend-coupled and belongs\n  with the existing context-usage indicator, not a pure-frontend counter.\n- **Always-visible (even when empty):** would clutter the empty composer, which\n  the app deliberately keeps minimal; showing the indicator only when there's\n  content matches the toolbar's other content-dependent affordances.\n\n## Additional Context\n\nFeasibility verified against `apps/electron`: the composer's `input` is a plain\nstring (`coerceInputText`), the `RichTextInput` is a hand-rolled `contentEditable`\nthat fires `onChange` with plain text on every `input` event, and the toolbar's\nbottom row already has a left badge group + flex spacer where the indicator\nslots in cleanly.\n\n### Acceptance criteria (CDP e2e assertion)\n\nA new `e2e/assertions/composer-count.assert.ts` drives the real built app over CDP\nentirely in the draft (no-session) state — no seeded conversation and no backend:\n\n1. The composer's contenteditable renders and, while **empty**, the count\n   indicator (`[data-testid=\"composer-count\"]`) is **absent** — proving it stays\n   hidden for an empty draft.\n2. Real typing (via CDP `Input.insertText` into the focused editor) of\n   `hello world` makes the indicator **appear** with `data-word-count=\"2\"` and\n   `data-char-count=\"11\"` — proving it reflects actual typed content.\n3. Appending more text updates the counts live (word count increases, char count\n   increases) — proving it is reactive per keystroke, not a one-shot render.\n4. Selecting-all and deleting the draft makes the indicator **disappear** again —\n   proving it reacts to the draft becoming empty.\n\nIn addition, the pure counting module ships with unit tests\n(`composer-count.test.ts`) covering empty / whitespace-only input, single vs.\nmultiple words, collapsed internal whitespace, multi-line line counting, and\nUnicode/emoji character counting.\n\nPart of the autonomous desktop-feature loop (`loop-bot`).","author":{"url":"https://github.com/DragonnZhang","@type":"Person","name":"DragonnZhang"},"datePublished":"2026-07-06T01:22:48.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":0},"url":"https://github.com/60/openwork/issues/60"}