feat(api,web): auth et first-run — bootstrap admin, login, session, gardes

- api: auth controller/service, config env
- web: App/LoginPage/ProfilePage, garde d'auth, client API, styles
- shared: types/contrats auth
- compose: variables d'environnement first-run

Refs: #14

apps/web/src/App.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useState } from "react";
 import type { Session } from "./api/types";
 import { api } from "./api/client";
+import { isPrivateRoute } from "./auth/routing";
 import { AppShell } from "./layout/AppShell";
 import { AdminPage } from "./pages/AdminPage";
 import { BookPage } from "./pages/BookPage";
@@ -11,7 +12,7 @@ import { ProfilePage } from "./pages/ProfilePage";
 import { ReaderPage } from "./pages/ReaderPage";
 import { SearchPage } from "./pages/SearchPage";
 import { SetupPage } from "./pages/SetupPage";
-import { parseRoute, type Route } from "./router";
+import { navigate, parseRoute, type Route } from "./router";
 
 function renderRoute(route: Route, session: Session, refreshSession: () => Promise<void>) {
   if (route.name === "login") return <LoginPage onSessionChange={refreshSession} />;
@@ -40,9 +41,11 @@ function renderRoute(route: Route, session: Session, refreshSession: () => Promi
 export function App() {
   const [route, setRoute] = useState(parseRoute());
   const [session, setSession] = useState<Session>({ user: null, degraded: false });
+  const [sessionChecked, setSessionChecked] = useState(false);
 
   async function refreshSession() {
     setSession(await api.session());
+    setSessionChecked(true);
   }
 
   useEffect(() => {
@@ -55,5 +58,35 @@ export function App() {
     return () => window.removeEventListener("popstate", listener);
   }, []);
 
+  useEffect(() => {
+    const listener = () => {
+      setSession({ user: null, degraded: false });
+      setSessionChecked(true);
+      if (isPrivateRoute(parseRoute())) navigate("/login");
+    };
+    window.addEventListener("readabook:session-expired", listener);
+    return () => window.removeEventListener("readabook:session-expired", listener);
+  }, []);
+
+  useEffect(() => {
+    if (sessionChecked && !session.user && isPrivateRoute(route)) navigate("/login");
+  }, [route, session.user, sessionChecked]);
+
+  if (!sessionChecked && isPrivateRoute(route)) {
+    return (
+      <div className="auth-surface">
+        <section className="auth-hero">
+          <p>Cabinet de curiosites numerique</p>
+          <h1>ReadaBook</h1>
+          <span>Verification de session.</span>
+        </section>
+      </div>
+    );
+  }
+
+  if (sessionChecked && !session.user && isPrivateRoute(route)) {
+    return <LoginPage onSessionChange={refreshSession} />;
+  }
+
   return renderRoute(route, session, refreshSession);
 }