27 lines
1.4 KiB
Markdown
27 lines
1.4 KiB
Markdown
## Why
|
|
|
|
The project has backend foundations and authentication flows, but the frontend currently has no application code to consume them. We need a usable React foundation so users can authenticate, navigate core areas, and interact with APIs consistently across desktop and mobile.
|
|
|
|
## What Changes
|
|
|
|
- Establish the initial React + TypeScript app structure in `apps/web` with Vite conventions.
|
|
- Add routing skeleton with protected routes, not-found handling, and auth-aware redirects.
|
|
- Implement a baseline app shell (header, sidebar/mobile nav, content area) for authenticated screens.
|
|
- Add shared API client configuration for cookie-based auth and 401 handling.
|
|
- Add initial dashboard scaffolding with loading/error states and placeholder summary cards.
|
|
- Add frontend quality gates and tests/checks for routing/auth behaviors and build integrity.
|
|
|
|
## Capabilities
|
|
|
|
### New Capabilities
|
|
- `frontend-auth-shell`: Auth-aware layout primitives and guarded route flow for the web app.
|
|
|
|
### Modified Capabilities
|
|
- `frontend-foundation`: Tighten requirements around route protection, API credential handling, and responsive authenticated shell behavior.
|
|
|
|
## Impact
|
|
|
|
- Affected app code under `apps/web` (new source tree, routes, layout, API client, styles).
|
|
- Depends on backend auth endpoints (`/auth/login`, `/auth/logout`, `/auth/me`, `/auth/refresh`) for session flow.
|
|
- Introduces frontend config conventions for API base URL and runtime auth assumptions.
|