From ee9ae21bd2a65044735d13c6401530e2f143ef15 Mon Sep 17 00:00:00 2001
From: Brian McGee <brian@bmcgee.ie>
Date: Tue, 22 Jul 2025 16:33:53 +0100
Subject: [PATCH] feat(ui): add tanstack devtools for debugging queries

---
 pkgs/clan-app/ui/package-lock.json | 42 +++++++++++++++++++++++++-----
 pkgs/clan-app/ui/package.json      |  1 +
 pkgs/clan-app/ui/src/index.tsx     |  2 ++
 3 files changed, 38 insertions(+), 7 deletions(-)

diff --git a/pkgs/clan-app/ui/package-lock.json b/pkgs/clan-app/ui/package-lock.json
index 80590955f..ddb6d77ff 100644
--- a/pkgs/clan-app/ui/package-lock.json
+++ b/pkgs/clan-app/ui/package-lock.json
@@ -17,6 +17,7 @@
         "@solidjs/router": "^0.15.3",
         "@tanstack/eslint-plugin-query": "^5.51.12",
         "@tanstack/solid-query": "^5.76.0",
+        "@tanstack/solid-query-devtools": "^5.83.0",
         "solid-js": "^1.9.7",
         "solid-toast": "^0.5.0",
         "three": "^0.176.0",
@@ -2281,9 +2282,19 @@
       }
     },
     "node_modules/@tanstack/query-core": {
-      "version": "5.81.5",
-      "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.81.5.tgz",
-      "integrity": "sha512-ZJOgCy/z2qpZXWaj/oxvodDx07XcQa9BF92c0oINjHkoqUPsmm3uG08HpTaviviZ/N9eP1f9CM7mKSEkIo7O1Q==",
+      "version": "5.83.0",
+      "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.83.0.tgz",
+      "integrity": "sha512-0M8dA+amXUkyz5cVUm/B+zSk3xkQAcuXuz5/Q/LveT4ots2rBpPTZOzd7yJa2Utsf8D2Upl5KyjhHRY+9lB/XA==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      }
+    },
+    "node_modules/@tanstack/query-devtools": {
+      "version": "5.81.2",
+      "resolved": "https://registry.npmjs.org/@tanstack/query-devtools/-/query-devtools-5.81.2.tgz",
+      "integrity": "sha512-jCeJcDCwKfoyyBXjXe9+Lo8aTkavygHHsUHAlxQKKaDeyT0qyQNLKl7+UyqYH2dDF6UN/14873IPBHchcsU+Zg==",
       "license": "MIT",
       "funding": {
         "type": "github",
@@ -2291,12 +2302,12 @@
       }
     },
     "node_modules/@tanstack/solid-query": {
-      "version": "5.81.5",
-      "resolved": "https://registry.npmjs.org/@tanstack/solid-query/-/solid-query-5.81.5.tgz",
-      "integrity": "sha512-VqVXaxiJIsKA6B45uApF+RUD3g8Roj/vdAuGpHMjR+RyHqlyQ+hOwgmALkzlbkbIaWCQi8CJOvrbU6WOBuMOxA==",
+      "version": "5.83.0",
+      "resolved": "https://registry.npmjs.org/@tanstack/solid-query/-/solid-query-5.83.0.tgz",
+      "integrity": "sha512-RF8Tv9+6+Kmzj+EafbTzvzzPq+J5SzHtc1Tz3D2MZ/EvlZTH+GL5q4HNnWK3emg7CB6WzyGnTuERmmWJaZs8/w==",
       "license": "MIT",
       "dependencies": {
-        "@tanstack/query-core": "5.81.5"
+        "@tanstack/query-core": "5.83.0"
       },
       "funding": {
         "type": "github",
@@ -2306,6 +2317,23 @@
         "solid-js": "^1.6.0"
       }
     },
+    "node_modules/@tanstack/solid-query-devtools": {
+      "version": "5.83.0",
+      "resolved": "https://registry.npmjs.org/@tanstack/solid-query-devtools/-/solid-query-devtools-5.83.0.tgz",
+      "integrity": "sha512-Z0wQlAWXz/U2bJ/paMRBTDhMoPnB9Te6GmA21sXnI+nDnAAPZRcPxFBiCgYJS3eFsvbkdRGJwoUSQrdIgy0shg==",
+      "license": "MIT",
+      "dependencies": {
+        "@tanstack/query-devtools": "5.81.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      },
+      "peerDependencies": {
+        "@tanstack/solid-query": "^5.83.0",
+        "solid-js": "^1.6.0"
+      }
+    },
     "node_modules/@testing-library/dom": {
       "version": "10.4.0",
       "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.0.tgz",
diff --git a/pkgs/clan-app/ui/package.json b/pkgs/clan-app/ui/package.json
index 83058f844..7301ae997 100644
--- a/pkgs/clan-app/ui/package.json
+++ b/pkgs/clan-app/ui/package.json
@@ -73,6 +73,7 @@
     "@solidjs/router": "^0.15.3",
     "@tanstack/eslint-plugin-query": "^5.51.12",
     "@tanstack/solid-query": "^5.76.0",
+    "@tanstack/solid-query-devtools": "^5.83.0",
     "solid-js": "^1.9.7",
     "solid-toast": "^0.5.0",
     "three": "^0.176.0",
diff --git a/pkgs/clan-app/ui/src/index.tsx b/pkgs/clan-app/ui/src/index.tsx
index cb600d266..46e2576b8 100644
--- a/pkgs/clan-app/ui/src/index.tsx
+++ b/pkgs/clan-app/ui/src/index.tsx
@@ -6,6 +6,7 @@ import { QueryClient, QueryClientProvider } from "@tanstack/solid-query";
 import { Routes } from "@/src/routes";
 import { Router } from "@solidjs/router";
 import { Layout } from "@/src/routes/Layout";
+import { SolidQueryDevtools } from "@tanstack/solid-query-devtools";
 
 export const client = new QueryClient();
 
@@ -25,6 +26,7 @@ if (import.meta.env.DEV) {
 render(
   () => (
     <QueryClientProvider client={client}>
+      {import.meta.env.DEV && <SolidQueryDevtools />}
       <Router root={Layout}>{Routes}</Router>
     </QueryClientProvider>
   ),