"use client";

import Header from "@/components/Header";
import Sidebar from "@/components/Sidebar";
import LoaderSun from "@/components/common/Loader/LoaderSun";
import { sidebarData } from "@/requests/common/Sidebar/sidebar";
import { useLoadContext } from "@/src/contexts/LoadContext";
import { useScreenContext } from "@/src/contexts/ScreenContext";
import { useAuth } from "@/src/contexts/authContext";
import { MenuItem } from "@/types/sidebar";
import { checkIsPublicRoute } from "@/utils/check-is-public-route";
import { Analytics } from "@vercel/analytics/react";
import { SpeedInsights } from "@vercel/speed-insights/next";
import { useEffect, useState } from "react";
import PageForbidden from "../403";
import SystemChat from "@/components/Chat/chat";
export default function RootLayout({
  pathname,
  children,
}: {
  pathname: string;
  children: React.ReactNode;
}) {
  const [expandSidebar, setExpandSidebar] = useState(true);
  const [menus, setMenus] = useState<MenuItem[]>([]);
  const [favoritosIndex, setFavoritosIndex] = useState<number>(0);

  const { isPageLoaded, setIsPageLoaded } = useLoadContext();

  const isPublicRoute = checkIsPublicRoute(pathname);

  const { isMobile, isStandalone } = useScreenContext();

  const { valuesSession, localToken, perfil, usuario } = useAuth();
  const { session } = valuesSession();
  const handleGetDataMenu = async () => {
    return sidebarData(session?.id_usuario, session?.perfil_usuario)
      .then(async (response) => {
        // const newBody = [...response.body];
        // const menuWithPurchase = {
        //   id_menu: "999",
        //   index_menu: "9",
        //   tipo_menu: "0",
        //   nome_menu: "Compras",
        //   icone_menu: "dashboard",
        //   tipo_icone_menu: null,
        //   rotina_menu: "CXESCRM020",
        //   exclusivo_customax: "0",
        //   menu_pai: "0",
        //   menu_favorito: false,
        //   menus: [],
        // };
        const newBody = [
          ...response.body,
          // menuWithPurchase, // adiciona no final
        ];

        setIsPageLoaded(true);
        setMenus(newBody);

        setFavoritosIndex(response.favoritosIndex);
      })
      .catch((error: any) => {
        console.error("error sidebarData:", error);
      });
  };
  const handleValidateMenus = (menus: MenuItem[]) => {
    const currentPahtname = pathname.substring(1);

    const menus2 = menus
      .filter((e: any) => e.menus.length == 0 && e.nome_menu != "Favoritos")
      .map((menu: any) => menu);

    if (currentPahtname === "CXESCRM004") return true;
    if (currentPahtname === "CXESCRM005") return true;
    if (currentPahtname == "CXESCRM002") return true;
    if (currentPahtname == "CXESSIM001") return true;
    if (currentPahtname == "CXESCRM003") return true;
    if (currentPahtname == "CXESCRM012") return true;
    // if (currentPahtname == "CP1") return true;

    if (perfil?.edita_cfgGerais_perfil == 1) {
      if (currentPahtname == "CXESCFG001") return true;
    }
    if (currentPahtname == "profile") return true;
    if (currentPahtname == "notifications") return true;

    const subMenus = menus.map((menu: any) => menu.menus).flat();

    return [...menus2, ...subMenus].some(
      (e: any) => e.rotina_menu == currentPahtname,
    );
  };
  useEffect(() => {
    try {
      handleGetDataMenu();
    } catch {
      setIsPageLoaded(true);
    }
  }, [localToken, session]);

  const [sidebarClose, setSidebarClose] = useState(
    usuario?.sidebar_close_usuario == "0" ? false : true,
  );
  const [sidebarOpen, setSidebarOpen] = useState(
    usuario?.sidebar_close_usuario == "0" ? true : false,
  );
  function ajustarAltura() {
    // Calcula a altura da janela visível
    const alturaVisivel = window.innerHeight;

    // Define a altura do conteúdo para ocupar toda a janela disponível
    document.documentElement.style.setProperty(
      "--altura-visual",
      `${alturaVisivel}px`,
    );
  }

  useEffect((): any => {
    const meta = document.createElement("meta");
    ajustarAltura();
    meta.name = "viewport";
    meta.content =
      "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no";
    document.head.appendChild(meta);

    return () => document.head.removeChild(meta);
  }, []);

  // const isStandalone =
  //   typeof window !== "undefined" &&
  //   window.matchMedia("(display-mode: standalone)").matches;

  return (
    <div className={`dark:bg-boxdark-2 dark:text-bodydark divMain`}>
      <Analytics />
      {/* <TempHeader /> */}
      {isPublicRoute && (
        <main>
          <div>{children}</div>
        </main>
      )}
      {!isPublicRoute &&
        (!isPageLoaded ? (
          <div className="flex h-screen items-center justify-center bg-white">
            <LoaderSun />
          </div>
        ) : (
          <div
            className="flex h-screen   overflow-hidden max-sm:select-none"
            style={{ height: isMobile ? "calc(-70px + 100vh)" : "" }}
          >
            <SpeedInsights />
            <Sidebar
              setExpandSidebar={setExpandSidebar}
              sidebarOpen={sidebarOpen}
              setSidebarOpen={setSidebarOpen}
              sidebarClose={sidebarClose}
              setSidebarClose={setSidebarClose}
              handleGetDataMenu={handleGetDataMenu}
              localToken={localToken}
              id_usuario={session.id_usuario}
              perfil={session.perfil_usuario}
              isPageLoaded={isPageLoaded}
              menus={menus}
              funilFavorito={session.funil_favorito_usuario}
              setMenus={setMenus}
              favoritosIndex={favoritosIndex}
              setFavoritosIndex={setFavoritosIndex}
            />
            <div className="relative flex flex-1 no-scrollbar flex-col overflow-y-auto overflow-x-hidden">
              <Header
                menusFromSidebar={menus}
                sidebarOpen={sidebarOpen}
                setSidebarOpen={setSidebarOpen}
                sidebarClose={sidebarClose}
                setSidebarClose={setSidebarClose}
              />
              <main
                className="no-scrollbar"
                style={{ height: isMobile ? "calc(-150px + 100vh)" : "" }}
                onClick={() => setSidebarOpen(false)}
              >
                {handleValidateMenus(menus) && (
                  <div
                    className="mx-auto md:p-2 rounded-md bg-whiten dark:bg-transparent p-2"
                    id={`${isMobile ? "" : ""}`}
                    style={{ height: isMobile ? "100%" : "calc(100vh - 70px)" }}
                  >
                    {children}
                  </div>
                )}
                {/* <SystemChat /> */}
                {perfil && !handleValidateMenus(menus) && <PageForbidden />}
              </main>
            </div>
          </div>
        ))}
    </div>
  );
}