From fdc9408666f8a79dfbc1e040cc4b5fabc669ada3 Mon Sep 17 00:00:00 2001
From: Florian Schroedl <flo.schroedl@gmail.com>
Date: Tue, 23 Jan 2024 15:50:45 +0100
Subject: [PATCH] Add Dashboard route

---
 package.json                 |  2 ++
 src/components/main/Root.tsx | 16 ++++++++++++++--
 yarn.lock                    | 20 ++++++++++++++++++++
 3 files changed, 36 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index 383f15e..c7853fd 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,8 @@
     "ramda": "^0.29.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-router": "^6.21.3",
+    "react-router-dom": "^6.21.3",
     "recharts": "^2.10.4",
     "tailwind-merge": "^2.2.0",
     "tailwindcss-animate": "^1.0.7",
diff --git a/src/components/main/Root.tsx b/src/components/main/Root.tsx
index a09a143..ceeb806 100644
--- a/src/components/main/Root.tsx
+++ b/src/components/main/Root.tsx
@@ -7,6 +7,7 @@ import {
   persistStorage,
 } from "@/components/main/lib/state";
 import { mergeDeepRight } from "ramda";
+import { createBrowserRouter, RouterProvider } from "react-router-dom";
 
 const STORAGE_KEY = "ecoplanet";
 
@@ -21,12 +22,23 @@ const App: React.FC = () => {
     setState(mergeDeepRight(state, newState));
   };
 
+  const router = createBrowserRouter([
+    {
+      path: "/",
+      element: <Dashboard state={state} updateState={updateState} />,
+    },
+    {
+      path: "/options",
+      element: <div>Hello world!</div>,
+    },
+  ]);
+
   return (
     <div className="fixed top-0 right-0 bottom-0 left-0 flex">
       <main className="flex grow flex-col">
         <nav className="flex p-3 border-b border-solid border-slate-300"></nav>
-        <div className="flex grow items-center justify-center h-full w-full">
-          <Dashboard state={state} updateState={updateState} />
+        <div className="flex grow items-center justify-center h-full w-full bg-muted">
+          <RouterProvider router={router} />
         </div>
       </main>
     </div>
diff --git a/yarn.lock b/yarn.lock
index 9490466..2b8f644 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -492,6 +492,11 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-compose-refs" "1.0.1"
 
+"@remix-run/router@1.14.2":
+  version "1.14.2"
+  resolved "https://registry.yarnpkg.com/@remix-run/router/-/router-1.14.2.tgz#4d58f59908d9197ba3179310077f25c88e49ed17"
+  integrity sha512-ACXpdMM9hmKZww21yEqWwiLws/UPLhNKvimN8RrYSqPSvB3ov7sLvAcfvaxePeLvccTQKGdkDIhLYApZVDFuKg==
+
 "@rollup/rollup-android-arm-eabi@4.9.5":
   version "4.9.5"
   resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.9.5.tgz#b752b6c88a14ccfcbdf3f48c577ccc3a7f0e66b9"
@@ -2010,6 +2015,21 @@ react-refresh@^0.14.0:
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.14.0.tgz#4e02825378a5f227079554d4284889354e5f553e"
   integrity sha512-wViHqhAd8OHeLS/IRMJjTSDHF3U9eWi62F/MledQGPdJGDhodXJ9PBLNGr6WWL7qlH12Mt3TyTpbS+hGXMjCzQ==
 
+react-router-dom@^6.21.3:
+  version "6.21.3"
+  resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.21.3.tgz#ef3a7956a3699c7b82c21fcb3dbc63c313ed8c5d"
+  integrity sha512-kNzubk7n4YHSrErzjLK72j0B5i969GsuCGazRl3G6j1zqZBLjuSlYBdVdkDOgzGdPIffUOc9nmgiadTEVoq91g==
+  dependencies:
+    "@remix-run/router" "1.14.2"
+    react-router "6.21.3"
+
+react-router@6.21.3, react-router@^6.21.3:
+  version "6.21.3"
+  resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.21.3.tgz#8086cea922c2bfebbb49c6594967418f1f167d70"
+  integrity sha512-a0H638ZXULv1OdkmiK6s6itNhoy33ywxmUFT/xtSoVyf9VnC7n7+VT4LjVzdIHSaF5TIh9ylUgxMXksHTgGrKg==
+  dependencies:
+    "@remix-run/router" "1.14.2"
+
 react-smooth@^2.0.5:
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/react-smooth/-/react-smooth-2.0.5.tgz#d153b7dffc7143d0c99e82db1532f8cf93f20ecd"