Disable cookie banner when the docs site is embedded

docusaurus.config.js

@@ -57,6 +57,8 @@ const config = {
     },
   ],
 
+  clientModules: [require.resolve("./src/clientModules/embed.ts")],
+
   plugins: [
     "docusaurus-plugin-sass",
     [

src/clientModules/embed.ts

@@ -0,0 +1,28 @@
+import ExecutionEnvironment from "@docusaurus/ExecutionEnvironment";
+
+export interface DocsConfigWindow extends Window {
+  displayConfig?: {
+    cookieBanner: {
+      forceHide: boolean;
+    };
+  };
+}
+
+if (ExecutionEnvironment.canUseDOM) {
+  document.addEventListener("DOMContentLoaded", function () {
+    const urlParams = new URLSearchParams(window.location.search);
+    const isEmbedded = urlParams.get("embedded");
+    if (!isEmbedded) {
+      return;
+    }
+
+    console.log("embedded mode detected");
+
+    (window as DocsConfigWindow).displayConfig = {
+      ...(window as DocsConfigWindow).displayConfig,
+      cookieBanner: {
+        forceHide: true,
+      },
+    };
+  });
+}

src/components/CookieBanner/index.tsx

@@ -2,11 +2,16 @@ import React, { FC } from "react";
 import { Link } from "react-router-dom";
 import CookieBanner, { Cookies } from "react-cookie-banner";
 import styles from "./index.module.scss";
+import { DocsConfigWindow } from "@site/src/clientModules/embed";
 
 export const CookiesMessageBanner: FC = () => {
   const cookies = new Cookies();
 
-  if (!cookies || cookies.get("accepts-cookies")) {
+  if (
+    !cookies ||
+    cookies.get("accepts-cookies") ||
+    (window as DocsConfigWindow).displayConfig?.cookieBanner.forceHide
+  ) {
     return null;
   }