From f575f54e59d0d64965c22c6b9b9b80917d5ae99a Mon Sep 17 00:00:00 2001
From: SeanCassiere <33615041+SeanCassiere@users.noreply.github.com>
Date: Mon, 11 Aug 2025 17:08:05 +1200
Subject: [PATCH 1/3] chore(examples): fix router for react/basic

---
 examples/react/basic/src/setup.tsx | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/examples/react/basic/src/setup.tsx b/examples/react/basic/src/setup.tsx
index 44fd4a761..cb6d3c06e 100644
--- a/examples/react/basic/src/setup.tsx
+++ b/examples/react/basic/src/setup.tsx
@@ -2,13 +2,13 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { ReactQueryDevtoolsPanel } from '@tanstack/react-query-devtools'
 import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'
 import {
-  Outlet,
   Link,
-  createRouter,
-  createRoute,
+  Outlet,
+  RouterProvider,
   createRootRoute,
+  createRoute,
+  createRouter,
 } from '@tanstack/react-router'
-import { TanStackRouterDevtools } from '@tanstack/react-router-devtools'
 import { TanstackDevtools } from '@tanstack/react-devtools'
 
 const rootRoute = createRootRoute({
@@ -24,7 +24,6 @@ const rootRoute = createRootRoute({
       </div>
       <hr />
       <Outlet />
-      <TanStackRouterDevtools />
     </>
   ),
 })
@@ -41,7 +40,11 @@ const indexRoute = createRoute({
   },
 })
 function About() {
-  return <div className="p-2">Hello from About!</div>
+  return (
+    <div className="p-2">
+      <h3>Hello from About!</h3>
+    </div>
+  )
 }
 
 const aboutRoute = createRoute({
@@ -72,6 +75,7 @@ export default function DevtoolsExample() {
             },
           ]}
         />
+        <RouterProvider router={router} />
       </QueryClientProvider>
     </>
   )

From 9ba69679e281382e983afc7a4d9c5cdc680e75e9 Mon Sep 17 00:00:00 2001
From: SeanCassiere <33615041+SeanCassiere@users.noreply.github.com>
Date: Mon, 11 Aug 2025 17:10:31 +1200
Subject: [PATCH 2/3] chore(examples): fix router for solid//basic

---
 examples/solid/basic/src/setup.tsx | 26 ++++++++++++++++++++------
 1 file changed, 20 insertions(+), 6 deletions(-)

diff --git a/examples/solid/basic/src/setup.tsx b/examples/solid/basic/src/setup.tsx
index e32edb608..3d814a999 100644
--- a/examples/solid/basic/src/setup.tsx
+++ b/examples/solid/basic/src/setup.tsx
@@ -2,20 +2,28 @@ import { QueryClient, QueryClientProvider } from '@tanstack/solid-query'
 import { SolidQueryDevtools } from '@tanstack/solid-query-devtools'
 import { TanStackRouterDevtoolsPanel } from '@tanstack/solid-router-devtools'
 import {
+  Link,
   Outlet,
-  createRouter,
-  createRoute,
+  RouterProvider,
   createRootRoute,
+  createRoute,
+  createRouter,
 } from '@tanstack/solid-router'
-import { TanStackRouterDevtools } from '@tanstack/solid-router-devtools'
 import { TanstackDevtools } from '@tanstack/solid-devtools'
+
 const rootRoute = createRootRoute({
   component: () => (
     <>
-      <div class="p-2 flex gap-2"></div>
+      <div class="p-2 flex gap-2">
+        <Link to="/" class="[&.active]:font-bold">
+          Home
+        </Link>{' '}
+        <Link to="/about" class="[&.active]:font-bold">
+          About
+        </Link>
+      </div>
       <hr />
       <Outlet />
-      <TanStackRouterDevtools />
     </>
   ),
 })
@@ -32,8 +40,13 @@ const indexRoute = createRoute({
   },
 })
 function About() {
-  return <div class="p-2">Hello from About!</div>
+  return (
+    <div class="p-2">
+      <h3>Hello from About!</h3>
+    </div>
+  )
 }
+
 const aboutRoute = createRoute({
   getParentRoute: () => rootRoute,
   path: '/about',
@@ -65,6 +78,7 @@ export default function DevtoolsExample() {
           },
         ]}
       />
+      <RouterProvider router={router} />
     </>
   )
 }

From e75216789fa562811c6be897ddf91c6f6924f7b9 Mon Sep 17 00:00:00 2001
From: SeanCassiere <33615041+SeanCassiere@users.noreply.github.com>
Date: Mon, 11 Aug 2025 17:14:32 +1200
Subject: [PATCH 3/3] chore(examples): ident between the Solid and React basic
 examples

---
 examples/react/basic/src/index.tsx | 4 +++-
 examples/solid/basic/src/index.tsx | 3 ++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/examples/react/basic/src/index.tsx b/examples/react/basic/src/index.tsx
index 3cc849198..14679c246 100644
--- a/examples/react/basic/src/index.tsx
+++ b/examples/react/basic/src/index.tsx
@@ -1,6 +1,7 @@
 import { createRoot } from 'react-dom/client'
 import Devtools from './setup'
 import { queryPlugin } from './plugin'
+
 setTimeout(() => {
   queryPlugin.emit('test', {
     title: 'Test Event',
@@ -12,10 +13,11 @@ setTimeout(() => {
 queryPlugin.on('test', (event) => {
   console.log('Received test event:', event)
 })
+
 function App() {
   return (
     <div>
-      <h1>TanStack Devtools Basic Example</h1>
+      <h1>TanStack Devtools React Basic Example</h1>
       <Devtools />
     </div>
   )
diff --git a/examples/solid/basic/src/index.tsx b/examples/solid/basic/src/index.tsx
index 9c36c4f7d..dee14b0f7 100644
--- a/examples/solid/basic/src/index.tsx
+++ b/examples/solid/basic/src/index.tsx
@@ -1,9 +1,10 @@
 import { render } from 'solid-js/web'
 import Devtools from './setup'
+
 function App() {
   return (
     <div>
-      <h1>TanStack Devtools Basic Example</h1>
+      <h1>TanStack Devtools Solid Basic Example</h1>
       <Devtools />
     </div>
   )