The frontend was a Create React App scaffold (deprecated) where App.tsx was still the stock 'Learn React' boilerplate — the implemented login/register pages and stores were never mounted (no router). This swaps to Vite/TS5, fixes the broken API client, wires a real router + dashboard, and lands on a runnable app. Tooling swap (CRA -> Vite): * Dropped react-scripts, web-vitals, @types/jest; added vite 6 + @vitejs/plugin-react + vitest 3 + jsdom; bumped typescript 4.9 -> 5.6, @types/node 16 -> 22. * New vite.config.ts (with dev-server /api proxy -> backend, no CORS in dev), tsconfig.json (target es2022, moduleResolution bundler, vite/client types), tsconfig.node.json, vite-env.d.ts, root index.html. * .env / .env.example (VITE_API_URL + VITE_API_TARGET). Renamed index.tsx -> main.tsx (theme provider + CssBaseline). Deleted all CRA boilerplate (App.css, logo.svg, App.test.tsx, reportWebVitals.ts, react-app-env.d.ts, CRA index.html/logos/readme) + the orphaned empty web/src/ and mobile/ trees. * node_modules 479MB -> 265MB; lockfile 695KB -> 198KB. API client correctness (services/api.ts): * Env var process.env.REACT_APP_* -> import.meta.env.VITE_*; dropped the hardcoded http://solaria:8001/api (now /api via the dev proxy). * Fixed contract mismatches: getCurrentUser /auth/me -> /users/me; updateMedication PUT -> POST /:id; deleteMedication DELETE -> POST /:id/delete. * Added refreshToken() (/auth/refresh) and server-side logout() (/auth/logout). * Removed the /lab-results block (no backend route). * 401 interceptor now attempts ONE silent refresh (deduped) before bouncing to /login, instead of hard-redirecting on every 401. * CreateMedicationRequest type now matches the backend (required route + profile_id fields). Router + dashboard: * Real App.tsx with BrowserRouter: /login, /register (public), / (protected Dashboard), catch-all -> /. * New Dashboard.tsx: MUI AppBar + welcome card, loads the current user on mount, logout button. The shell feature UIs get built into next. * LoginPage/RegisterPage navigate to / (was /dashboard); store logout is now async; AuthTokens type includes refresh_token. * Minimal MUI theme.ts. Verified: npm run build clean (TS5 strict + Vite), dev server serves the app + proxies /api to the backend, vitest runs. Solaria round-trip confirmed all corrected endpoints (/users/me 200, /auth/refresh 200, /auth/logout 204, medication create 200).
32 lines
875 B
TypeScript
32 lines
875 B
TypeScript
import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
|
|
import { LoginPage } from './pages/LoginPage';
|
|
import { RegisterPage } from './pages/RegisterPage';
|
|
import { Dashboard } from './pages/Dashboard';
|
|
import { ProtectedRoute } from './components/common/ProtectedRoute';
|
|
|
|
function App() {
|
|
return (
|
|
<BrowserRouter>
|
|
<Routes>
|
|
{/* Public routes */}
|
|
<Route path="/login" element={<LoginPage />} />
|
|
<Route path="/register" element={<RegisterPage />} />
|
|
|
|
{/* Protected routes */}
|
|
<Route
|
|
path="/"
|
|
element={
|
|
<ProtectedRoute>
|
|
<Dashboard />
|
|
</ProtectedRoute>
|
|
}
|
|
/>
|
|
|
|
{/* Catch-all -> redirect home */}
|
|
<Route path="*" element={<Navigate to="/" replace />} />
|
|
</Routes>
|
|
</BrowserRouter>
|
|
);
|
|
}
|
|
|
|
export default App;
|