From fc5397c1a2574cf47fc6a630f5428352161f48d7 Mon Sep 17 00:00:00 2001
From: Max Peintner <max@caos.ch>
Date: Wed, 8 Oct 2025 14:23:18 +0200
Subject: [PATCH] fix(docs): use internal script (#10870)

This changes the source of a script to an internal url to prevent CSP
errors.

# Which Problems Are Solved

Our documentation feedback script was not loaded due to being blocked by
the CSP

# How the Problems Are Solved

By internally routing to a proxy, we do not have to add external urls to
the CSP
---
 docs/docusaurus.config.js        |  7 ++++++-
 docs/src/theme/ApiItem/index.jsx | 24 +++++++++---------------
 2 files changed, 15 insertions(+), 16 deletions(-)

diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js
index 247929b66..2958987fd 100644
--- a/docs/docusaurus.config.js
+++ b/docs/docusaurus.config.js
@@ -18,6 +18,11 @@ module.exports = {
       "data-domain": "zitadel.com",
       "data-api": "/docs/proxy/api/event",
     },
+    {
+      src: "/docs/proxy/js/feedback",
+      async: true,
+      defer: true,
+    },
   ],
   customFields: {
     description:
@@ -452,7 +457,7 @@ module.exports = {
     },
   ],
   markdown: {
-    mermaid:true,
+    mermaid: true,
   },
   themes: [
     "docusaurus-theme-github-codeblock",
diff --git a/docs/src/theme/ApiItem/index.jsx b/docs/src/theme/ApiItem/index.jsx
index c80cc3987..5430dd111 100644
--- a/docs/src/theme/ApiItem/index.jsx
+++ b/docs/src/theme/ApiItem/index.jsx
@@ -7,22 +7,16 @@ export default function ApiItemWrapper(props) {
   const [plausibleLoaded, setPlausibleLoaded] = useState(false);
 
   useEffect(() => {
-    if (!document.getElementById("plausible-script")) {
-      const script = document.createElement("script");
-      script.src = "https://plausible.io/js/plausible.js";
-      script.defer = true;
-      script.async = true;
-      script.dataset.domain = window.location.hostname;
-      script.id = "plausible-script";
-
-      script.onload = () => {
+    // Script is loaded via docusaurus.config.js, just check if it's available
+    const checkPlausible = () => {
+      if (typeof window.plausible === "function") {
         setPlausibleLoaded(true);
-      };
-
-      document.body.appendChild(script);
-    } else {
-      setPlausibleLoaded(true);
-    }
+      } else {
+        // Retry after a short delay if not loaded yet
+        setTimeout(checkPlausible, 100);
+      }
+    };
+    checkPlausible();
   }, []);
 
   const sendPlausibleEvent = (feedbackValue, commentText = "") => {