Editor selected-path state doesn't survive navigation back to Workspace — selectedPathId is local useState, the right panel re-renders with no selection on remount #162

Closed
opened 2026-10-03 17:30:27 +00:00 by Mark · 1 comment
Owner

Finding

The Editor (src/pages/Editor.tsx:175) holds the currently-selected path in a local useState:

const [selectedPathId, setSelectedPathId] = useState<string | null>(null);

When the user navigates from the Editor to the Workspace (via "Back to Workspace") and back to the Editor, the React tree unmounts and the state is gone. The Editor re-hydrates paths from sessionStorage (per #110) but the selection is local state — never persisted.

The user picks a path, edits it, navigates away, comes back, finds no selection. The right panel shows "No nodes selected". The user has to re-click the path.

Where

src/pages/Editor.tsx:175 — const [selectedPathId, setSelectedPathId] = useState<string | null>(null);

Suggested fix shape

Persist selectedPathId in sessionStorage (next to the paths snapshot at line 188-210). On mount, read it back. On unmount/navigation, leave it. The Editor's existing sessionStorage write effect can include selectedPathId in the payload:

sessionStorage.setItem(
  SNAPSHOT_STORAGE_KEY,
  JSON.stringify({
    stitchObjects: pathsToStitchObjects(paths, threadLibrary),
    threadStops: pathsToThreadStops(paths, threadLibrary),
    designSettings: { fileName: filename, selectedPathId },
  })
);

The load effect on mount reads the same shape and sets the state.

Alternative: pass selectedPathId through the existing #110 round-trip bridge (Editor → sessionStorage → Workspace re-hydration) by extending the snapshot payload's designSettings field. Workspace doesn't need to use the value, but the Editor's mount reads it from the same key.

Severity

Low. Quality-of-life: the user re-clicks the path. The state is functionally correct after the re-click.

Discovered by

Gap analysis (2026-10-02) of editor state persistence.

  • #110 (closed) — Editor → Workspace round-trip. The same sessionStorage bridge that carries paths can carry the selection.
  • #150 (closed) — Editor Save button. Selection persistence completes the editor's "editing experience" story.
## Finding The Editor (`src/pages/Editor.tsx:175`) holds the currently-selected path in a local `useState`: ```ts const [selectedPathId, setSelectedPathId] = useState<string | null>(null); ``` When the user navigates from the Editor to the Workspace (via "Back to Workspace") and back to the Editor, the React tree unmounts and the state is gone. The Editor re-hydrates `paths` from `sessionStorage` (per #110) but the selection is local state — never persisted. The user picks a path, edits it, navigates away, comes back, finds no selection. The right panel shows "No nodes selected". The user has to re-click the path. ## Where `src/pages/Editor.tsx:175` — `const [selectedPathId, setSelectedPathId] = useState<string | null>(null);` ## Suggested fix shape Persist `selectedPathId` in `sessionStorage` (next to the paths snapshot at line 188-210). On mount, read it back. On unmount/navigation, leave it. The Editor's existing sessionStorage write effect can include `selectedPathId` in the payload: ```ts sessionStorage.setItem( SNAPSHOT_STORAGE_KEY, JSON.stringify({ stitchObjects: pathsToStitchObjects(paths, threadLibrary), threadStops: pathsToThreadStops(paths, threadLibrary), designSettings: { fileName: filename, selectedPathId }, }) ); ``` The load effect on mount reads the same shape and sets the state. Alternative: pass `selectedPathId` through the existing #110 round-trip bridge (Editor → sessionStorage → Workspace re-hydration) by extending the snapshot payload's `designSettings` field. Workspace doesn't need to use the value, but the Editor's mount reads it from the same key. ## Severity Low. Quality-of-life: the user re-clicks the path. The state is functionally correct after the re-click. ## Discovered by Gap analysis (2026-10-02) of editor state persistence. ## Related - #110 (closed) — Editor → Workspace round-trip. The same sessionStorage bridge that carries paths can carry the selection. - #150 (closed) — Editor Save button. Selection persistence completes the editor's "editing experience" story.
Author
Owner

Fixed in 6c12c23 on main.

Editor now persists selectedPathId through the existing #110/#152 sessionStorage bridge (added to designSettings) and reads it back on mount via a new loadInitialSelectedPathId helper — mirroring the pattern already used for filename. Navigating Editor → Workspace → Editor restores the user's last selection instead of resetting to 'No nodes selected'.

TypeScript clean, vitest 706/706 pass.

Fixed in 6c12c23 on main. Editor now persists `selectedPathId` through the existing #110/#152 sessionStorage bridge (added to `designSettings`) and reads it back on mount via a new `loadInitialSelectedPathId` helper — mirroring the pattern already used for `filename`. Navigating Editor → Workspace → Editor restores the user's last selection instead of resetting to 'No nodes selected'. TypeScript clean, vitest 706/706 pass.
Mark closed this issue 2026-10-03 17:57:33 +00:00
Sign in to join this conversation.
No description provided.