import Link from "next/link";
import { redirect } from "next/navigation";
import {
  ArrowUpCircle,
  ClipboardList,
  GraduationCap,
  LayoutDashboard,
  LogOut,
} from "lucide-react";

import { auth, signOut } from "@/auth";
import { Button } from "@/components/ui/button";

const navItems = [
  { href: "/", label: "대시보드", icon: LayoutDashboard },
  { href: "/maestros", label: "마에스트로", icon: GraduationCap },
  { href: "/extension-requests", label: "연장 신청", icon: ClipboardList },
  { href: "/upgrade-requests", label: "업그레이드", icon: ArrowUpCircle },
];

export default async function AdminLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  const session = await auth();

  if (!session) {
    redirect("/login");
  }

  return (
    <div className="min-h-screen bg-muted/40">
      <aside className="fixed inset-y-0 left-0 hidden w-64 border-r bg-background md:block">
        <div className="flex h-16 items-center border-b px-5">
          <Link className="text-lg font-semibold" href="/">
            chocoadmin
          </Link>
        </div>
        <nav className="space-y-1 p-3">
          {navItems.map((item) => {
            const Icon = item.icon;

            return (
              <Link
                className="flex items-center gap-3 rounded-md px-3 py-2 text-sm font-medium text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
                href={item.href}
                key={item.href}
              >
                <Icon className="size-4" aria-hidden="true" />
                {item.label}
              </Link>
            );
          })}
        </nav>
      </aside>

      <div className="md:pl-64">
        <header className="sticky top-0 z-10 flex h-16 items-center justify-between border-b bg-background px-5">
          <div>
            <p className="text-sm font-medium">{session.user.name}</p>
            <p className="text-xs text-muted-foreground">
              관리자 ID {session.user.adminID}
            </p>
          </div>
          <form
            action={async () => {
              "use server";

              await signOut({ redirectTo: "/login" });
            }}
          >
            <Button size="sm" type="submit" variant="outline">
              <LogOut className="size-4" aria-hidden="true" />
              로그아웃
            </Button>
          </form>
        </header>

        <main className="p-5">{children}</main>
      </div>
    </div>
  );
}