From 27dca150be41d37e73c2d517bc5a8430bdede4eb Mon Sep 17 00:00:00 2001
From: artimath <ryanjhunter@gmail.com>
Date: Sun, 8 Sep 2024 09:38:32 -1000
Subject: [PATCH] replacing StartClient with RouterProvider fixes HMR

---
 examples/react/start-trellaux/app/client.tsx   | 18 ++++++++++++++++--
 .../start-trellaux/app/components/Board.tsx    |  3 +--
 2 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/examples/react/start-trellaux/app/client.tsx b/examples/react/start-trellaux/app/client.tsx
index f16ba73f62..c963388a1d 100644
--- a/examples/react/start-trellaux/app/client.tsx
+++ b/examples/react/start-trellaux/app/client.tsx
@@ -1,7 +1,21 @@
+// import { hydrateRoot } from 'react-dom/client'
+// import { StartClient } from '@tanstack/start'
+// import { createRouter } from './router'
+
+// const router = createRouter()
+
+// hydrateRoot(document.getElementById('root')!, <StartClient router={router} />)
+
+import React from 'react'
 import { hydrateRoot } from 'react-dom/client'
-import { StartClient } from '@tanstack/start'
+import { RouterProvider } from '@tanstack/react-router'
 import { createRouter } from './router'
 
 const router = createRouter()
 
-hydrateRoot(document.getElementById('root')!, <StartClient router={router} />)
+hydrateRoot(
+  document.getElementById('root')!,
+  <React.StrictMode>
+    <RouterProvider router={router} />
+  </React.StrictMode>,
+)
diff --git a/examples/react/start-trellaux/app/components/Board.tsx b/examples/react/start-trellaux/app/components/Board.tsx
index 5c7f388e40..b921da8fc6 100644
--- a/examples/react/start-trellaux/app/components/Board.tsx
+++ b/examples/react/start-trellaux/app/components/Board.tsx
@@ -74,8 +74,8 @@ export function Board({ boardId }: { boardId: string }) {
           }}
         />
       </h1>
-
       <div className="flex flex-grow min-h-0 h-full items-start px-8 pb-4 w-fit">
+        <h1 className="text-2xl text-black">hello123321123312</h1>
         {columns.map((col, index) => {
           return (
             <ColumnComponent
@@ -101,7 +101,6 @@ export function Board({ boardId }: { boardId: string }) {
           }}
         />
       </div>
-
       {/* trolling you to add some extra margin to the right of the container with a whole dang div */}
       <div data-lol className="w-8 h-1 flex-shrink-0" />
     </div>