From f31519067dd038ace8111e08a7e70dfb7db96dc1 Mon Sep 17 00:00:00 2001 From: CodingOnStar Date: Fri, 7 Nov 2025 13:19:09 +0800 Subject: [PATCH] Add API rewrites for Amplitude and update server URL in AmplitudeProvider --- .../base/amplitude/AmplitudeProvider.tsx | 4 +- web/app/components/base/amplitude/utils.ts | 38 ++++++++++++- web/context/app-context.tsx | 53 ++++++++++++------- web/next.config.js | 12 +++++ 4 files changed, 84 insertions(+), 23 deletions(-) diff --git a/web/app/components/base/amplitude/AmplitudeProvider.tsx b/web/app/components/base/amplitude/AmplitudeProvider.tsx index 1a2e779117..e496c01594 100644 --- a/web/app/components/base/amplitude/AmplitudeProvider.tsx +++ b/web/app/components/base/amplitude/AmplitudeProvider.tsx @@ -18,7 +18,7 @@ const AmplitudeProvider: FC = ({ // return // } - // Initialize Amplitude + // Initialize Amplitude with proxy configuration to bypass CSP amplitude.init(apiKey, { defaultTracking: { sessions: true, @@ -28,6 +28,8 @@ const AmplitudeProvider: FC = ({ }, // 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 diff --git a/web/app/components/base/amplitude/utils.ts b/web/app/components/base/amplitude/utils.ts index 8423c43bb2..95b8af508d 100644 --- a/web/app/components/base/amplitude/utils.ts +++ b/web/app/components/base/amplitude/utils.ts @@ -14,6 +14,14 @@ export const trackEvent = (eventName: string, eventProperties?: Record { + 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) => { + // 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) + + 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) + }) } /** diff --git a/web/context/app-context.tsx b/web/context/app-context.tsx index e4fdb63553..9e7fdf5921 100644 --- a/web/context/app-context.tsx +++ b/web/context/app-context.tsx @@ -168,28 +168,41 @@ export const AppContextProvider: FC = ({ 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 = { + 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 ( diff --git a/web/next.config.js b/web/next.config.js index 581f14b2db..834316f7a8 100644 --- a/web/next.config.js +++ b/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', }