From 792bb27d060cb3e08451579090e1c276f14c71ae Mon Sep 17 00:00:00 2001
From: "Federico Pasqua (eisterman)" <federico.pasqua.96@gmail.com>
Date: Sun, 30 Mar 2025 20:54:53 +0200
Subject: [PATCH] More equal standing moving the sidebar directly inside the
 RootRoute component

---
 src/routes/__root.tsx | 31 +++++++++++++++++++++++++++++--
 src/routes/index.tsx  | 31 +------------------------------
 2 files changed, 30 insertions(+), 32 deletions(-)

diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx
index 5569043..ee16358 100644
--- a/src/routes/__root.tsx
+++ b/src/routes/__root.tsx
@@ -1,10 +1,37 @@
-import { Outlet, createRootRoute } from '@tanstack/react-router';
+import { createRootRoute } from '@tanstack/react-router';
 import { TanStackRouterDevtools } from '@tanstack/react-router-devtools';
 
 export const Route = createRootRoute({
   component: () => (
     <>
-      <Outlet/>
+      <div id="sidebar">
+        <h1>React Router Contacts</h1>
+        <div>
+          <form id="search-form" role="search">
+            <input
+              aria-label="Search contacts"
+              id="q"
+              name="q"
+              placeholder="Search"
+              type="search"
+            />
+            <div aria-hidden hidden={true} id="search-spinner"/>
+          </form>
+          <form method="post">
+            <button type="submit">New</button>
+          </form>
+        </div>
+        <nav>
+          <ul>
+            <li>
+              <a href={`/contacts/1`}>Your Name</a>
+            </li>
+            <li>
+              <a href={`/contacts/2`}>Your Friend</a>
+            </li>
+          </ul>
+        </nav>
+      </div>
       <TanStackRouterDevtools/>
     </>
   ),
diff --git a/src/routes/index.tsx b/src/routes/index.tsx
index 234695d..ca67ac8 100644
--- a/src/routes/index.tsx
+++ b/src/routes/index.tsx
@@ -7,35 +7,6 @@ export const Route = createFileRoute('/')({
 
 function App() {
   return (
-    <>
-      <div id="sidebar">
-        <h1>React Router Contacts</h1>
-        <div>
-          <form id="search-form" role="search">
-            <input
-              aria-label="Search contacts"
-              id="q"
-              name="q"
-              placeholder="Search"
-              type="search"
-            />
-            <div aria-hidden hidden={true} id="search-spinner"/>
-          </form>
-          <form method="post">
-            <button type="submit">New</button>
-          </form>
-        </div>
-        <nav>
-          <ul>
-            <li>
-              <a href={`/contacts/1`}>Your Name</a>
-            </li>
-            <li>
-              <a href={`/contacts/2`}>Your Friend</a>
-            </li>
-          </ul>
-        </nav>
-      </div>
-    </>
+    <div></div>
   );
 }