From dd06b6afed72d23529526f0e555b713ec2c2b60e Mon Sep 17 00:00:00 2001
From: pyphilia <pyphilia@gmail.com>
Date: Mon, 20 Dec 2021 16:02:47 +0100
Subject: [PATCH] ci: add google analytics

---
 package.json            | 1 +
 src/config/constants.js | 4 ++++
 src/env.json            | 3 ++-
 src/index.js            | 7 +++++++
 yarn.lock               | 8 ++++++++
 5 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/package.json b/package.json
index ea74de7f7..5e8538eea 100644
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
     "react": "^17.0.1",
     "react-beautiful-dnd": "13.1.0",
     "react-dom": "^17.0.1",
+    "react-ga4": "1.4.1",
     "react-i18next": "11.11.4",
     "react-image-crop": "9.0.4",
     "react-query": "3.31.0",
diff --git a/src/config/constants.js b/src/config/constants.js
index 7e9e981a6..6bf3c27bf 100644
--- a/src/config/constants.js
+++ b/src/config/constants.js
@@ -7,6 +7,7 @@ const {
   GRAASP_PERFORM_HOST: ENV_GRAASP_PERFORM_HOST,
   AUTHENTICATION_HOST: ENV_AUTHENTICATION_HOST,
   NODE_ENV: ENV_NODE_ENV,
+  GA_MEASUREMENT_ID: ENV_GA_MEASUREMENT_ID,
 } = env;
 
 export const APP_NAME = 'Graasp';
@@ -39,6 +40,9 @@ export const GRAASP_PERFORM_HOST =
   process.env.REACT_APP_GRAASP_PERFORM_HOST ||
   'http://localhost:3112';
 
+export const GA_MEASUREMENT_ID =
+  ENV_GA_MEASUREMENT_ID || process.env.REACT_APP_GA_MEASUREMENT_ID;
+
 export const DESCRIPTION_MAX_LENGTH = 30;
 
 // todo: use local image
diff --git a/src/env.json b/src/env.json
index 49be28122..57f073736 100644
--- a/src/env.json
+++ b/src/env.json
@@ -3,5 +3,6 @@
   "SHOW_NOTIFICATIONS": false,
   "AUTHENTICATION_HOST": false,
   "NODE_ENV": false,
-  "GRAASP_PERFORM_HOST": false
+  "GRAASP_PERFORM_HOST": false,
+  "GA_MEASUREMENT_ID": false
 }
diff --git a/src/index.js b/src/index.js
index ad67f20f4..2d1094894 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,10 +1,17 @@
 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 '@graasp/ui/dist/bundle.css';
+import { GA_MEASUREMENT_ID } from './config/constants';
+
+if (GA_MEASUREMENT_ID) {
+  ReactGA.initialize(GA_MEASUREMENT_ID);
+  ReactGA.send('pageview');
+}
 
 ReactDOM.render(
   <React.StrictMode>
diff --git a/yarn.lock b/yarn.lock
index 4de2b0dff..060d4be53 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10171,6 +10171,7 @@ __metadata:
     react: ^17.0.1
     react-beautiful-dnd: 13.1.0
     react-dom: ^17.0.1
+    react-ga4: 1.4.1
     react-i18next: 11.11.4
     react-image-crop: 9.0.4
     react-query: 3.31.0
@@ -16675,6 +16676,13 @@ __metadata:
   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"