diff --git a/src/components/analytics/GoogleAnalyticsReporter.tsx b/src/components/analytics/GoogleAnalyticsReporter.tsx index 8e2335c0fb..aa2f681baf 100644 --- a/src/components/analytics/GoogleAnalyticsReporter.tsx +++ b/src/components/analytics/GoogleAnalyticsReporter.tsx @@ -4,6 +4,8 @@ import ReactGA from 'react-ga' import { RouteComponentProps } from 'react-router-dom' import { getCLS, getFCP, getFID, getLCP, Metric } from 'web-vitals' +import { GOOGLE_ANALYTICS_CLIENT_ID_STORAGE_KEY } from './index' + function reportWebVitals({ name, delta, id }: Metric) { ReactGA.timing({ category: 'Web Vitals', @@ -31,5 +33,15 @@ export default function GoogleAnalyticsReporter({ location: { pathname, search } useEffect(() => { ReactGA.pageview(`${pathname}${search}`) }, [pathname, search]) + + useEffect(() => { + // typed as 'any' in react-ga -.- + ReactGA.ga((tracker: any) => { + if (!tracker) return + + const clientId = tracker.get('clientId') + window.localStorage.setItem(GOOGLE_ANALYTICS_CLIENT_ID_STORAGE_KEY, clientId) + }) + }, []) return null } diff --git a/src/components/analytics/index.ts b/src/components/analytics/index.ts index a9969051cb..01f046badf 100644 --- a/src/components/analytics/index.ts +++ b/src/components/analytics/index.ts @@ -1,12 +1,17 @@ import ReactGA from 'react-ga' import { isMobile } from 'utils/userAgent' +export const GOOGLE_ANALYTICS_CLIENT_ID_STORAGE_KEY = 'ga_client_id' const GOOGLE_ANALYTICS_ID: string | undefined = process.env.REACT_APP_GOOGLE_ANALYTICS_ID + +const storedClientId = window.localStorage.getItem(GOOGLE_ANALYTICS_CLIENT_ID_STORAGE_KEY) + if (typeof GOOGLE_ANALYTICS_ID === 'string') { ReactGA.initialize(GOOGLE_ANALYTICS_ID, { gaOptions: { storage: 'none', storeGac: false, + clientId: storedClientId ?? undefined, }, }) ReactGA.set({