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:
@@ -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>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user