import { useNavigate } from "react-router-dom";
import { Link, Outlet } from "react-router-dom";
import { AppShell } from "@eden/ui";
import type { AppShellNavItem } from "@eden/ui";
import { useAuth } from "../lib/auth/AuthContext.js";

const NAV_ITEMS: AppShellNavItem[] = [{ key: "dashboard", label: "Painel", href: "/", active: true }];

export function AuthenticatedLayout() {
  const { user, logout } = useAuth();
  const navigate = useNavigate();

  async function handleLogout() {
    await logout();
    navigate("/login", { replace: true });
  }

  return (
    <AppShell
      appName="EDEN Parceiros"
      logoSrc="/eden-logo-horizontal.png"
      navItems={NAV_ITEMS}
      userName={user?.fullName ?? user?.email}
      userRole={user?.roleKey}
      onLogout={handleLogout}
      LinkComponent={({ href, className, children }) => (
        <Link to={href} className={className}>
          {children}
        </Link>
      )}
    >
      <Outlet />
    </AppShell>
  );
}