From d6da54a42fbee89a5ac59077e6f92db9c4f63556 Mon Sep 17 00:00:00 2001
From: Thomas Parisot <oncletom@users.noreply.github.com>
Date: Wed, 8 Dec 2021 16:04:34 +0100
Subject: [PATCH] Store `trackingConsent` preference, and trigger page tracking
 accordingly

---
 front/src/components/Footer.jsx |  2 +-
 front/src/createReduxStore.js   | 14 ++++++++--
 front/src/index.jsx             | 45 ++++++++++++++++++++++-----------
 3 files changed, 43 insertions(+), 18 deletions(-)

diff --git a/front/src/components/Footer.jsx b/front/src/components/Footer.jsx
index 63250f9cd..5f24ccef1 100644
--- a/front/src/components/Footer.jsx
+++ b/front/src/components/Footer.jsx
@@ -23,7 +23,7 @@ function Footer () {
           <li><Link to="/privacy">Privacy</Link></li>
           { import.meta.env.SNOWPACK_MATOMO_URL && (<li>
             <label className={styles.consentLabel}>
-              <input type="checkbox" checked={userHasConsent} onChange={toggleConsent} disabled={true} />
+              <input type="checkbox" checked={userHasConsent} onChange={toggleConsent} />
               I accept to share my navigation stats
             </label>
           </li>) }
diff --git a/front/src/createReduxStore.js b/front/src/createReduxStore.js
index 5a176a6fc..50b95875b 100644
--- a/front/src/createReduxStore.js
+++ b/front/src/createReduxStore.js
@@ -46,8 +46,8 @@ const initialState = {
     charCountPlusSpace: 0,
     citationNb: 0,
   },
-  userPreferences: {
-    trackingConsent: true /* default value should be false */
+  userPreferences: localStorage.getItem('userPreferences') ? JSON.parse(localStorage.getItem('userPreferences')) : {
+    trackingConsent: true,
   }
 }
 
@@ -140,6 +140,16 @@ function persistStateIntoLocalStorage ({ getState }) {
 
         return
       }
+      else if (action.type === 'USER_PREFERENCES_TOGGLE') {
+        // we run the reducer first
+        next(action)
+        // we fetch the updated state
+        const { userPreferences } = getState()
+        // we persist it for a later page reload
+        localStorage.setItem('userPreferences', JSON.stringify(userPreferences))
+
+        return
+      }
 
       return next(action)
     }
diff --git a/front/src/index.jsx b/front/src/index.jsx
index 3903f926e..331797b3e 100644
--- a/front/src/index.jsx
+++ b/front/src/index.jsx
@@ -1,8 +1,8 @@
 import './wdyr.js'
-import React, { lazy } from 'react'
+import React, { lazy, useCallback } from 'react'
 import { render } from 'react-dom'
-import { BrowserRouter as Router, Route, Switch, useParams, useHistory } from 'react-router-dom'
-import { Provider } from 'react-redux'
+import { BrowserRouter as Router, Route, Switch, useHistory } from 'react-router-dom'
+import { Provider, useSelector } from 'react-redux'
 import 'whatwg-fetch'
 
 import './styles/general.scss'
@@ -42,20 +42,35 @@ const store = createStore()
   )
 })()
 
-const TrackPageViews = () => {
+let unlisten
+
+function TrackPageViews () {
   const history = useHistory()
+  const userHasConsent = useSelector(state => state.userPreferences.trackingConsent)
+
+  const listen = useCallback((hasContent) => {
+    if (unlisten) {
+      unlisten()
+      unlisten = null
+    }
+
+    return hasContent && history.listen(({ pathname, search, state }, action) => {
+      /* global _paq */
+      const _paq = window._paq = window._paq || [];
+      console.log('history.listen', pathname)
+
+      if (hasContent) {
+        _paq.push(['setConsentGiven'])
+        _paq.push(['setCustomUrl', pathname])
+        _paq.push(['trackPageView'])
+      }
+      else {
+        _paq.push(['forgetConsentGiven'])
+      }
+    })
+  }, [userHasConsent])
 
-  history.listen(({ pathname, search, state }, action) => {
-    /* global _paq */
-    const _paq = window._paq = window._paq || [];
-
-    //@todo do this dynamically, based on a subscription to the store
-    //otherwise, we should use _paq.push(['forgetConsentGiven'])
-    _paq.push(['setConsentGiven'])
-    _paq.push(['setCustomUrl', '/' + pathname])
-    //_paq.push(['setDocumentTitle', 'My New Title'])
-    _paq.push(['trackPageView'])
-  })
+  unlisten = listen(userHasConsent)
 
   return null
 }