"use client";

import "@/css/satoshi.css";
import "@/css/style.css";

import { usePathname } from "next/navigation";
import { Sidebar } from "../../../src/components/Layouts/sidebar";

import "flatpickr/dist/flatpickr.min.css";
import "jsvectormap/dist/jsvectormap.css";

import { Header } from "../../../src/components/Layouts/header";
import NextTopLoader from "nextjs-toploader";
import type { PropsWithChildren } from "react";
import { AuthGuard } from "../../../src/components/AuthGuard";
import { Toaster } from "sonner";
import { SidebarProvider } from "../../../src/components/Layouts/sidebar/sidebar-context";
import { ThemeProvider } from "next-themes";

export default function AdminLayout({ children }: PropsWithChildren) {
  const pathname = usePathname();
  const isLoginRoute =
    pathname === "/admin/login" || pathname?.startsWith("/admin/login?");

  if (isLoginRoute) {
    return <>{children}</>;
  }

  return (
    <>
      <NextTopLoader color="#5750F1" showSpinner={false} />

      <AuthGuard>
        <div className="flex h-screen">
          <Sidebar />

          <div className="flex w-full flex-col bg-gray-2 dark:bg-[#020d1a]">
            <Header />

            <main className="mx-auto w-full max-w-screen-2xl flex-1 overflow-auto p-4 md:p-6 2xl:p-10">
              <ThemeProvider defaultTheme="light" attribute="class">
                <SidebarProvider>{children}</SidebarProvider>
              </ThemeProvider>
            </main>
          </div>
        </div>
      </AuthGuard>
      {/* <Toaster
  position="top-right"
  richColors
  closeButton
  duration={3000}
  visibleToasts={1}
  toastOptions={{
    className: "!z-[999999]",
    style: { zIndex: 999999 }
  }}
/> */}
    </>
  );
}
