d39bd1423a
TASK-09-01: client/package.json — add react-router-dom@^7 (no chart lib). TASK-09-02: client/src/main.tsx (BrowserRouter wrapper) + App.tsx (Routes switch: / → VoiceSession, /operator/login → Login, /operator/dashboard → Dashboard, * → VoiceSession fallback). R-DASH-05: voice UI at / unchanged. Extracted VoiceSession.tsx from App.tsx to preserve the existing UI. TASK-09-03: client/src/operator/Login.tsx — login form (POST /api/operator/login, navigate to dashboard, 401/429/503 error states, keyboard-accessible). TASK-09-04: client/src/operator/Dashboard.tsx — auth gate (GET /me on mount, redirect to /operator/login on 401), operator name, 3 view tabs, freshness indicator, logout button. TASK-09-05: client/src/operator/Sparkline.tsx — inline SVG sparkline (~50 LOC, zero deps, handles empty/single/all-same, stroke=currentColor). TASK-09-06: 3 view components (PracticeVolume, MasteryProgression, FailurePatterns) — fetch /api/operator/<view>, read-only tables + sparklines, suppressed cells → '— (<10 learners)', loading/error/no-data states. TASK-09-07: client/src/operator/__tests__/Dashboard.test.tsx (17 tests via vitest + @testing-library/react) — auth gate, login, suppressedLabel, sparkline, formatFreshness, no PII in DOM. vitest.config.ts + test-setup.ts + devDeps (vitest, testing-library, jsdom). npm run build + typecheck + test all pass. ---ci--- project: praxis phase: 2 milestone: v0.4 status: execute persona: frontend-engineer task: 09-01..09-07 requirements: covered: [REQ-DASH-01, REQ-NFR-DASH-01] ---/ci---
React + TypeScript + Vite
This template provides a minimal setup to get React working in Vite with HMR and some Oxlint rules.
Currently, two official plugins are available:
- @vitejs/plugin-react uses Oxc
- @vitejs/plugin-react-swc uses SWC
React Compiler
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see this documentation.
Expanding the Oxlint configuration
If you are developing a production application, we recommend enabling type-aware lint rules by installing oxlint-tsgolint and editing .oxlintrc.json:
{
"$schema": "./node_modules/oxlint/configuration_schema.json",
"plugins": ["react", "typescript", "oxc"],
"options": {
"typeAware": true
},
"rules": {
"react/rules-of-hooks": "error",
"react/only-export-components": ["warn", { "allowConstantExport": true }]
}
}
See the Oxlint rules documentation for the full list of rules and categories.