import Link from "next/link";
import { LogOut, Book, UserCog } from "lucide-react";
import { cn } from "@/lib/utils";
import { Button } from "@/components/ui/button";
import { signOutAction } from "@/app/actions";

export function Sidebar({
  email,
  currentPath,
  isSuper = false,
}: {
  email: string;
  currentPath: string;
  isSuper?: boolean;
}) {
  const items = [
    { href: "/books", label: "单词书管理", icon: Book },
    // 仅系统管理员可见
    ...(isSuper ? [{ href: "/admin-users", label: "管理员管理", icon: UserCog }] : []),
  ];

  return (
    <aside className="flex h-screen w-64 flex-col border-r border-gray-200 bg-white">
      <div className="px-4 py-4 text-lg font-semibold">管理后台</div>
      <nav className="flex-1 px-2">
        {items.map((item) => {
          const Icon = item.icon;
          const active = currentPath.startsWith(item.href);
          return (
            <Link
              key={item.href}
              href={item.href}
              className={cn(
                "flex items-center gap-3 rounded-md px-3 py-2 text-sm font-medium hover:bg-gray-100",
                active ? "bg-gray-100" : "bg-transparent",
              )}
            >
              <Icon size={18} />
              <span>{item.label}</span>
            </Link>
          );
        })}
      </nav>
      <div className="border-t border-gray-200 p-3">
        <div className="mb-2 truncate text-sm text-gray-600">{email}</div>
        <form action={signOutAction}>
          <Button type="submit" variant="outline" size="sm" className="w-full justify-center">
            <LogOut size={16} /> 退出登录
          </Button>
        </form>
      </div>
    </aside>
  );
}
