From 055e7b2e63d5ce8de6dc1d62bd3b5cc62529738d Mon Sep 17 00:00:00 2001
From: Tom Boullay <tom@famille-boullay.fr>
Date: Mon, 27 Apr 2026 16:32:23 +0200
Subject: [PATCH] fix: address docs routing review

---
 package-lock.json                      |  3 ++
 package.json                           |  3 ++
 src/pages/docs/DocsLayout.tsx          |  2 +-
 src/pages/docs/DocsRouteComponents.tsx | 71 ++++++++++++++++++++++++++
 src/pages/docs/docsSections.ts         |  2 +-
 src/pages/docs/features/page.tsx       |  2 +-
 src/router.tsx                         | 22 ++++----
 7 files changed, 92 insertions(+), 13 deletions(-)
 create mode 100644 src/pages/docs/DocsRouteComponents.tsx

diff --git a/package-lock.json b/package-lock.json
index 780e0ac..f4ed152 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -39,6 +39,9 @@
         "typescript": "~6.0.2",
         "typescript-eslint": "^8.58.0",
         "vite": "^8.0.4"
+      },
+      "engines": {
+        "node": ">=20.19"
       }
     },
     "node_modules/@babel/code-frame": {
diff --git a/package.json b/package.json
index 125d289..5efdd4c 100644
--- a/package.json
+++ b/package.json
@@ -3,6 +3,9 @@
   "private": true,
   "version": "0.0.1",
   "type": "module",
+  "engines": {
+    "node": ">=20.19"
+  },
   "scripts": {
     "dev": "vite",
     "build": "tsc -b && vite build",
diff --git a/src/pages/docs/DocsLayout.tsx b/src/pages/docs/DocsLayout.tsx
index 9c8bce6..8be87ed 100644
--- a/src/pages/docs/DocsLayout.tsx
+++ b/src/pages/docs/DocsLayout.tsx
@@ -13,7 +13,7 @@ export function DocsLayout(): React.JSX.Element {
             <Link
               className="docs-home-link"
               to="/"
-              aria-label="Retour a l'accueil"
+              aria-label="Retour à l'accueil"
             >
               <Home size={18} strokeWidth={2.25} aria-hidden="true" />
             </Link>
diff --git a/src/pages/docs/DocsRouteComponents.tsx b/src/pages/docs/DocsRouteComponents.tsx
new file mode 100644
index 0000000..764e787
--- /dev/null
+++ b/src/pages/docs/DocsRouteComponents.tsx
@@ -0,0 +1,71 @@
+import { Suspense, lazy } from "react";
+
+const LazyDocsLayout = lazy(() =>
+  import("@/pages/docs/DocsLayout").then((module) => ({
+    default: module.DocsLayout,
+  })),
+);
+
+const LazyDocsReadmePage = lazy(() =>
+  import("@/pages/docs/page").then((module) => ({
+    default: module.DocsReadmePage,
+  })),
+);
+
+const LazyDocsArchitecturePage = lazy(() =>
+  import("@/pages/docs/architecture/page").then((module) => ({
+    default: module.DocsArchitecturePage,
+  })),
+);
+
+const LazyDocsTargetArchitecturePage = lazy(() =>
+  import("@/pages/docs/target-architecture/page").then((module) => ({
+    default: module.DocsTargetArchitecturePage,
+  })),
+);
+
+const LazyDocsFeaturesPage = lazy(() =>
+  import("@/pages/docs/features/page").then((module) => ({
+    default: module.DocsFeaturesPage,
+  })),
+);
+
+export function DocsLayoutRoute(): React.JSX.Element {
+  return (
+    <Suspense fallback={null}>
+      <LazyDocsLayout />
+    </Suspense>
+  );
+}
+
+export function DocsReadmeRoute(): React.JSX.Element {
+  return (
+    <Suspense fallback={null}>
+      <LazyDocsReadmePage />
+    </Suspense>
+  );
+}
+
+export function DocsArchitectureRoute(): React.JSX.Element {
+  return (
+    <Suspense fallback={null}>
+      <LazyDocsArchitecturePage />
+    </Suspense>
+  );
+}
+
+export function DocsTargetArchitectureRoute(): React.JSX.Element {
+  return (
+    <Suspense fallback={null}>
+      <LazyDocsTargetArchitecturePage />
+    </Suspense>
+  );
+}
+
+export function DocsFeaturesRoute(): React.JSX.Element {
+  return (
+    <Suspense fallback={null}>
+      <LazyDocsFeaturesPage />
+    </Suspense>
+  );
+}
diff --git a/src/pages/docs/docsSections.ts b/src/pages/docs/docsSections.ts
index 3bbc201..13444ce 100644
--- a/src/pages/docs/docsSections.ts
+++ b/src/pages/docs/docsSections.ts
@@ -26,7 +26,7 @@ export const docSections: DocSection[] = [
   },
   {
     path: "/docs/features",
-    title: "Fonctionnalites",
+    title: "Fonctionnalités",
     subtitle: "Implemented scope",
     meta: "04",
   },
diff --git a/src/pages/docs/features/page.tsx b/src/pages/docs/features/page.tsx
index e1a510f..926259f 100644
--- a/src/pages/docs/features/page.tsx
+++ b/src/pages/docs/features/page.tsx
@@ -8,7 +8,7 @@ export function DocsFeaturesPage(): React.JSX.Element {
       content={features}
       frContent={featuresFr}
       meta="04"
-      title="Fonctionnalites"
+      title="Fonctionnalités"
     />
   );
 }
diff --git a/src/router.tsx b/src/router.tsx
index f507a2f..ba4381d 100644
--- a/src/router.tsx
+++ b/src/router.tsx
@@ -5,11 +5,13 @@ import {
   createRouter,
 } from "@tanstack/react-router";
 import { HomePage } from "@/pages/HomePage";
-import { DocsArchitecturePage } from "@/pages/docs/architecture/page";
-import { DocsLayout } from "@/pages/docs/DocsLayout";
-import { DocsFeaturesPage } from "@/pages/docs/features/page";
-import { DocsReadmePage } from "@/pages/docs/page";
-import { DocsTargetArchitecturePage } from "@/pages/docs/target-architecture/page";
+import {
+  DocsArchitectureRoute,
+  DocsFeaturesRoute,
+  DocsLayoutRoute,
+  DocsReadmeRoute,
+  DocsTargetArchitectureRoute,
+} from "@/pages/docs/DocsRouteComponents";
 
 const rootRoute = createRootRoute({
   component: Outlet,
@@ -24,31 +26,31 @@ const indexRoute = createRoute({
 const docsRoute = createRoute({
   getParentRoute: () => rootRoute,
   path: "/docs",
-  component: DocsLayout,
+  component: DocsLayoutRoute,
 });
 
 const docsIndexRoute = createRoute({
   getParentRoute: () => docsRoute,
   path: "/",
-  component: DocsReadmePage,
+  component: DocsReadmeRoute,
 });
 
 const docsArchitectureRoute = createRoute({
   getParentRoute: () => docsRoute,
   path: "/architecture",
-  component: DocsArchitecturePage,
+  component: DocsArchitectureRoute,
 });
 
 const docsTargetArchitectureRoute = createRoute({
   getParentRoute: () => docsRoute,
   path: "/target-architecture",
-  component: DocsTargetArchitecturePage,
+  component: DocsTargetArchitectureRoute,
 });
 
 const docsFeaturesRoute = createRoute({
   getParentRoute: () => docsRoute,
   path: "/features",
-  component: DocsFeaturesPage,
+  component: DocsFeaturesRoute,
 });
 
 const routeTree = rootRoute.addChildren([