FF react grab

waleedlatif1 · waleedlatif1 · commit db9f9ec4e579 · 2026-01-14T13:03:10.000-08:00
diff --git a/apps/sim/app/layout.tsx b/apps/sim/app/layout.tsx
@@ -7,6 +7,7 @@ import { generateBrandedMetadata, generateStructuredData } from '@/lib/branding/
 import { PostHogProvider } from '@/app/_shell/providers/posthog-provider'
 import '@/app/_styles/globals.css'
 import { OneDollarStats } from '@/components/analytics/onedollarstats'
+import { isReactGrabEnabled } from '@/lib/core/config/feature-flags'
 import { HydrationErrorHandler } from '@/app/_shell/hydration-error-handler'
 import { QueryProvider } from '@/app/_shell/providers/query-provider'
 import { SessionProvider } from '@/app/_shell/providers/session-provider'
@@ -33,14 +34,14 @@ export default function RootLayout({ children }: { children: React.ReactNode })
   return (
     <html lang='en' suppressHydrationWarning>
       <head>
-        {process.env.NODE_ENV === 'development' && (
+        {isReactGrabEnabled && (
           <Script
             src='//unpkg.com/react-grab/dist/index.global.js'
             crossOrigin='anonymous'
             strategy='beforeInteractive'
           />
         )}
-        {process.env.NODE_ENV === 'development' && (
+        {isReactGrabEnabled && (
           <Script
             src='//unpkg.com/@react-grab/cursor/dist/client.global.js'
             strategy='lazyOnload'
diff --git a/apps/sim/lib/core/config/env.ts b/apps/sim/lib/core/config/env.ts
@@ -260,6 +260,9 @@ export const env = createEnv({
     // Invitations - for self-hosted deployments
     DISABLE_INVITATIONS:                   z.boolean().optional(),                 // Disable workspace invitations globally (for self-hosted deployments)
 
+    // Development Tools
+    REACT_GRAB_ENABLED:                    z.boolean().optional(),                 // Enable React Grab for UI element debugging in Cursor/AI agents (dev only)
+
     // SSO Configuration (for script-based registration)
     SSO_ENABLED:                           z.boolean().optional(),                 // Enable SSO functionality
     SSO_PROVIDER_TYPE:                     z.enum(['oidc', 'saml']).optional(),    // [REQUIRED] SSO provider type
diff --git a/apps/sim/lib/core/config/feature-flags.ts b/apps/sim/lib/core/config/feature-flags.ts
@@ -111,6 +111,12 @@ export const isE2bEnabled = isTruthy(env.E2B_ENABLED)
  */
 export const isInvitationsDisabled = isTruthy(env.DISABLE_INVITATIONS)
 
+/**
+ * Is React Grab enabled for UI element debugging
+ * When true and in development mode, enables React Grab for copying UI element context to clipboard
+ */
+export const isReactGrabEnabled = isDev && isTruthy(env.REACT_GRAB_ENABLED)
+
 /**
  * Get cost multiplier based on environment
  */
diff --git a/apps/sim/package.json b/apps/sim/package.json
@@ -8,7 +8,7 @@
     "node": ">=20.0.0"
   },
   "scripts": {
-    "dev": "bunx @react-grab/cursor@latest && next dev --port 3000",
+    "dev": "next dev --port 3000",
     "dev:webpack": "next dev --webpack",
     "dev:sockets": "bun run socket/index.ts",
     "dev:full": "bunx concurrently -n \"App,Realtime\" -c \"cyan,magenta\" \"bun run dev\" \"bun run dev:sockets\"",
