From 9fa377b8fb049b1355efca74c1cf5f3367898492 Mon Sep 17 00:00:00 2001
From: Christophe Dervieux <christophe.dervieux@gmail.com>
Date: Thu, 17 Apr 2025 14:03:54 +0200
Subject: [PATCH] Revert Giscus Mutation Observer logic to load correct theme

This reverts "Merge pull request #11047 from kv9898/main"

reverting commit 61f987c02177473129205b94c6d234ae4a18e754, reversing
changes made to dca59841224d750232ef40f4d6e9fb65b4aa5abb.

Updated logic for handling Light / Dark mode is now enough to load
the correct theme at startup. So https://github.com/quarto-dev/quarto-cli/pull/12173 fix the initial issue #8613
---
 src/resources/formats/html/giscus/giscus.ejs | 68 +++++---------------
 1 file changed, 16 insertions(+), 52 deletions(-)

diff --git a/src/resources/formats/html/giscus/giscus.ejs b/src/resources/formats/html/giscus/giscus.ejs
index 723fbeb6f7d..d80da2f2fcb 100644
--- a/src/resources/formats/html/giscus/giscus.ejs
+++ b/src/resources/formats/html/giscus/giscus.ejs
@@ -1,53 +1,17 @@
-<input type="hidden" id="giscus-base-theme" value="<%- giscus.baseTheme %>">
-<input type="hidden" id="giscus-alt-theme" value="<%- giscus.altTheme %>">
-<script>
-function loadGiscusWhenReady() {
-  // Function to get the theme based on body class
-  const getTheme = () => {
-    const baseTheme = document.getElementById('giscus-base-theme').value;
-    const altTheme = document.getElementById('giscus-alt-theme').value;
-    return document.body.classList.contains('quarto-dark') ? altTheme : baseTheme;
-  };
-
-  // Create the Giscus script and add it to the desired location
-  const loadGiscus = () => {
-    const script = document.createElement("script");
-    script.src = "https://giscus.app/client.js";
-    script.async = true;
-    script.dataset.repo = "<%- giscus.repo %>";
-    script.dataset.repoId = "<%- giscus['repo-id'] %>";
-    script.dataset.category = "<%- giscus.category %>";
-    script.dataset.categoryId = "<%- giscus['category-id'] %>";
-    script.dataset.mapping = "<%- giscus.mapping %>";
-    script.dataset.reactionsEnabled = "<%- giscus['reactions-enabled'] ? 1 : 0 %>";
-    script.dataset.emitMetadata = "0";
-    script.dataset.inputPosition = "<%- giscus['input-position'] %>";
-    script.dataset.theme = getTheme();
-    script.dataset.lang = "<%- giscus.language %>";
-    script.crossOrigin = "anonymous";
-
-    // Append the script to the desired div instead of at the end of the body
-    document.getElementById("quarto-content").appendChild(script);
-  };
-
-  // MutationObserver to detect when the 'quarto-light' or 'quarto-dark' class is added to the body
-  const observer = new MutationObserver((mutations) => {
-    for (const mutation of mutations) {
-      if (mutation.type === "attributes" && mutation.attributeName === "class") {
-        if (document.body.classList.contains('quarto-light') || document.body.classList.contains('quarto-dark')) {
-          loadGiscus();
-          observer.disconnect(); // Stop observing once Giscus is loaded
-          break;
-        }
-      }
-    }
-  });
-
-  // Start observing the body for class attribute changes
-  observer.observe(document.body, {
-    attributes: true,
-    attributeFilter: ["class"],
-  });
-}
-loadGiscusWhenReady();
+<script src="https://giscus.app/client.js"
+        data-repo="<%- giscus.repo %>"
+        data-repo-id="<%- giscus['repo-id'] %>"
+        data-category="<%- giscus.category %>"
+        data-category-id="<%- giscus['category-id'] %>"
+        data-mapping="<%- giscus.mapping %>"
+        data-reactions-enabled="<%- giscus['reactions-enabled'] ? 1 : 0 %>"
+        data-emit-metadata="0"
+        data-input-position="<%- giscus['input-position'] %>"
+        data-theme="<%- giscus.theme %>"
+        data-lang="<%- giscus.language %>"
+        crossorigin="anonymous"
+        <%- giscus.loading ? `data-loading=${giscus.loading}` : '' %>
+        async>
 </script>
+<input type="hidden" id="giscus-base-theme" value="<%- giscus.baseTheme %>">
+<input type="hidden" id="giscus-alt-theme" value="<%- giscus.altTheme %>">
\ No newline at end of file