structure refacto & file documentation

website/src/router/RouteContent.jsx

@@ -0,0 +1,20 @@
+// Rôle : choisit la page à rendre selon la route active.
+import React from "react";
+import { GameRoute } from "../features/games/GameRoute.jsx";
+import { GamesPage } from "../features/games/GamesPage.jsx";
+import { ToolboxesPage, ToolboxPage } from "../features/toolboxes/ToolboxPages.jsx";
+import { AboutPage } from "../pages/AboutPage.jsx";
+import { HomePage } from "../pages/HomePage.jsx";
+import { navigate } from "./hashRouter.js";
+
+export function RouteContent(props) {
+  const { route } = props;
+  if (route === "/") return <HomePage {...props} />;
+  if (route === "/about") return <AboutPage siteContent={props.siteContent} />;
+  if (route === "/toolboxes") return <ToolboxesPage {...props} />;
+  if (route.startsWith("/toolbox/")) return <ToolboxPage {...props} toolboxId={route.split("/")[2]} />;
+  if (route === "/games") return <GamesPage {...props} />;
+  if (route.startsWith("/games/")) return <GameRoute {...props} gameId={route.split("/")[2]} category={route.split("/")[3] || ""} />;
+  navigate("/");
+  return null;
+}

website/src/router/hashRouter.js

@@ -0,0 +1,27 @@
+// Rôle : synchronise la navigation hash avec l'état React.
+import { useEffect, useState } from "react";
+
+function currentRoute() {
+  const hashRoute = location.hash.replace(/^#/, "");
+  if (hashRoute) return hashRoute.replace(/#.+$/, "");
+  const path = location.pathname.replace(/\/+$/, "") || "/";
+  if (path === "/mhwilds") return "/games/mhwilds";
+  if (path === "/mhwilds/monsters") return "/games/mhwilds/monsters";
+  if (path === "/mhwilds/endemic") return "/games/mhwilds/endemic";
+  if (path === "/mhwilds/lists") return "/games/mhwilds/lists";
+  return path;
+}
+
+export function navigate(path) {
+  location.hash = path;
+}
+
+export function useHashRoute() {
+  const [route, setRoute] = useState(currentRoute);
+  useEffect(() => {
+    const onHashChange = () => setRoute(currentRoute());
+    window.addEventListener("hashchange", onHashChange);
+    return () => window.removeEventListener("hashchange", onHashChange);
+  }, []);
+  return route;
+}