Add API rewrites for Amplitude and update server URL in AmplitudeProvider

web/app/components/base/amplitude/AmplitudeProvider.tsx

@@ -18,7 +18,7 @@ const AmplitudeProvider: FC<IAmplitudeProps> = ({
     //   return
     // }
 
-    // Initialize Amplitude
+    // Initialize Amplitude with proxy configuration to bypass CSP
     amplitude.init(apiKey, {
       defaultTracking: {
         sessions: true,
@@ -28,6 +28,8 @@ const AmplitudeProvider: FC<IAmplitudeProps> = ({
       },
       // Enable debug logs in development environment
       logLevel: process.env.NODE_ENV === 'development' ? amplitude.Types.LogLevel.Debug : amplitude.Types.LogLevel.Warn,
+      // Use Next.js proxy to bypass CSP restrictions
+      serverUrl: '/api/amplitude/2/httpapi',
     })
 
     // Log initialization success in development

web/app/components/base/amplitude/utils.ts

@@ -14,6 +14,14 @@ export const trackEvent = (eventName: string, eventProperties?: Record<string, a
  * @param userId User ID
  */
 export const setUserId = (userId: string) => {
+  if (!userId) {
+    console.warn('[Amplitude] ⚠️ Cannot set empty user ID')
+    return
+  }
+
+  if (process.env.NODE_ENV === 'development')
+    console.log('[Amplitude] 👤 Setting User ID:', userId)
+
   amplitude.setUserId(userId)
 }
 
@@ -22,11 +30,37 @@ export const setUserId = (userId: string) => {
  * @param properties User properties
  */
 export const setUserProperties = (properties: Record<string, any>) => {
+  // Filter out undefined and null values
+  const validProperties = Object.entries(properties).reduce((acc, [key, value]) => {
+    if (value !== undefined && value !== null)
+      acc[key] = value
+
+    return acc
+  }, {} as Record<string, any>)
+
+  if (Object.keys(validProperties).length === 0) {
+    if (process.env.NODE_ENV === 'development')
+      console.warn('[Amplitude] ⚠️ No valid properties to set')
+    return
+  }
+
+  if (process.env.NODE_ENV === 'development')
+    console.log('[Amplitude] 📊 Setting user properties:', validProperties)
+
   const identifyEvent = new amplitude.Identify()
-  Object.entries(properties).forEach(([key, value]) => {
+  Object.entries(validProperties).forEach(([key, value]) => {
     identifyEvent.set(key, value)
   })
-  amplitude.identify(identifyEvent)
+
+  const result = amplitude.identify(identifyEvent)
+
+  // Log the result in development
+  result.promise.then(() => {
+    if (process.env.NODE_ENV === 'development')
+      console.log('[Amplitude] ✅ User properties set successfully')
+  }).catch((err) => {
+    console.error('[Amplitude] ❌ Failed to set user properties:', err)
+  })
 }
 
 /**

web/context/app-context.tsx

@@ -168,28 +168,41 @@ export const AppContextProvider: FC<AppContextProviderProps> = ({ children }) =>
   // #region Amplitude user tracking
   useEffect(() => {
     // Report user info to Amplitude when loaded
-    if (userProfile?.id) {
-      setUserId(userProfile.id)
-      setUserProperties({
-        email: userProfile.email,
-        name: userProfile.name,
-        has_password: userProfile.is_password_set,
-      })
-    }
-  }, [userProfile?.id, userProfile?.email, userProfile?.name, userProfile?.is_password_set])
+    if (!userProfile?.id)
+      return
 
-  useEffect(() => {
-    // Report workspace info to Amplitude when loaded
-    if (currentWorkspace?.id && userProfile?.id) {
-      setUserProperties({
-        workspace_id: currentWorkspace.id,
-        workspace_name: currentWorkspace.name,
-        workspace_plan: currentWorkspace.plan,
-        workspace_status: currentWorkspace.status,
-        workspace_role: currentWorkspace.role,
-      })
+    // Step 1: Set User ID first
+    setUserId(userProfile.id)
+
+    // Step 2: Set user properties
+    const userProperties: Record<string, any> = {
+      email: userProfile.email,
+      name: userProfile.name,
+      has_password: userProfile.is_password_set,
     }
-  }, [currentWorkspace?.id, currentWorkspace?.name, currentWorkspace?.plan, currentWorkspace?.status, currentWorkspace?.role, userProfile?.id])
+
+    // Step 3: Add workspace properties if available
+    if (currentWorkspace?.id) {
+      userProperties.workspace_id = currentWorkspace.id
+      userProperties.workspace_name = currentWorkspace.name
+      userProperties.workspace_plan = currentWorkspace.plan
+      userProperties.workspace_status = currentWorkspace.status
+      userProperties.workspace_role = currentWorkspace.role
+    }
+
+    // Set all properties at once
+    setUserProperties(userProperties)
+  }, [
+    userProfile?.id,
+    userProfile?.email,
+    userProfile?.name,
+    userProfile?.is_password_set,
+    currentWorkspace?.id,
+    currentWorkspace?.name,
+    currentWorkspace?.plan,
+    currentWorkspace?.status,
+    currentWorkspace?.role,
+  ])
   // #endregion Amplitude user tracking
 
   return (

web/next.config.js

@@ -152,6 +152,18 @@ const nextConfig = {
       },
     ]
   },
+  async rewrites() {
+    return [
+      {
+        source: '/api/amplitude/:path*',
+        destination: 'https://api2.amplitude.com/:path*',
+      },
+      {
+        source: '/api/amplitude-config/:path*',
+        destination: 'https://sr-client-cfg.amplitude.com/:path*',
+      },
+    ]
+  },
   output: 'standalone',
 }