feat(gtag): cookie consent banner

[Josh-Cena]

Motivation

Fix #2407.

The current approach doesn't look clean enough because we need to check local storage on every route transition, but otherwise, the tracking only starts after the user refreshed and the site reloads with the new local storage value.

Waiting to polish the banner design.

We can port this banner to google analytics after merging this one, or before it's ready to be merged.

Have you read the Contributing Guidelines on pull requests?

Yes

Test Plan

Temporarily enabled the plugin in deploy preview to make it show up

[netlify[bot]]

✔️ [V2]

🔨 Explore the source changes: 543b5df52bfa198208ac66263e325ea2d2172653

🔍 Inspect the deploy log: https://app.netlify.com/sites/docusaurus-2/deploys/61e410cff398830008fbe71d

😎 Browse the preview: https://deploy-preview-6376--docusaurus-2.netlify.app

[github-actions[bot]]

⚡️ Lighthouse report for the changes in this PR:

Category	Score
🟠 Performance	68
🟢 Accessibility	98
🟢 Best practices	93
🟢 SEO	100
🟢 PWA	92

Lighthouse ran on https://deploy-preview-6376--docusaurus-2.netlify.app/

[github-actions[bot]]

Size Change: +1.8 kB (0%)

Total Size: 680 kB

Filename	Size	Change
website/build/assets/css/styles.********.css	103 kB	+545 B (+1%)
website/build/assets/js/main.********.js	504 kB	+1.25 kB (0%)

ℹ️ View Unchanged

Filename	Size
website/.docusaurus/globalData.json	42.9 kB
website/build/index.html	29.6 kB

_{compressed-size-action}

[slorber]

I have an internal Meta doc (that I cannot share) and it seems blocking gtag is not enough.

We also need to be able to block localStorage usage, including in core/theme (ie no announcementBar dismiss or theme persistence)

And we need to think about this with a long-term vision: if the user needs 2 plugins requiring localstorage/tracking, only one consent banner should be presented, probably with granular options (checkboxes) and i18n messages.

---

Maybe this PR is a good-enough first step and we can improve later, will ask.

[Josh-Cena]

We also need to be able to block localStorage usage, including in core/theme (ie no announcementBar dismiss or theme persistence)

Really...? Everywhere I checked, our moderate usage of localStorage is permitted. GDPR doesn't forbid local storage as long as it's for the interest of the user (e.g. not annoying them by showing the announcement every time)

[slorber]

Really...? Everywhere I checked, our moderate usage of localStorage is permitted. GDPR doesn't forbid local storage as long as it's for the interest of the user (e.g. not annoying them by showing the announcement every time)

hmm yes I found this surprising too

Re-reading that internal doc, I'll try to clarify this part.

It's not 100% clear what should be the behavior when localStorage is used but without any purpose of tracking users

[slorber]

It's hard to read between the lines between all the online resources, but I think it's fine to use localStorage for non-tracking functional behavior after user-interactions.

Something we should refactor: we shouldn't set default values in localStorage when the user is just landing on a page. Values must only be set after interactions that require such storage usage.

Apparently, we'd still need to disclose to the user that storage is used 🤷‍♂️ https://www.reddit.com/r/gdpr/comments/s7sk3w/localstorage_to_persist_dark_mode_theme/

[PatelN123]

🐛 Bug:

[JohannesDienst-askui]

Is this still worked on? Happy to help as we need to be GDPR compliant ;)

[Nanin22]

Do you speak Spanish? I’m new on this can you please help me

On Thu, Sep 29, 2022 at 6:53 AM Johannes Dienst @.***> wrote:

Is this still worked on? Happy to help as we need to be GDPR compliant ;)

— Reply to this email directly, view it on GitHub https://github.com/facebook/docusaurus/pull/6376#issuecomment-1262169554, or unsubscribe https://github.com/notifications/unsubscribe-auth/A2UJ54Q65OVTXBWBDIJJKV3WAV7MNANCNFSM5MCQZFPQ . You are receiving this because you are subscribed to this thread.Message ID: @.***>

[monica-m-ps]

Hi. Do we have plans to merge this sooner? Thanks

[0ptim]

I'm also interested on this kind of feature.

[wgruszczyk]

@Josh-Cena is this feature planned to be continued and merged any time soon? Adding Google Analytics via the gtag definitely requires GDPR consent and doing it right feels like a significant effort on our side. Having that built-in would be of great help.

[Shnitselon]

Hi, any news on this?

Cookie consent is a basic requirement from GDPR

[wgruszczyk]

@Shnitselon I decided to go with https://github.com/Mastermindzh/react-cookie-consent, maybe not ideal and ootb, but definitely sufficient to satisfy GDPR requirements.

[monica-m-ps]

Hello. Any update on this?

[Josh-Cena]

Sorry everyone who commented under this. I will not be working on this for any foreseeable future because we don't know what needs to be done.

Please comment under the linked issue detailing what you think (or better, what you know, backed by actual laws) the consent banner should do:

1. Does it need to block all local storage access (including persisting the color mode choice, tab choice, etc.)?
2. Does it need to stop sending Google analytics? If so, at which stage (not loading the script tag at all, or just not sending the page view events)? Or is there a way to send analytics in a "private mode" that does not rely on user data?
3. Do you use other plugins that require this privacy protection too? Do they currently handle privacy issues? If so, what mechanism do they use?
4. Any other feature you use on your site that requires cookie consent?

Thank you.

[oyatek]

1. https://github.com/68publishers/cookie-consent - if all you need is add a Cookie Consent for Google Tags - this works out of the box with Docusaurus gtag plugin - without installing anything extra on your site

2. https://cookieconsent.orestbida.com/ - this one seems to be more flexible. Needs to be installed on your site.