feat: Stage 2 — authentication and setup flow

Backend (tasks 2.1–2.6, 2.10):
- settings_repo: get/set/delete/get_all CRUD for the key-value settings table
- session_repo: create/get/delete/delete_expired for session rows
- setup_service: bcrypt password hashing, one-time-only enforcement,
  run_setup() / is_setup_complete() / get_password_hash()
- auth_service: login() with bcrypt verify + token creation,
  validate_session() with expiry check, logout()
- setup router: GET /api/setup (status), POST /api/setup (201 / 409)
- auth router: POST /api/auth/login (token + HttpOnly cookie),
               POST /api/auth/logout (clears cookie, idempotent)
- SetupRedirectMiddleware: 307 → /api/setup for all API paths until setup done
- require_auth dependency: cookie or Bearer token → Session or 401
- conftest.py: manually bootstraps app.state.db for router tests
  (ASGITransport does not trigger ASGI lifespan)
- 85 tests pass; ruff 0 errors; mypy --strict 0 errors

Frontend (tasks 2.7–2.9):
- types/auth.ts, types/setup.ts, api/auth.ts, api/setup.ts
- AuthProvider: sessionStorage-backed context (isAuthenticated, login, logout)
- RequireAuth: guard component → /login?next=<path> when unauthenticated
- SetupPage: Fluent UI form, client-side validation, inline errors
- LoginPage: single password input, ?next= redirect after success
- DashboardPage: placeholder (full impl Stage 5)
- App.tsx: full route tree (/setup, /login, /, *)
This commit is contained in:
2026-02-28 21:33:30 +01:00
parent 7392c930d6
commit 750785680b
26 changed files with 2075 additions and 49 deletions

View File

@@ -4,39 +4,52 @@
* Wraps the entire application in:
* 1. `FluentProvider` — supplies the Fluent UI theme and design tokens.
* 2. `BrowserRouter` — enables client-side routing via React Router.
* 3. `AuthProvider` — manages session state and exposes `useAuth()`.
*
* Route definitions are delegated to `AppRoutes` (implemented in Stage 3).
* For now a placeholder component is rendered so the app can start and the
* theme can be verified.
* Routes:
* - `/setup` — first-run setup wizard (always accessible, redirected to by backend middleware)
* - `/login` — master password login
* - `/` — dashboard (protected)
* All other paths fall through to the dashboard guard; the full route tree
* is wired up in Stage 3.
*/
import { FluentProvider } from "@fluentui/react-components";
import { BrowserRouter } from "react-router-dom";
import { BrowserRouter, Navigate, Route, Routes } from "react-router-dom";
import { lightTheme } from "./theme/customTheme";
import { AuthProvider } from "./providers/AuthProvider";
import { RequireAuth } from "./components/RequireAuth";
import { SetupPage } from "./pages/SetupPage";
import { LoginPage } from "./pages/LoginPage";
import { DashboardPage } from "./pages/DashboardPage";
/**
* Temporary placeholder shown until full routing is wired up in Stage 3.
*/
function AppPlaceholder(): JSX.Element {
return (
<div style={{ padding: 32, fontFamily: "Segoe UI, sans-serif" }}>
<h1 style={{ fontSize: 28, fontWeight: 600 }}>BanGUI</h1>
<p style={{ fontSize: 14, color: "#605e5c" }}>
Frontend scaffolding complete. Full UI implemented in Stage 3.
</p>
</div>
);
}
/**
* Root application component.
* Mounts `FluentProvider` and `BrowserRouter` around all page content.
* Root application component — mounts providers and top-level routes.
*/
function App(): JSX.Element {
return (
<FluentProvider theme={lightTheme}>
<BrowserRouter>
<AppPlaceholder />
<AuthProvider>
<Routes>
{/* Public routes */}
<Route path="/setup" element={<SetupPage />} />
<Route path="/login" element={<LoginPage />} />
{/* Protected routes */}
<Route
path="/"
element={
<RequireAuth>
<DashboardPage />
</RequireAuth>
}
/>
{/* Fallback — redirect unknown paths to dashboard (guard will redirect to login if needed) */}
<Route path="*" element={<Navigate to="/" replace />} />
</Routes>
</AuthProvider>
</BrowserRouter>
</FluentProvider>
);