591, 543: upgrade React, use Google Analytics module for OneTrust pri…

…vacy banner (#594)

* 591: use Google Analytics module for OneTrust privacy banner

* upgrade react, react-dom

* add OneTrust script domain to variables

* upgrade module

.env.sample

@@ -21,6 +21,7 @@ DJANGO_TIMEZONE=America/Detroit
 
 # Optional for Google analytics
 #GA_TRACKING_ID=
+#ONE_TRUST_SCRIPT_DOMAIN=
 
 # (Optional) These are required for TWILIO, leave them out if you don't have them or aren't testing Twililo
 #TWILIO_ACCOUNT_SID=

README.md

@@ -70,12 +70,11 @@ The Swagger UI can be accessed by navigating to [`api/schema/swagger-ui`](http:/
 Once on the page, requests can be made against the API using the "Try it out" functionality.
 The OpenAPI schema can be downloaded as a YAML file from [`/api/schema`](http://localhost:8003/api/schema).
 
-### Google Analytics
+### Google Analytics and OneTrust
 
-This application is capable of being configured to use Google Analytics 4.
-In order to send events, the environment variable `GA_TRACKING_ID` needs to be set to
-your application's [measurement ID](https://support.google.com/analytics/answer/9539598#find-G-ID)
-and the `DEBUG` environment variable and Django setting need to be off or `False`.
+For both cookie consent privacy banner and analytics tracking, this application utilizes the Teaching and Learning Google Analytics OneTrust React Module which is directly imported from the [Github Repo](https://github.com/tl-its-umich-edu/react-ga-onetrust-consent). 
+In order to send events, you will need the environment variables `GA_TRACKING_ID` and `ONE_TRUST_SCRIPT_DOMAIN` to be set to your application's [measurement ID](https://support.google.com/analytics/answer/9539598#find-G-ID) and your OneTrust platform integration id, respectively. See the [U-M Cookie Disclosure guide](https://vpcomm.umich.edu/resources/cookie-disclosure/) for more information.
+Finally, the `DEBUG` environment variable and Django setting need to be off or `False`.
 Thus, a deployment environment is currently the simplest place for testing.
 
 ### Local Database

service/base/kustomization.yaml

@@ -31,6 +31,7 @@ secretGenerator:
   - secret/ADMIN_EMAIL
   - secret/EMAIL_HOST
   - secret/GA_TRACKING_ID
+  - secret/ONE_TRUST_SCRIPT_DOMAIN
   - secret/REDIS_HOST
   - secret/TWILIO_ACCOUNT_SID
   - secret/TWILIO_AUTH_TOKEN

src/assets/src/containers/app.tsx

@@ -11,14 +11,19 @@ import { QueuePage } from "../components/queue";
 import { QueueManagerPage } from "../components/queueManager";
 import { ManageQueueSettingsPage } from "../components/queueSettings";
 import { SearchPage } from "../components/search";
-import { useGoogleAnalytics } from "../hooks/useGoogleAnalytics";
+import { useGoogleAnalytics } from "@tl-its-umich-edu/react-ga-onetrust-consent";
+
 
 interface AppProps {
     globals: Globals;
 }
 
 export function App(props: AppProps) {
-    useGoogleAnalytics(props.globals.ga_tracking_id, props.globals.debug);
+    useGoogleAnalytics({
+        googleAnalyticsId: props.globals.ga_tracking_id, 
+        debug: props.globals.debug,
+        oneTrustScriptDomain: props.globals.one_trust_script_domain
+    });
 
     const commonProps: PageProps = {
         user: props.globals.user,

src/assets/src/index.tsx

@@ -15,6 +15,7 @@ export interface Globals {
     backends: MeetingBackend[];
     default_backend: string;
     otp_request_buffer: number;
+    one_trust_script_domain: string;
 }
 
 const globalsId = 'spa_globals';

src/officehours/settings.py

@@ -309,6 +309,7 @@ def skip_auth_callback_requests(record):
 
 # Google Analytics
 GA_TRACKING_ID = os.getenv('GA_TRACKING_ID')
+ONE_TRUST_SCRIPT_DOMAIN = os.getenv('ONE_TRUST_SCRIPT_DOMAIN')
 
 # Django Flatpages
 SITE_ID = 1

src/officehours_ui/context_processors.py

@@ -40,6 +40,7 @@ def spa_globals(request):
             'feedback_email': getattr(settings, 'FEEDBACK_EMAIL', None),
             'debug': settings.DEBUG,
             'ga_tracking_id': settings.GA_TRACKING_ID,
+            'one_trust_script_domain': settings.ONE_TRUST_SCRIPT_DOMAIN,
             'login_url': settings.LOGIN_URL,
             'backends': backend_dicts,
             'default_backend': settings.DEFAULT_BACKEND,