(() => {
  if (window.__wsapGiscusInitialized) return;
  window.__wsapGiscusInitialized = true;

  const initContainer = (root) => {
    if (!(root instanceof HTMLElement) || root.dataset.giscusInit === "1")
      return;
    root.dataset.giscusInit = "1";

    const toggle = root.querySelector(".comments-toggle");
    const trigger = root.querySelector(".giscus-trigger");
    const slot = root.querySelector(".giscus-slot");

    if (
      !(toggle instanceof HTMLButtonElement) ||
      !(slot instanceof HTMLElement)
    ) {
      return;
    }

    let isLoading = false;
    let hasLoaded = false;
    let observer = null;

    const loadComments = () => {
      if (isLoading || hasLoaded) return;

      isLoading = true;
      toggle.disabled = true;
      toggle.textContent = "Loading comments...";

      const script = document.createElement("script");
      script.src = "https://giscus.app/client.js";
      script.setAttribute("data-repo", "wenekar/giscus");
      script.setAttribute("data-repo-id", "R_kgDOREZgEQ");
      script.setAttribute("data-category", "Announcements");
      script.setAttribute("data-category-id", "DIC_kwDOREZgEc4C1nRY");
      script.setAttribute("data-mapping", "pathname");
      script.setAttribute("data-strict", "0");
      script.setAttribute("data-reactions-enabled", "1");
      script.setAttribute("data-emit-metadata", "0");
      script.setAttribute("data-input-position", "top");
      script.setAttribute("data-theme", "preferred_color_scheme");
      script.setAttribute("data-lang", "en");
      script.setAttribute("data-loading", "lazy");
      script.crossOrigin = "anonymous";
      script.async = true;

      script.addEventListener("load", () => {
        isLoading = false;
        hasLoaded = true;
        toggle.remove();
      });

      script.addEventListener("error", () => {
        isLoading = false;
        hasLoaded = false;
        toggle.disabled = false;
        toggle.textContent = "Show comments";
        script.remove();
      });

      slot.appendChild(script);
      if (observer) observer.disconnect();
    };

    toggle.addEventListener("click", loadComments);

    if ("IntersectionObserver" in window && trigger instanceof HTMLElement) {
      observer = new IntersectionObserver(
        (entries) => {
          if (entries.some((entry) => entry.isIntersecting)) loadComments();
        },
        { rootMargin: "300px 0px" },
      );
      observer.observe(trigger);
    }
  };

  const initAll = () => {
    document.querySelectorAll("[data-giscus-root]").forEach(initContainer);
  };

  if (document.readyState === "loading") {
    document.addEventListener("DOMContentLoaded", initAll, { once: true });
    return;
  }

  initAll();
})();