debug: Add react-grab (#979)

brendan-kellam · web-flow · commit f6c7f5caec8f · 2026-03-05T10:49:00.000-08:00
diff --git a/packages/web/package.json b/packages/web/package.json
@@ -196,6 +196,7 @@
   "devDependencies": {
     "@eslint/eslintrc": "^3",
     "@react-email/preview-server": "5.2.8",
+    "@react-grab/mcp": "^0.1.23",
     "@tanstack/eslint-plugin-query": "^5.74.7",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/react": "^16.3.0",
@@ -216,6 +217,7 @@
     "npm-run-all": "^4.1.5",
     "postcss": "^8",
     "react-email": "^5.1.0",
+    "react-grab": "^0.1.23",
     "tailwindcss": "^3.4.1",
     "tsx": "^4.19.2",
     "typescript": "^5",
diff --git a/packages/web/src/app/layout.tsx b/packages/web/src/app/layout.tsx
@@ -1,4 +1,5 @@
 import type { Metadata } from "next";
+import Script from "next/script";
 import "./globals.css";
 import { ThemeProvider } from "next-themes";
 import { QueryClientProvider } from "./queryClientProvider";
@@ -34,6 +35,21 @@ export default function RootLayout({
             // @see : https://github.com/pacocoursey/next-themes?tab=readme-ov-file#with-app
             suppressHydrationWarning
         >
+      <head>
+        {process.env.NODE_ENV === "development" && (
+          <Script
+            src="//unpkg.com/react-grab/dist/index.global.js"
+            crossOrigin="anonymous"
+            strategy="beforeInteractive"
+          />
+        )}
+        {process.env.NODE_ENV === "development" && (
+          <Script
+            src="//unpkg.com/@react-grab/mcp/dist/client.global.js"
+            strategy="lazyOnload"
+          />
+        )}
+      </head>
             <body>
                 <Toaster />
                 <SessionProvider>
diff --git a/yarn.lock b/yarn.lock
