Home page advertises keyboard shortcuts but Workspace has zero — only the Editor has shortcuts (8 tool keys + Ctrl+Z/Y/A/D); the bulk-of-time surface is shortcut-less #156

New issue

Closed

opened 2026-10-03 16:05:51 +00:00 by Mark · 1 comment

Mark commented

2026-10-03 16:05:51 +00:00

Owner

Finding

The Home page feature grid advertises "Keyboard shortcuts: Power through designs with shortcuts for every tool and action" (src/pages/Home.tsx, the feature cards section). The Help page mentions "keyboard shortcuts" implicitly via the editor's useKeyboardShortcuts hook.

The Workspace has no global keyboard shortcuts. Verified by searching for addEventListener('keydown' in src/components/workspace/ — only the BottomThreadBar's AlternativesPopover has one (Escape to close), and the AppHeader's filename edit (Enter/Escape).

The only tool action shortcuts in the entire app are in the Editor (src/components/editor/useKeyboardShortcuts.ts):

n → select_nodes
a → add_node
d → delete_node
c → convert_node
p → draw_path
s → scissors
m → smooth
z → zoom
Ctrl+Z / Ctrl+Shift+Z → undo / redo
Ctrl+A → select all
Delete / Backspace → delete selection
Tab → cycle nodes
Enter / Escape → finish / cancel path draw

The Workspace — where the user spends the bulk of their time — has none. The home page promise is unfulfilled for the Workspace.

Where

Home page claim: src/pages/Home.tsx (the "Keyboard shortcuts" feature card)
Editor shortcuts: src/components/editor/useKeyboardShortcuts.ts
Workspace: src/components/workspace/ — no global shortcut handler

Suggested fix shape

Add a useKeyboardShortcuts hook in the Workspace that mirrors the editor's shape. Reasonable scope for a first pass:

Ctrl+Z / Ctrl+Shift+Z → undo / redo (the Workspace's reducer has history state; this is the highest-priority shortcut)
Delete / Backspace → delete selected stitch objects
Ctrl+S → save current design to gallery (currently requires clicking the "Save to Gallery" button)
Ctrl+D → trigger auto-digitize (with confirmation if a design is already digitized)
? → open the help page (or show a shortcut cheatsheet modal)
Escape → deselect all, close any open dialog

The hook should match the editor's pattern: skip the shortcut if focus is in an <input>, <textarea>, or <select>. Otherwise the user can't type in the Hoop Size dropdown without triggering "Save".

The Help page should list the shortcuts; the Workspace could also show a "Press ? for shortcuts" hint in the toolbar.

Severity

Medium. The feature is advertised but not implemented. Power users will notice; casual users won't.

Discovered by

Gap analysis (2026-10-02) of workspace affordances.

#92 (closed) — fixed the Workspace's undo/redo. The keyboard shortcut for it is still missing.
The editor's useKeyboardShortcuts is the model; copy the shape.

## Finding The Home page feature grid advertises "Keyboard shortcuts: Power through designs with shortcuts for every tool and action" (`src/pages/Home.tsx`, the feature cards section). The Help page mentions "keyboard shortcuts" implicitly via the editor's `useKeyboardShortcuts` hook. **The Workspace has no global keyboard shortcuts.** Verified by searching for `addEventListener('keydown'` in `src/components/workspace/` — only the BottomThreadBar's AlternativesPopover has one (Escape to close), and the AppHeader's filename edit (Enter/Escape). The only tool action shortcuts in the entire app are in the Editor (`src/components/editor/useKeyboardShortcuts.ts`): - `n` → select_nodes - `a` → add_node - `d` → delete_node - `c` → convert_node - `p` → draw_path - `s` → scissors - `m` → smooth - `z` → zoom - `Ctrl+Z` / `Ctrl+Shift+Z` → undo / redo - `Ctrl+A` → select all - `Delete` / `Backspace` → delete selection - `Tab` → cycle nodes - `Enter` / `Escape` → finish / cancel path draw The Workspace — where the user spends the bulk of their time — has none. The home page promise is unfulfilled for the Workspace. ## Where - Home page claim: `src/pages/Home.tsx` (the "Keyboard shortcuts" feature card) - Editor shortcuts: `src/components/editor/useKeyboardShortcuts.ts` - Workspace: `src/components/workspace/` — no global shortcut handler ## Suggested fix shape Add a `useKeyboardShortcuts` hook in the Workspace that mirrors the editor's shape. Reasonable scope for a first pass: - `Ctrl+Z` / `Ctrl+Shift+Z` → undo / redo (the Workspace's reducer has `history` state; this is the highest-priority shortcut) - `Delete` / `Backspace` → delete selected stitch objects - `Ctrl+S` → save current design to gallery (currently requires clicking the "Save to Gallery" button) - `Ctrl+D` → trigger auto-digitize (with confirmation if a design is already digitized) - `?` → open the help page (or show a shortcut cheatsheet modal) - `Escape` → deselect all, close any open dialog The hook should match the editor's pattern: skip the shortcut if focus is in an `<input>`, `<textarea>`, or `<select>`. Otherwise the user can't type in the Hoop Size dropdown without triggering "Save". The Help page should list the shortcuts; the Workspace could also show a "Press ? for shortcuts" hint in the toolbar. ## Severity Medium. The feature is advertised but not implemented. Power users will notice; casual users won't. ## Discovered by Gap analysis (2026-10-02) of workspace affordances. ## Related - #92 (closed) — fixed the Workspace's undo/redo. The keyboard shortcut for it is still missing. - The editor's `useKeyboardShortcuts` is the model; copy the shape.

Mark added the

feature-request

triage-approved

labels

2026-10-03 16:05:51 +00:00

Mark referenced this issue from a commit

2026-10-03 17:18:40 +00:00

fix(#156): Workspace now has global keyboard shortcuts + Help cheatsheet (#156)

Mark commented

2026-10-03 17:28:31 +00:00

Author

Owner

Fixed in commit fb4ed81 on main. Workspace now has a global useKeyboardShortcuts hook (mirrors the editor hook shape) that delivers the surface advertised on the Home page:

v / z — select / zoom tool
Ctrl/Cmd + Z / Shift+Z — undo / redo (+ Ctrl+Y redo alias)
Ctrl/Cmd + S — save to Gallery
Ctrl/Cmd + D — duplicate selected (Ctrl+Shift+D = auto-digitize; chose shift to keep Ctrl+D for muscle memory)
Ctrl/Cmd + E — open Export dialog
Ctrl/Cmd + A — select all (digitized → stitchObjects, digitizing → colorRegions)
Ctrl/Cmd + G / Shift+G — group / ungroup
Ctrl/Cmd + + / - / 0 — zoom in / out / reset viewport
Delete / Backspace — delete selected
Escape — deselect (or close Help when open)
? — toggle Help modal

The Help modal now renders the shortcut cheatsheet (was a placeholder). The LeftToolbar shows a small "? help" hint at the bottom. The hook skips events whose target is //<select>/contentEditable, so typing in the Hoop Size dropdown will not trigger Save.</p> <p dir="auto">22 new tests in <code>useKeyboardShortcuts.test.ts</code> cover every shortcut, the input/textarea/select skip path, modifier-vs-letter conflicts, and unmount cleanup. Full suite: 675/675 pass. tsc + eslint clean. CI for <a href="/Mark/Kimi_Agent_Brother_10_Digitizing_App/commit/fb4ed81" class="commit"><code class="nohighlight">fb4ed81</code></a> is still queued ("Waiting to run" — substrate-side issue affecting every recent commit, not specific to this change).</p> </body></html>

Fixed in commit fb4ed81 on main. Workspace now has a global `useKeyboardShortcuts` hook (mirrors the editor hook shape) that delivers the surface advertised on the Home page: - v / z — select / zoom tool - Ctrl/Cmd + Z / Shift+Z — undo / redo (+ Ctrl+Y redo alias) - Ctrl/Cmd + S — save to Gallery - Ctrl/Cmd + D — duplicate selected (Ctrl+Shift+D = auto-digitize; chose shift to keep Ctrl+D for muscle memory) - Ctrl/Cmd + E — open Export dialog - Ctrl/Cmd + A — select all (digitized → stitchObjects, digitizing → colorRegions) - Ctrl/Cmd + G / Shift+G — group / ungroup - Ctrl/Cmd + + / - / 0 — zoom in / out / reset viewport - Delete / Backspace — delete selected - Escape — deselect (or close Help when open) - ? — toggle Help modal The Help modal now renders the shortcut cheatsheet (was a placeholder). The LeftToolbar shows a small "? help" hint at the bottom. The hook skips events whose target is <input>/<textarea>/<select>/contentEditable, so typing in the Hoop Size dropdown will not trigger Save. 22 new tests in `useKeyboardShortcuts.test.ts` cover every shortcut, the input/textarea/select skip path, modifier-vs-letter conflicts, and unmount cleanup. Full suite: 675/675 pass. tsc + eslint clean. CI for fb4ed81 is still queued ("Waiting to run" — substrate-side issue affecting every recent commit, not specific to this change).

Mark

2026-10-03 17:28:35 +00:00