chore: use react-scan on dev

itsjavi · itsjavi · commit 5b7449faef3e · 2025-05-21T01:24:30.000+02:00
diff --git a/packages/docs/app/root.tsx b/packages/docs/app/root.tsx
@@ -1,4 +1,4 @@
-import { isRouteErrorResponse, Links, Meta, Outlet, Scripts, ScrollRestoration } from 'react-router'
+import { isRouteErrorResponse, Links, Meta, Outlet, Scripts, ScrollRestoration, useRouteLoaderData } from 'react-router'
 
 import type { Route } from './+types/root'
 import appInlineCss from './app.css?inline'
@@ -30,14 +30,23 @@ export const links: Route.LinksFunction = () => [
   },
 ]
 
+export async function loader() {
+  return {
+    isDev: import.meta.env.DEV,
+  }
+}
+
 export function Layout({ children }: { children: React.ReactNode }) {
+  const data = useRouteLoaderData<typeof loader>('root')
+  const useReactScan = data?.isDev === true
   return (
     <html lang="en">
       <head>
         <meta charSet="utf-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
         <Meta />
         <Links />
+        {useReactScan && <script crossOrigin="anonymous" src="//unpkg.com/react-scan/dist/auto.global.js" />}
         <style id="app_css" dangerouslySetInnerHTML={{ __html: appInlineCss }} />
       </head>
       <body>
