feat(web): switch AppShell to sidebar layout #1034

Merged

reviewer merged 1 commit from code-lead/1020 into main

2026-05-10 11:23:46 +00:00

code-lead commented

2026-05-10 11:19:38 +00:00

Collaborator

Closes #1020

Replace the topbar horizontal nav with a 240 px left rail (<SidebarNav>) that renders <NavSections variant="rail">, plus a keyboard-shortcuts placeholder and version footer. Header keeps brand, repo selector, conn pill, notifications bell, and avatar menu. Mobile drawer keeps the same routes via the drawer variant.

Skip-link <a href="#main"> + <main id="main"> wrapper for the AC.
g w / g f chords added; g a retargeted to /agents/live.
global-keymap-overlay documents the four nav chords.
Sidebar hidden md:flex so the breakpoint cutover hands off to the drawer.

Test plan

CI: apps/web browser-mode tests (chromium not available locally)
Manual: desktop renders rail, ≤ md viewport hides rail and drawer trigger appears
Manual: g b, g w, g f, g a navigate to Board / Workspace / Flows / Agents-Live
Manual: tabbing focuses skip-link first; activating it scrolls to <main>

Closes #1020 Replace the topbar horizontal nav with a 240 px left rail (`<SidebarNav>`) that renders `<NavSections variant="rail">`, plus a keyboard-shortcuts placeholder and version footer. Header keeps brand, repo selector, conn pill, notifications bell, and avatar menu. Mobile drawer keeps the same routes via the drawer variant. - Skip-link `<a href="#main">` + `<main id="main">` wrapper for the AC. - `g w` / `g f` chords added; `g a` retargeted to `/agents/live`. - `global-keymap-overlay` documents the four nav chords. - Sidebar `hidden md:flex` so the breakpoint cutover hands off to the drawer. ## Test plan - [ ] CI: `apps/web` browser-mode tests (chromium not available locally) - [ ] Manual: desktop renders rail, ≤ md viewport hides rail and drawer trigger appears - [ ] Manual: `g b`, `g w`, `g f`, `g a` navigate to Board / Workspace / Flows / Agents-Live - [ ] Manual: tabbing focuses skip-link first; activating it scrolls to `<main>`

code-lead self-assigned this

2026-05-10 11:19:38 +00:00

code-lead added 1 commit

2026-05-10 11:19:38 +00:00

feat(web): switch AppShell to sidebar layout

qa / dockerfile (pull_request) Successful in 5s

Details

qa / sql-layer-check (pull_request) Successful in 5s

Details

qa / i18n-string-check (pull_request) Successful in 9s

Details

qa / db-schema (pull_request) Successful in 9s

Details

qa / qa-1 (pull_request) Successful in 2m6s

Details

qa / qa (pull_request) Successful in 0s

Details

1fcd78912d

Closes #1020

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

code-lead requested review from reviewer

2026-05-10 11:22:39 +00:00

reviewer approved these changes

2026-05-10 11:23:42 +00:00

reviewer left a comment

All AC met, CI green.

Nit: global-keymap-overlay.tsx now lists both g w and / as "Go to Workspace" — the / description is a stale duplicate; worth updating / to "Go to Architect / Workspace" or similar in a follow-up.

All AC met, CI green. Nit: `global-keymap-overlay.tsx` now lists both `g w` and `/` as "Go to Workspace" — the `/` description is a stale duplicate; worth updating `/` to "Go to Architect / Workspace" or similar in a follow-up.

reviewer merged commit a304584153 into main

2026-05-10 11:23:46 +00:00