"use client";

import { useEffect, useState } from "react";
import { usePathname } from "next/navigation";
import Script from "next/script";

import {
  markGoogleAnalyticsReady,
  toGoogleAnalyticsClientId,
} from "@/lib/google-analytics-client-id";
import { prepareMarketingVisitor } from "@/lib/marketing-visitor";

type GtagCommand = "config" | "event" | "js" | "set";
type AnalyticsWindow = Window & Record<`ga-disable-${string}`, boolean>;

declare global {
  interface Window {
    dataLayer?: unknown[];
    gtag?: (command: GtagCommand, target: string | Date, params?: Record<string, unknown>) => void;
  }
}

const PRIVATE_PATH_PREFIXES = [
  "/api",
  "/dashboard",
  "/kavenix",
  "/mail",
  "/mail-setup",
  "/payments",
  "/reset-password",
] as const;

function isPublicAnalyticsPath(pathname: string) {
  return !PRIVATE_PATH_PREFIXES.some(
    (prefix) => pathname === prefix || pathname.startsWith(`${prefix}/`),
  );
}

function sendPageView(pathname: string) {
  if (!window.gtag) {
    return;
  }

  window.gtag("event", "page_view", {
    page_location: window.location.href,
    page_path: `${pathname}${window.location.search}`,
    page_title: document.title,
  });
}

export function GoogleAnalytics({ measurementId }: { measurementId: string }) {
  const pathname = usePathname();
  const [ready, setReady] = useState(false);
  const shouldTrack = /^G-[A-Z0-9]+$/i.test(measurementId) && isPublicAnalyticsPath(pathname);

  useEffect(() => {
    const analyticsWindow = window as unknown as AnalyticsWindow;
    analyticsWindow[`ga-disable-${measurementId}`] = !shouldTrack;
  }, [measurementId, shouldTrack]);

  useEffect(() => {
    if (!ready || !shouldTrack) {
      return;
    }

    sendPageView(pathname);
  }, [pathname, ready, shouldTrack]);

  if (!shouldTrack) {
    return null;
  }

  return (
    <>
      <Script id="officialmail-google-analytics" strategy="afterInteractive">
        {`
          window.dataLayer = window.dataLayer || [];
          window.gtag = window.gtag || function(){window.dataLayer.push(arguments);};
          window.gtag('js', new Date());
        `}
      </Script>
      <Script
        src={`https://www.googletagmanager.com/gtag/js?id=${encodeURIComponent(measurementId)}`}
        strategy="afterInteractive"
        onReady={() => {
          const visitorId = prepareMarketingVisitor();
          window.gtag?.("config", measurementId, {
            allow_ad_personalization_signals: false,
            allow_google_signals: false,
            client_id: toGoogleAnalyticsClientId(visitorId),
            cookie_expires: 31_536_000,
            send_page_view: false,
          });
          markGoogleAnalyticsReady(measurementId);
          setReady(true);
        }}
      />
    </>
  );
}