"use client";

import { SidebarProvider, SidebarTrigger } from "@/components/ui/sidebar";
import { AdminSidebar } from "@/components/admin/AdminSidebar";
import { useAdmin } from "@/contexts/AdminContext";
import { usePathname, useRouter } from "next/navigation";
import { useEffect } from "react"; 

export default function AdminLayout({ children }: { children: React.ReactNode }) {
  const { isAdmin } = useAdmin();
  const router = useRouter();
  const pathname = usePathname();
  const isLoginRoute = pathname === "/admin/login";

  // useEffect(() => {
  //   if (!isAdmin && !isLoginRoute) {
  //     router.push("/admin/login");
  //   }
  // }, [isAdmin, isLoginRoute, router]);

  // if (!isAdmin && !isLoginRoute) {
  //   return (
  //     <div className="min-h-screen flex items-center justify-center bg-muted/30">
  //       <div className="text-center">Chargement...</div>
  //     </div>
  //   );
  // }

  if (isLoginRoute) {
    return (
      <div className="min-h-screen flex w-full bg-muted/30">
        <div className="flex-1 flex flex-col">
          <main className="flex-1 p-6">{children}</main>
        </div>
      </div>
    );
  }

  // Layout pour l'admin connecté (avec la sidebar)
  return (
    <SidebarProvider>
      <div className="min-h-screen flex w-full bg-muted/30">
        <AdminSidebar />
        <div className="flex-1 flex flex-col">
          <header className="h-14 flex items-center border-b border-border bg-background px-4 sticky top-0 z-10">
            <SidebarTrigger />
            <h1 className="ml-4 text-sm font-medium text-muted-foreground">
              Tableau de bord
            </h1>
          </header>
          <main className="flex-1 p-6">{children}</main>
        </div>
      </div>
    </SidebarProvider>
  );
}