import ConsenHead from "@/src/ConsenHead";
import Preloader from "@/src/layout/Preloader";
import "@/styles/globals.css";
import { Fragment, useEffect, useState } from "react";

const App = ({ Component, pageProps }) => {
  const [loading, setLoading] = useState(true);

  useEffect(() => {
    const timer = setTimeout(() => setLoading(false), 1500);
    return () => clearTimeout(timer);
  }, []);

  useEffect(() => {
    if (typeof window === "undefined") return;

    const host = window.location.hostname;
    const isLocal =
      host === "localhost" ||
      host === "127.0.0.1" ||
      host.endsWith(".vercel.app") ||
      host.endsWith(".netlify.app");

    if (process.env.NODE_ENV !== "production" || isLocal) return;

    const script = document.createElement("script");
    script.src = "https://acsbapp.com/apps/app/dist/js/app.js";
    script.async = true;
    script.onload = () => {
      if (typeof window.acsbJS !== "undefined") {
        window.acsbJS.init();
      }
    };
    document.head.appendChild(script);

    return () => {
      script.remove();
    };
  }, []);

  return (
    <Fragment>
      <ConsenHead />
      <Preloader />
      {!loading && <Component {...pageProps} />}
    </Fragment>
  );
};

export default App;