docs(headless,headless-react): support OneTrust preferences in typedo…

…c sites (#4942)

https://coveord.atlassian.net/browse/KIT-3946

I realized that the settings pannel in Typedoc sites relies on cookies.
This means that technically, we need to support the privacy preferences
set on docs.coveo.com.

You can test my fix by opening this page:
https://docs.coveo.com/en/headless/latest/reference/functions/Case_Assist.buildCaseAssistEngine.html
After allowing or disallowing cookies from https://docs.coveo.com/en/0
(`Cookie preferences` modal accessible through upper right corner (...)
button).

Typedoc also uses a very large number of cookies for navigation
purposes. I'll look into this with legal, but I think we'll be able to
consider them strictly necessary, so we won't have to clear them as
Typedoc populates them. Basically, if we erased the navigation cookies,
Typedoc would never remember the navigation tree you opened prior to
opening a new page.

packages/headless-react/typedoc/lib/index.tsx

@@ -7,6 +7,7 @@ import {Application, JSX, RendererEvent, Converter} from 'typedoc';
 import {insertAtomicSearchBox} from './insertAtomicSearchBox.js';
 import {insertCoveoLogo} from './insertCoveoLogo.js';
 import {insertCustomComments} from './insertCustomComments.js';
+import {insertOneTrust} from './insertOneTrust.js';
 import {insertSurveyLink} from './insertSurveyLink.js';
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
@@ -35,6 +36,9 @@ export function load(app: Application) {
       <script>
         <JSX.Raw html={`(${insertSurveyLink.toString()})();`} />
       </script>
+      <script>
+        <JSX.Raw html={`(${insertOneTrust.toString()})();`} />
+      </script>
       <script>
         <JSX.Raw
           html={`(${insertCoveoLogo.toString()})('${event.relativeURL('assets/coveo-docs-logo.svg')}');`}

packages/headless-react/typedoc/lib/insertOneTrust.ts

@@ -0,0 +1,25 @@
+export function insertOneTrust() {
+  document.addEventListener('DOMContentLoaded', () => {
+    const areFunctionalCookiesEnabled = document.cookie
+      .split('; ')
+      .some(
+        (cookie) =>
+          cookie.startsWith('OptanonConsent') && cookie.includes('C0003%3A1')
+      );
+
+    if (!areFunctionalCookiesEnabled) {
+      const settingsDiv = document.querySelector('.settings');
+      if (settingsDiv) {
+        (settingsDiv as HTMLElement).style.display = 'none';
+      }
+
+      const itemsToDelete = [
+        'tsd-theme',
+        'filter-protected',
+        'filter-inherited',
+        'filter-external',
+      ];
+      itemsToDelete.forEach((item) => localStorage.removeItem(item));
+    }
+  });
+}

packages/headless/typedoc/lib/index.tsx

@@ -7,6 +7,7 @@ import {Application, JSX, RendererEvent, Converter} from 'typedoc';
 import {insertAtomicSearchBox} from './insertAtomicSearchBox.js';
 import {insertCoveoLogo} from './insertCoveoLogo.js';
 import {insertCustomComments} from './insertCustomComments.js';
+import {insertOneTrust} from './insertOneTrust.js';
 import {insertSurveyLink} from './insertSurveyLink.js';
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
@@ -35,6 +36,9 @@ export function load(app: Application) {
       <script>
         <JSX.Raw html={`(${insertSurveyLink.toString()})();`} />
       </script>
+      <script>
+        <JSX.Raw html={`(${insertOneTrust.toString()})();`} />
+      </script>
       <script>
         <JSX.Raw
           html={`(${insertCoveoLogo.toString()})('${event.relativeURL('assets/coveo-docs-logo.svg')}');`}

packages/headless/typedoc/lib/insertOneTrust.ts

@@ -0,0 +1,25 @@
+export function insertOneTrust() {
+  document.addEventListener('DOMContentLoaded', () => {
+    const areFunctionalCookiesEnabled = document.cookie
+      .split('; ')
+      .some(
+        (cookie) =>
+          cookie.startsWith('OptanonConsent') && cookie.includes('C0003%3A1')
+      );
+
+    if (!areFunctionalCookiesEnabled) {
+      const settingsDiv = document.querySelector('.settings');
+      if (settingsDiv) {
+        (settingsDiv as HTMLElement).style.display = 'none';
+      }
+
+      const itemsToDelete = [
+        'tsd-theme',
+        'filter-protected',
+        'filter-inherited',
+        'filter-external',
+      ];
+      itemsToDelete.forEach((item) => localStorage.removeItem(item));
+    }
+  });
+}