import { redirect } from "next/navigation";
import type { ReactNode } from "react";
import { AdminNavLink } from "@/components/admin/admin-nav-link";
import { requireStaff } from "@/lib/admin/guard";
import { prisma } from "@/lib/prisma";
import { siteSettings } from "@/lib/services/site-settings";

export const dynamic = "force-dynamic";

// Sidebar layout grouped like the original AtomCMS Filament panel (Content,
// Users & access, Economy, Radio, System) instead of one flat list.
const NAV_GROUPS: { label: string; items: { href: string; label: string }[] }[] = [
  {
    label: "Overview",
    items: [{ href: "/admin", label: "Dashboard" }],
  },
  {
    label: "Content",
    items: [
      { href: "/admin/articles", label: "Articles" },
      { href: "/admin/tags", label: "Tags" },
      { href: "/admin/navigation", label: "Navigator" },
      { href: "/admin/help-questions", label: "Help center" },
      { href: "/admin/ads", label: "Advertisements" },
      { href: "/admin/writeable-boxes", label: "Writeable boxes" },
      { href: "/admin/photos", label: "Photos" },
    ],
  },
  {
    label: "Users & access",
    items: [
      { href: "/admin/users", label: "Users" },
      { href: "/admin/bans", label: "Bans" },
      { href: "/admin/ip", label: "IP management" },
      { href: "/admin/vpn", label: "VPN" },
      { href: "/admin/applications", label: "Applications" },
      { href: "/admin/teams", label: "Teams" },
      { href: "/admin/permissions", label: "Permissions" },
    ],
  },
  {
    label: "Economy",
    items: [
      { href: "/admin/catalog", label: "Catalog" },
      { href: "/admin/shop", label: "Shop" },
      { href: "/admin/transactions", label: "Transactions" },
      { href: "/admin/vouchers", label: "Vouchers" },
      { href: "/admin/subscriptions", label: "Subscriptions" },
      { href: "/admin/rare-values", label: "Rare values" },
      { href: "/admin/badges", label: "Badges" },
      { href: "/admin/achievements", label: "Achievements" },
      { href: "/admin/calendar", label: "Calendar" },
    ],
  },
  {
    label: "Radio",
    items: [
      { href: "/admin/radio", label: "Radio" },
      { href: "/admin/radio/history", label: "Radio history" },
    ],
  },
  {
    label: "System",
    items: [
      { href: "/admin/commandocentrum", label: "Commandocentrum" },
      { href: "/admin/emulator", label: "Emulator" },
      { href: "/admin/alerts", label: "Alerts" },
      { href: "/admin/logs", label: "Logs" },
      { href: "/admin/wordfilter", label: "Word filter" },
      { href: "/admin/maintenance", label: "Maintenance" },
      { href: "/admin/housekeeping", label: "Housekeeping" },
      { href: "/admin/rooms", label: "Rooms" },
      { href: "/admin/email-templates", label: "Email templates" },
      { href: "/admin/theme", label: "Theme" },
      { href: "/admin/media", label: "Media" },
      { href: "/admin/settings", label: "Settings" },
    ],
  },
];

export default async function AdminLayout({ children }: { children: ReactNode }) {
  const staff = await requireStaff();

  // Force staff 2FA before the admin panel (AtomCMS ForceStaffTwoFactorMiddleware).
  if (await siteSettings.getBool("force_staff_2fa", false)) {
    const u = await prisma.user
      .findUnique({ where: { id: staff.id }, select: { twoFactorConfirmedAt: true } })
      .catch(() => null);
    if (!u?.twoFactorConfirmedAt) redirect("/settings/2fa?error=staffrequired");
  }

  const initial = staff.username.charAt(0).toUpperCase();

  return (
    <div className="admin">
      <aside className="admin-sidebar">
        <div className="admin-sidebar-head">
          <span className="admin-avatar" aria-hidden>
            {initial}
          </span>
          <div style={{ minWidth: 0 }}>
            <div className="admin-sidebar-name">{staff.username}</div>
            <span className="admin-rank-badge">rank {staff.rank}</span>
          </div>
        </div>

        <nav className="admin-nav">
          {NAV_GROUPS.map((group) => (
            <div key={group.label} className="admin-nav-group">
              <span className="admin-nav-group-label">{group.label}</span>
              {group.items.map((item) => (
                <AdminNavLink key={item.href} href={item.href} label={item.label} />
              ))}
            </div>
          ))}
        </nav>
      </aside>

      <div className="admin-content">
        <header className="admin-topbar">
          <h2>Housekeeping</h2>
          <span className="muted" style={{ fontSize: "0.8rem" }}>
            Signed in as <strong>{staff.username}</strong>
          </span>
        </header>
        <section className="admin-page">{children}</section>
      </div>
    </div>
  );
}