---
plan: "06-01"
phase: 6
subsystem: admin-layout
tags: [layout, sidebar, navigation, refactor]
dependency_graph:
  requires: []
  provides: [AdminSidebar, AppShell, /admin/clients route]
  affects: [src/app/admin/layout.tsx, src/components/admin/AdminSidebar.tsx, src/app/admin/clients/page.tsx, src/app/admin/page.tsx]
tech_stack:
  added: []
  patterns: [AppShell flex-row, active route highlighting via usePathname]
key_files:
  created:
    - src/components/admin/AdminSidebar.tsx
    - src/app/admin/clients/page.tsx
  modified:
    - src/app/admin/layout.tsx
    - src/app/admin/page.tsx
  deleted:
    - src/components/admin/NavBar.tsx
decisions:
  - "AdminSidebar uses usePathname with exact-match flag for /admin to avoid it matching all /admin/* routes"
  - "/admin redirects to /admin/clients as placeholder — real dashboard content in 06-02"
  - "NavBar deleted entirely — AdminSidebar covers all navigation needs"
metrics:
  duration: "~10 minutes"
  completed: "2026-05-31"
  tasks_completed: 4
  tasks_total: 4
---

# Phase 6 Plan 01: Sidebar layout — AdminSidebar + AppShell + move client list to /admin/clients Summary

Replaced the top horizontal NavBar with a persistent left sidebar (AdminSidebar). Admin layout is now a flex-row AppShell. Client list moved from /admin to /admin/clients. /admin redirects to /admin/clients as temporary placeholder until dashboard is built in 06-02.

## Tasks Completed

| Task | Name | Commit | Files |
|------|------|--------|-------|
| 1 | Create AdminSidebar component | 2283740 | src/components/admin/AdminSidebar.tsx |
| 2 | Update AdminLayout to AppShell | 29e0e88 | src/app/admin/layout.tsx |
| 3 | Move client list to /admin/clients | 191b548 | src/app/admin/clients/page.tsx, src/app/admin/page.tsx |
| 4 | Delete NavBar.tsx + verify build | 4d52d87 | src/components/admin/NavBar.tsx (deleted) |

## What Was Built

**AdminSidebar.tsx** — client component with:
- 7 nav links: Dashboard (exact match), Clienti, Progetti, Offerte, Forecast, Catalogo, Impostazioni
- Active route highlighting via `usePathname` with exact-match support for /admin
- Logout button at bottom with `signOut({ callbackUrl: "/admin/login" })`
- Brand green sidebar bg `#1A463C`, 224px fixed width

**AppShell layout** — `layout.tsx` is now `flex min-h-screen`: sidebar (shrink-0, w-56) left + `<main className="flex-1">` right. Removed `max-w-5xl` container constraint.

**Route migration** — `/admin/clients/page.tsx` is a direct copy of the old `/admin/page.tsx` with the archived toggle URL updated from `/admin?archived=1` to `/admin/clients?archived=1`. `/admin/page.tsx` now simply calls `redirect("/admin/clients")`.

## Deviations from Plan

None — plan executed exactly as written.

## Verification

- `npx tsc --noEmit`: PASSED — no errors
- `npm run build`: PASSED — all 22 routes compile, /admin/clients appears as dynamic route
- No NavBar references remain in codebase (`grep` found zero matches)
- NavBar.tsx deleted from src/components/admin/

## Self-Check: PASSED

- [x] src/components/admin/AdminSidebar.tsx — created (2283740)
- [x] src/app/admin/layout.tsx — updated (29e0e88)
- [x] src/app/admin/clients/page.tsx — created (191b548)
- [x] src/app/admin/page.tsx — redirect placeholder (191b548)
- [x] src/components/admin/NavBar.tsx — deleted (4d52d87)
- [x] npm run build passes