feat: implement auth, projects, and frontend foundation

openspec/specs/frontend-foundation/spec.md

@@ -3,12 +3,9 @@
 ## Purpose
 
 Provide a modern React frontend with TypeScript, routing, and responsive layout.
-
 ## Requirements
-
 ### Requirement: React Application Setup
-
-The system SHALL use React 18+ with TypeScript.
+The system SHALL use React 18+ with TypeScript and SHALL provide a runnable application source structure in `apps/web/src`.
 
 #### Scenario: Frontend build
 - GIVEN the frontend codebase
@@ -17,23 +14,24 @@ The system SHALL use React 18+ with TypeScript.
   - Use Vite as the build tool
   - Support Hot Module Replacement (HMR)
   - Output optimized production builds
+  - Include a concrete entrypoint, app composition, and route tree
 
 ### Requirement: Client-Side Routing
-
-The system SHALL implement client-side routing.
+The system SHALL implement client-side routing with authenticated route guards and explicit not-found handling.
 
 #### Scenario: Navigation
 - GIVEN the frontend application
 - THEN React Router SHALL:
-  - Define routes for all pages
+  - Define routes for all foundation pages
   - Support protected routes (require authentication)
   - Handle 404 errors
-  - Support route parameters
+  - Support route parameters for feature pages
 
 #### Scenario: Protected routes
 - GIVEN an unauthenticated user
 - WHEN they access a protected route
-- THEN they are redirected to login
+- THEN they are redirected to login flow
+- AND post-auth navigation returns them to an authenticated landing route
 
 ### Requirement: Styling Framework
 
@@ -48,16 +46,15 @@ The system SHALL use Tailwind CSS for styling.
   - Support dark mode
 
 ### Requirement: Layout Component
-
-The system SHALL provide a consistent application layout.
+The system SHALL provide a consistent application layout for authenticated screens across desktop and mobile sizes.
 
 #### Scenario: Application shell
 - GIVEN the frontend application
 - THEN a Layout component SHALL:
   - Display a header with user info and logout
-  - Display a sidebar with navigation links
+  - Display sidebar navigation on desktop
   - Show main content area
-  - Collapse sidebar on mobile
+  - Collapse sidebar into a mobile menu toggle on small viewports
 
 #### Scenario: Navigation links
 - GIVEN the sidebar navigation
@@ -81,19 +78,17 @@ The system SHALL support mobile devices.
   - Touch targets are appropriately sized
 
 ### Requirement: Loading States
-
-The system SHALL handle asynchronous operations gracefully.
+The system SHALL handle asynchronous operations gracefully during auth bootstrap and dashboard fetches.
 
 #### Scenario: Data fetching
 - GIVEN a page loading data
 - THEN:
-  - Loading spinners/skeletons are shown
-  - Error boundaries catch errors
-  - Retry options are available on failure
+  - Loading states are shown while requests are in flight
+  - Errors are shown with retry affordance
+  - Initial auth-check loading prevents protected-layout flicker
 
 ### Requirement: HTTP Client Configuration
-
-The system SHALL configure HTTP requests properly.
+The system SHALL configure HTTP requests for cookie-based auth and unauthorized-session recovery.
 
 #### Scenario: API communication
 - GIVEN the frontend application
@@ -101,7 +96,7 @@ The system SHALL configure HTTP requests properly.
   - Send credentials (cookies) with requests
   - Handle 401 responses by redirecting to login
   - Set appropriate content-type headers
-  - Support request/response interceptors
+  - Support request/response interception in a shared client module
 
 ### Requirement: Dashboard Page