switch ga to use beacon

Author: damianperera

frontend/src/reportWebVitals.ts

@@ -1,5 +1,6 @@
 import { Metric } from 'web-vitals'
 import ReactGA from 'react-ga4'
+import { UaEventOptions } from 'react-ga4/types/ga4'
 
 const getAnalyticsId = () => process.env.GOOGLE_ANALYTICS_TRACKING_ID
 const isDev = () => process.env.NODE_ENV && process.env.NODE_ENV === 'development'
@@ -12,12 +13,13 @@ const getEventValueFromMetric = (metric: Metric) => {
 }
 
 const reportHandler = (metric: Metric) => {
-  const event = {
+  const event: UaEventOptions = {
     category: 'Web Vitals',
     action: metric.name,
     value: getEventValueFromMetric(metric),
     label: metric.id,
-    nonInteraction: true
+    nonInteraction: true,
+    transport: 'beacon'
   }
 
   if (isDev()) {