Build app layout shell #26

New issue

Open

opened 2026-03-16 22:47:28 +00:00 by austin · 0 comments

austin commented

2026-03-16 22:47:28 +00:00

Owner

The persistent layout that wraps all authenticated pages. This defines the visual structure of the entire app.

What needs to happen

Create a layout component used as a layout route wrapping all authenticated pages:

Left sidebar:
- Current user's name
- List of projects (fetched from API, each links to /projects/{key})
- Logout action (clear session cookie, redirect to /login)
Main content area:
- Renders the child route

Keep it visually minimal. System fonts, sensible spacing, no design library. A clean two-column layout is sufficient.

Key files

web/src/components/Layout.tsx — new
web/src/App.tsx — use as layout route

The persistent layout that wraps all authenticated pages. This defines the visual structure of the entire app. ## What needs to happen Create a layout component used as a layout route wrapping all authenticated pages: - **Left sidebar:** - Current user's name - List of projects (fetched from API, each links to `/projects/{key}`) - Logout action (clear session cookie, redirect to `/login`) - **Main content area:** - Renders the child route Keep it visually minimal. System fonts, sensible spacing, no design library. A clean two-column layout is sufficient. ## Key files - `web/src/components/Layout.tsx` — new - `web/src/App.tsx` — use as layout route