# Settings Pages (`/settings/*`) Nested layout with sub-navigation tabs: Health Check and Projects. ## Settings Layout ``` +============================================================================+ | CODEWALK DISTRICT | | [ Initiatives ] [ Agents ] [ Inbox ] [*Settings*] | +============================================================================+ | | | Settings | | | | [*Health Check*] [ Projects ] | | ---------------------------------------------------------------- | | | | | | | +============================================================================+ ``` `/settings` redirects to `/settings/health`. --- ## Health Check (`/settings/health`) ``` +============================================================================+ | Settings | | [*Health Check*] [ Projects ] | | ---------------------------------------------------------------- | | [Refresh]| | | | +----------------------------------------------------------------------+ | | | [v] Server Status | | | | | | | | Uptime: 2h 34m 12s | | | | Started: 2026-03-02 10:15:00 | | | +----------------------------------------------------------------------+ | | | | Accounts | | | | +----------------------------------------------------------------------+ | | | [v] user@example.com [claude] [pro] | | | | 2 agents (1 active) Active | | | | | | | | Session 5h [=========> ] 45% resets in 2h 15m | | | | Weekly 7d [====> ] 22% resets in 4d 3h | | | | Sonnet 7d [======> ] 31% resets in 4d 3h | | | | Opus 7d [==> ] 12% resets in 4d 3h | | | | | | | | Extra usage: $2.40 / $50.00 limit | | | +----------------------------------------------------------------------+ | | | | +----------------------------------------------------------------------+ | | | [!] team@company.com [claude] [team] | | | | 0 agents Exhausted until 11:30 AM | | | | | | | | Session 5h [=========================] 100% resets in 0h 45m | | | | Weekly 7d [==================> ] 78% resets in 2d 1h | | | +----------------------------------------------------------------------+ | | | | Projects | | | | +----------------------------------------------------------------------+ | | | [v] backend | | | | github.com/org/backend-api | | | | Clone found | | | +----------------------------------------------------------------------+ | | | | +----------------------------------------------------------------------+ | | | [x] frontend | | | | github.com/org/frontend-app | | | | Clone missing | | | +----------------------------------------------------------------------+ | | | +============================================================================+ ``` ### Account Card Detail ``` +------------------------------------------------------------------------+ | [status-icon] email@example.com [provider] [subscription] | | N agents (M active) Status text | | | | Session 5h [=========> ] 45% resets in 2h 15m | | Weekly 7d [====> ] 22% resets in 4d 3h | | Sonnet 7d [======> ] 31% resets in 4d 3h | | Opus 7d [==> ] 12% resets in 4d 3h | | | | Extra usage: $2.40 / $50.00 limit | +------------------------------------------------------------------------+ ``` Status icons: - `[v]` CheckCircle2 (green) = healthy - `[!]` AlertTriangle (yellow) = exhausted/warning - `[x]` XCircle (red) = error Usage bars are color-coded: - Green < 50% - Yellow 50-80% - Red > 80% ### No Accounts ``` Accounts +----------------------------------------------------------------------+ | No accounts configured. | | Run `cw account add` in the CLI to add an account. | +----------------------------------------------------------------------+ ``` ### Project Health Card ``` +------------------------------------------------------------------------+ | [v] project-name | | github.com/org/repo-url | | Clone found | +------------------------------------------------------------------------+ +------------------------------------------------------------------------+ | [x] project-name | | github.com/org/repo-url | | Clone missing | +------------------------------------------------------------------------+ ``` --- ## Projects (`/settings/projects`) ``` +============================================================================+ | Settings | | [ Health Check ] [*Projects*] | | ---------------------------------------------------------------- | | [ Register Project ] | | | | +----------------------------------------------------------------------+ | | | backend | | | | github.com/org/backend-api | | | | | | | | Default branch: main [pencil] [trash] | | | +----------------------------------------------------------------------+ | | | | +----------------------------------------------------------------------+ | | | frontend | | | | github.com/org/frontend-app | | | | | | | | Default branch: develop [pencil] [trash] | | | +----------------------------------------------------------------------+ | | | +============================================================================+ ``` ### Inline Branch Editing (click pencil) ``` Default branch: [develop________] [enter to save / esc to cancel] ``` Click pencil icon -> input replaces text -> Enter saves, Escape/blur cancels. ### Empty State ``` +============================================================================+ | Settings | | [ Health Check ] [*Projects*] | | ---------------------------------------------------------------- | | | | +----------------------------------------------------------------------+ | | | | | | | No projects registered | | | | | | | | [ Register Project ] | | | | | | | +----------------------------------------------------------------------+ | | | +============================================================================+ ``` ## Source - `packages/web/src/routes/settings.tsx` - `packages/web/src/routes/settings/health.tsx` - `packages/web/src/routes/settings/projects.tsx` - `packages/web/src/components/AccountCard.tsx`