What happened:
UI layout preferences are lost whenever a page unmounts or the browser is refreshed. Two cases:
- Living UI chat panel: closing the chat panel (via the Hide Chat toggle) is not remembered. If I close the panel, navigate to another page (e.g. main Chat or Tasks), and come back to Living UI, the panel is open again. Same on browser refresh.
- Main Chat task sidebar: resizing the task sidebar (dragging the resize handle) is not remembered. Navigating away and back — or refreshing — snaps it back to the default width.
What I expected:
Layout state should survive navigation and refreshes — the panel stays closed if I closed it, and the sidebar keeps the width I dragged it to — the same way the theme preference already survives navigation.
Steps to reproduce:
Chat panel:
- Open the Living UI page — the chat panel is visible on the right.
- Click the "Hide Chat" toggle to close the panel.
- Navigate to another page, then back to Living UI — the panel is open again. (Refreshing gives the same result.)
Sidebar width:
- Open the main Chat page.
- Drag the resize handle to make the task sidebar noticeably wider or narrower.
- Navigate to another page, then back to Chat — the sidebar is back to the default width. (Refreshing gives the same result.)
Environment: Browser UI (React frontend, app/ui_layer/browser/frontend), macOS, commit 07ddba44, v0.1.0
Logs / screenshots:
No errors in console — this is a state-persistence gap, not a crash.
Notes for the fix:
Both values are plain component state with no persistence, so they reset to their defaults every time the page unmounts:
// src/pages/LivingUI/LivingUIPage.tsx:86
const [showChat, setShowChat] = useState(true)
// src/pages/Chat/ChatPage.tsx:48
const [panelWidth, setPanelWidth] = useState(DEFAULT_PANEL_WIDTH)
The frontend already persists other UI preferences to localStorage (e.g. craftbot-theme in src/contexts/ThemeContext.tsx and lastSeenMessageId in src/contexts/WebSocketContext.tsx), so the fix is to follow the same pattern: initialize each value from localStorage (falling back to the current defaults, with the width re-clamped to MIN_PANEL_WIDTH/MAX_PANEL_WIDTH on load) and write back on toggle / on mouse-up after a drag. A small shared usePersistedState hook would cover both and any future layout state.
What happened:
UI layout preferences are lost whenever a page unmounts or the browser is refreshed. Two cases:
What I expected:
Layout state should survive navigation and refreshes — the panel stays closed if I closed it, and the sidebar keeps the width I dragged it to — the same way the theme preference already survives navigation.
Steps to reproduce:
Chat panel:
Sidebar width:
Environment: Browser UI (React frontend,
app/ui_layer/browser/frontend), macOS, commit07ddba44, v0.1.0Logs / screenshots:
No errors in console — this is a state-persistence gap, not a crash.
Notes for the fix:
Both values are plain component state with no persistence, so they reset to their defaults every time the page unmounts:
The frontend already persists other UI preferences to
localStorage(e.g.craftbot-themeinsrc/contexts/ThemeContext.tsxandlastSeenMessageIdinsrc/contexts/WebSocketContext.tsx), so the fix is to follow the same pattern: initialize each value fromlocalStorage(falling back to the current defaults, with the width re-clamped toMIN_PANEL_WIDTH/MAX_PANEL_WIDTHon load) and write back on toggle / on mouse-up after a drag. A small sharedusePersistedStatehook would cover both and any future layout state.