feat: add google analytics

graasp · Dec 22, 2021 · 6558822 · 6558822
1 parent 8fca598
commit 6558822
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 1 deletion.
diff --git a/package.json b/package.json
@@ -21,6 +21,7 @@
     "qs": "6.10.1",
     "react": "17.0.1",
     "react-dom": "17.0.1",
+    "react-ga4": "1.4.1",
     "react-i18next": "11.11.4",
     "react-query": "3.16.0",
     "react-redux": "7.2.4",

diff --git a/src/config/constants.js b/src/config/constants.js
@@ -6,6 +6,7 @@ const {
   AUTHENTICATION_HOST: ENV_AUTHENTICATION_HOST,
   GRAASP_COMPOSE_HOST: ENV_GRAASP_COMPOSE_HOST,
   NODE_ENV: ENV_NODE_ENV,
+  GA_MEASUREMENT_ID: ENV_GA_MEASUREMENT_ID,
 } = env;
 
 export const APP_NAME = 'Graasp';
@@ -38,6 +39,9 @@ export const GRAASP_COMPOSE_HOST =
   process.env.REACT_APP_GRAASP_COMPOSE_HOST ||
   'http://localhost:3111';
 
+export const GA_MEASUREMENT_ID =
+  ENV_GA_MEASUREMENT_ID || process.env.REACT_APP_GA_MEASUREMENT_ID;
+
 // define a max height depending on the screen height
 // use a bit less of the height because of the header and some margin
 export const SCREEN_MAX_HEIGHT = window.innerHeight * 0.8;

diff --git a/src/env.json b/src/env.json
@@ -2,5 +2,6 @@
   "API_HOST": false,
   "SHOW_NOTIFICATIONS": false,
   "AUTHENTICATION_HOST": false,
-  "NODE_ENV": false
+  "NODE_ENV": false,
+  "GA_MEASUREMENT_ID": false
 }
diff --git a/src/index.js b/src/index.js
@@ -1,11 +1,18 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
+import ReactGA from 'react-ga4';
 import './index.css';
 import Root from './components/Root';
 import * as serviceWorker from './serviceWorker';
+import { GA_MEASUREMENT_ID } from './config/constants';
 
 import '@graasp/ui/dist/bundle.css';
 
+if (GA_MEASUREMENT_ID) {
+  ReactGA.initialize(GA_MEASUREMENT_ID);
+  ReactGA.send('pageview');
+}
+
 ReactDOM.render(
   <React.StrictMode>
     <Root />

diff --git a/yarn.lock b/yarn.lock
@@ -10131,6 +10131,7 @@ fsevents@^1.2.7:
     qs: 6.10.1
     react: 17.0.1
     react-dom: 17.0.1
+    react-ga4: 1.4.1
     react-i18next: 11.11.4
     react-query: 3.16.0
     react-redux: 7.2.4
@@ -16448,6 +16449,13 @@ fsevents@^1.2.7:
   languageName: node
   linkType: hard
 
+"react-ga4@npm:1.4.1":
+  version: 1.4.1
+  resolution: "react-ga4@npm:1.4.1"
+  checksum: 4c33ecb47dfc26c241a6af8e2b08b29b6c059f40e456e93d1c2b65c995edce18f32d9777295774ec992d968d7c5efdd105eb62398972d85ff2e2b6dad8646a26
+  languageName: node
+  linkType: hard
+
 "react-i18next@npm:11.11.4":
   version: 11.11.4
   resolution: "react-i18next@npm:11.11.4"