import { useEffect } from "react";
import { useLocation } from "react-router";
import { useRootData } from "~/utils/data/useRootData";
import CookieHelper from "~/utils/helpers/CookieHelper";
import { CookieCategory } from "~/application/cookies/CookieCategory";
import { isAppOrAdminSurface } from "~/utils/app/HostAwareSurface";

export default function ScriptCrisp({ nonce }: { nonce?: string }) {
  const rootData = useRootData();
  const location = useLocation();

  useEffect(() => {
    const isAppOrAdminArea = isAppOrAdminSurface(rootData, location.pathname);
    const hasConsent = CookieHelper.hasConsent(rootData.userSession ?? null, CookieCategory.FUNCTIONAL);
    if (!isAppOrAdminArea && rootData.chatWebsiteId && hasConsent && !window.$crisp) {
      window.$crisp = [];
      window.CRISP_WEBSITE_ID = rootData.chatWebsiteId;
      const d = document;
      const s = d.createElement("script");
      s.src = "https://client.crisp.chat/l.js";
      s.async = true;
      if (nonce) s.nonce = nonce;
      d.getElementsByTagName("head")[0].appendChild(s);
    }
  }, [rootData, rootData.userSession?.cookies, rootData.chatWebsiteId, location.pathname, nonce]);

  return null;
}

declare global {
  interface Window {
    $crisp?: any;
    CRISP_WEBSITE_ID?: string;
  }
}