Editor has no help link — workspace and gallery have nav links to /help but the editor's header is a dead-end if the user wants to look up a feature #227

Closed
opened 2026-10-04 02:13:18 +00:00 by Mark · 1 comment
Owner

Finding

src/components/editor/EditorHeader.tsx (the editor's top bar) has the Save button, totals, the title, and the "Back to Workspace" Link. There's no "Help" link or icon to navigate to /help.

src/components/workspace/AppHeader.tsx and src/components/gallery/GalleryHeader.tsx (or equivalent) — both have a Help nav link in their primary navigation. The editor's omission is the odd one out.

A user editing a path who wants to look up "what does the scissors tool do":

  • Clicks the gear icon for Settings
  • Hmm, no help link in the modal either
  • Has to navigate back to /workspace or /gallery, then click Help
  • Then navigate back to /editor (which may have unsaved changes — per #184, the back nav is silent)

The flow is friction.

Where

  • Editor header: src/components/editor/EditorHeader.tsx (no help link)
  • Workspace header: src/components/workspace/AppHeader.tsx (help link present)
  • Gallery header: per #151 the gallery has the help link in the nav

Suggested fix shape

Add a small "?" icon button to the editor header (next to the Settings gear):

<button
  onClick={() => navigate('/help')}
  aria-label="Open help"
  title="Open help"
  className="w-9 h-9 flex items-center justify-center rounded-lg"
  style={{ color: '#6B6560' }}
>
  <HelpCircle size={14} />
</button>

The navigate goes to /help and the user can use the browser's back button to return. The unsaved-changes warning (per #184) fires on the back-to-workspace link but the help navigation is read-only so no warning is needed.

Optionally: the help page can be opened in a new tab (target="_blank") so the user can reference it without leaving the editor.

Severity

Low. The user can navigate to Help via the workspace/gallery. The editor's missing link is a friction issue.

Discovered by

Gap analysis (2026-10-02) of editor navigation.

  • #184 (open) — Editor back-to-workspace silent nav. The same surface; the help link is a safer alternative.
  • The help page is a sibling of the editor; users would benefit from cross-linking.
## Finding `src/components/editor/EditorHeader.tsx` (the editor's top bar) has the Save button, totals, the title, and the "Back to Workspace" Link. There's no "Help" link or icon to navigate to `/help`. `src/components/workspace/AppHeader.tsx` and `src/components/gallery/GalleryHeader.tsx` (or equivalent) — both have a Help nav link in their primary navigation. The editor's omission is the odd one out. A user editing a path who wants to look up "what does the scissors tool do": - Clicks the gear icon for Settings - Hmm, no help link in the modal either - Has to navigate back to /workspace or /gallery, then click Help - Then navigate back to /editor (which may have unsaved changes — per #184, the back nav is silent) The flow is friction. ## Where - Editor header: `src/components/editor/EditorHeader.tsx` (no help link) - Workspace header: `src/components/workspace/AppHeader.tsx` (help link present) - Gallery header: per #151 the gallery has the help link in the nav ## Suggested fix shape Add a small "?" icon button to the editor header (next to the Settings gear): ```tsx <button onClick={() => navigate('/help')} aria-label="Open help" title="Open help" className="w-9 h-9 flex items-center justify-center rounded-lg" style={{ color: '#6B6560' }} > <HelpCircle size={14} /> </button> ``` The navigate goes to `/help` and the user can use the browser's back button to return. The unsaved-changes warning (per #184) fires on the back-to-workspace link but the help navigation is read-only so no warning is needed. Optionally: the help page can be opened in a new tab (`target="_blank"`) so the user can reference it without leaving the editor. ## Severity Low. The user can navigate to Help via the workspace/gallery. The editor's missing link is a friction issue. ## Discovered by Gap analysis (2026-10-02) of editor navigation. ## Related - #184 (open) — Editor back-to-workspace silent nav. The same surface; the help link is a safer alternative. - The help page is a sibling of the editor; users would benefit from cross-linking.
Author
Owner

Shipped via commit 3dcbcb6 on main.

A note on what shipped vs. what the issue suggested:

  • The editor header already has a HelpCircle icon (#181) — it opens an in-context popover listing every keyboard shortcut. The issue's premise ("no Help link or icon") was based on a pre-#181 read of the header.
  • A second <button onClick={() => navigate('/help')}> next to the gear would have competed with the existing popover and forced a navigation decision on every click. Instead the fix adds an "Open full help guide →" link inside the popover footer (data-testid editor-shortcuts-view-full-help). The popover stays the discoverability answer; the link is the bridge to the broader /help reference (machine compatibility, thread/hoop specs, feature explanations).
  • The issue also mentioned "clicks the gear icon for Settings" — there's no Settings gear in the editor header; Settings lives in the workspace header. Same header surface (#184) family.

Tests: 2 new (link hidden when popover closed; link points to /help when open). Full vitest 1123 pass + eslint + tsc clean.

Shipped via commit 3dcbcb6 on main. A note on what shipped vs. what the issue suggested: - The editor header already has a HelpCircle icon (#181) — it opens an in-context popover listing every keyboard shortcut. The issue's premise ("no Help link or icon") was based on a pre-#181 read of the header. - A second `<button onClick={() => navigate('/help')}>` next to the gear would have competed with the existing popover and forced a navigation decision on every click. Instead the fix adds an "Open full help guide →" link inside the popover footer (data-testid `editor-shortcuts-view-full-help`). The popover stays the discoverability answer; the link is the bridge to the broader `/help` reference (machine compatibility, thread/hoop specs, feature explanations). - The issue also mentioned "clicks the gear icon for Settings" — there's no Settings gear in the editor header; Settings lives in the workspace header. Same header surface (#184) family. Tests: 2 new (link hidden when popover closed; link points to /help when open). Full vitest 1123 pass + eslint + tsc clean.
Mark closed this issue 2026-10-04 05:29:12 +00:00
Sign in to join this conversation.
No description provided.