search

tl-its-umich-edu / remote-office-hours-queue

Virtual queuing tool supporting Zoom video conferencing and/or in person meetings.
https://officehours.it.umich.edu/
Apache License 2.0
12 stars 28 forks source link

493: update Google Analytics settings, use Umich OneTrust banner #518

Closed jaydonkrooss closed 4 months ago

jaydonkrooss commented 5 months ago

Attempt to adapt the oneTrust cookie disclosure as specified by umich resources: https://vpcomm.umich.edu/resources/cookie-disclosure/

Uses react effects to keep track of the user's selections and update google analytics tags accordingly.

see VPN test plan here: https://github.com/tl-its-umich-edu/remote-office-hours-queue/issues/493#issuecomment-2197611029

pushyamig commented 5 months ago

I will review it in the morning.

pushyamig commented 5 months ago

Is there any resource/site you were looking at when implementing this code? I don't have much background with onetrust and adding the cookie banner. If you provide a source to reference that would to helpful to review.

pushyamig commented 5 months ago

I will try to test it on Dev instance as @jaydonkrooss provided a link.

jaydonkrooss commented 5 months ago

Is there any resource/site you were looking at when implementing this code? I don't have much background with onetrust and adding the cookie banner. If you provide a source to reference that would to helpful to review.

Here's my high level understanding of what should happen based on the Umich cookie disclosure instructions under "Google Analytics / Tag manager" section. I've also seen similar instructions on google analytics and onetrust documentation:

  1. Google Analytics is initialized with default ("denied") consent signals. React-ga4 library already took care of this for me, except for the initial consent config which I added.
  2. The Umich-configured OneTrust script runs the banner code. Appears for users in EU, not anywhere else
  3. Frontend should define an "OptanonWrapper" function and push it to the window. OneTrust code uses the fn for callback whenever consent signals (stored as a string "OnetrustActiveGroups") are changed. I assume "Accept All" flow is immediately run for Non-EU users, while EU users stick with denied unless Accept is selected
  4. Inside OptanonWrapper are a number of "gtag" updates to Google Analytics so that consent settings are updated. In the denied flow, the GA cookie is completely removed from the window. Also we send a custom Google Analytics event called "um_consent_updated" (not sure what it does)

I'll try to add clearer comments and better variable storage. Mainly the challenge has been trying to find out how to combine the oneTrust expected behavior with Google Analytics react library, instead of using purely JS script tags.

pushyamig commented 4 months ago

I feel the code is cleaned up a lot and useEffect in the oneTrust component is simplified. I did not test his but @zqian seems to be testing all the useCase. I feel if the code is working as expected then @zqian will be the approver.

pushyamig commented 4 months ago

@jaydonkrooss Thanks for adding all the comment I feel the code is now easier to understand.