Add react-scan and react-grab dev tools (development only)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-06 18:52:01 -05:00
parent 727934fd38
commit de6bfd8c00
3 changed files with 162 additions and 3 deletions
@@ -1,4 +1,5 @@
 import type { Metadata } from 'next'
+import Script from 'next/script'
 import localFont from 'next/font/local'
 import { Barlow } from 'next/font/google'
 import { Analytics } from '@vercel/analytics/react'
@@ -78,6 +79,22 @@ export default function RootLayout({

  return (
    <html lang="en" className={`${geistSans.variable} ${geistMono.variable} ${barlow.variable}`}>
+      <head>
+        {process.env.NODE_ENV === 'development' && (
+          <>
+            <Script
+              src="//unpkg.com/react-scan/dist/auto.global.js"
+              crossOrigin="anonymous"
+              strategy="beforeInteractive"
+            />
+            <Script
+              src="//unpkg.com/react-grab/dist/index.global.js"
+              crossOrigin="anonymous"
+              strategy="beforeInteractive"
+            />
+          </>
+        )}
+      </head>
      <body className="font-sans">
        <UsernameGate>{children}</UsernameGate>
        <Analytics />
@@ -64,6 +64,8 @@
    "@types/node": "^22.19.12",
    "@types/react": "19.2.2",
    "@types/react-dom": "19.2.2",
+    "react-grab": "^0.1.25",
+    "react-scan": "^0.5.3",
    "tw-animate-css": "^1.4.0",
    "typescript": "5.9.3"
  }