feat(mod): lite /mod panel + clarify ACL vs housekeeping legacy

Co-authored-by: Cursor <[email protected]>
2026-07-22 21:29:32 +02:00
1 parent a384c9a8bb
commit 084cca6ea4
@@ -0,0 +1,120 @@
+import { Ban, Gavel, LogOut, Radio, Shield } from "lucide-react";
+import Link from "next/link";
+import { redirect } from "next/navigation";
+import { getTranslations } from "next-intl/server";
+import type { ReactNode } from "react";
+import { LanguageSwitcher } from "@/components/language-switcher";
+import { ThemeSwitcher } from "@/components/theme-switcher";
+import { requireMod } from "@/lib/admin/guard";
+import { setCsrfCookie } from "@/lib/foundation/security";
+import { canAccess, getAdminContext, PERMS } from "@/lib/permissions";
+import { prisma } from "@/lib/prisma";
+import { siteSettings } from "@/lib/services/site-settings";
+
+export const dynamic = "force-dynamic";
+
+export default async function ModLayout({ children }: { children: ReactNode }) {
+	const staff = await requireMod();
+	let csrfToken = "";
+	try {
+		csrfToken = await setCsrfCookie();
+	} catch {
+		csrfToken = "";
+	}
+	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 t = await getTranslations("pages.mod");
+	const { permissions } = await getAdminContext();
+	const showCfh =
+		canAccess(permissions, PERMS.MOD_CFH_VIEW, staff.rank) ||
+		canAccess(permissions, PERMS.MODERATION_VIEW, staff.rank);
+	const showActions =
+		canAccess(permissions, PERMS.MOD_ACTIONS, staff.rank) ||
+		canAccess(permissions, PERMS.MODERATION_EDIT, staff.rank);
+	const showBans =
+		canAccess(permissions, PERMS.MOD_BANS_VIEW, staff.rank) ||
+		canAccess(permissions, PERMS.BANS_VIEW, staff.rank);
+	const showAdmin = canAccess(permissions, PERMS.ADMIN_DASHBOARD, staff.rank);
+
+	const nav = [
+		{ href: "/mod", label: t("nav.overview"), icon: Shield, show: true },
+		{ href: "/mod/cfh", label: t("nav.cfh"), icon: Radio, show: showCfh },
+		{
+			href: "/mod/actions",
+			label: t("nav.actions"),
+			icon: Gavel,
+			show: showActions,
+		},
+		{ href: "/mod/bans", label: t("nav.bans"), icon: Ban, show: showBans },
+	].filter((item) => item.show);
+
+	return (
+		<>
+			{csrfToken ? <meta name="csrf-token" content={csrfToken} /> : null}
+			<div
+				data-admin
+				className="min-h-screen"
+				style={{ backgroundColor: "var(--admin-canvas)" }}
+			>
+				<header className="border-b border-[var(--admin-border)] bg-[var(--admin-sidebar-background)]">
+					<div className="mx-auto flex max-w-6xl flex-wrap items-center gap-3 px-4 py-3">
+						<div className="min-w-0 flex-1">
+							<p className="m-0 text-xs font-bold uppercase tracking-widest text-[var(--admin-sidebar-muted-readable)]">
+								{t("badge")}
+							</p>
+							<h1 className="m-0 truncate text-lg font-semibold text-[var(--admin-sidebar-text-readable)]">
+								{t("title")}
+							</h1>
+							<p className="m-0 text-xs text-[var(--admin-sidebar-muted-readable)]">
+								{staff.username} · rank {staff.rank}
+							</p>
+						</div>
+						<div className="flex items-center gap-1.5">
+							<LanguageSwitcher variant="admin" />
+							<ThemeSwitcher variant="admin" />
+							{showAdmin ? (
+								<Link
+									href="/admin"
+									className="rounded-lg px-2.5 py-1.5 text-xs font-medium text-[var(--admin-sidebar-muted-readable)] no-underline hover:bg-[var(--admin-accent)]/10 hover:text-[var(--admin-sidebar-text-readable)]"
+								>
+									{t("nav.fullAdmin")}
+								</Link>
+							) : null}
+							<Link
+								href="/"
+								className="flex items-center gap-1.5 rounded-lg px-2.5 py-1.5 text-xs font-medium text-[var(--admin-sidebar-muted-readable)] no-underline hover:bg-[var(--admin-accent)]/10 hover:text-[var(--admin-sidebar-text-readable)]"
+							>
+								<LogOut size={14} />
+								{t("nav.backToSite")}
+							</Link>
+						</div>
+					</div>
+					<nav className="mx-auto flex max-w-6xl gap-1 overflow-x-auto px-4 pb-3">
+						{nav.map((item) => {
+							const Icon = item.icon;
+							return (
+								<Link
+									key={item.href}
+									href={item.href}
+									className="inline-flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-sm font-medium text-[var(--admin-sidebar-muted-readable)] no-underline hover:bg-[var(--admin-accent)]/10 hover:text-[var(--admin-sidebar-text-readable)]"
+								>
+									<Icon size={14} />
+									{item.label}
+								</Link>
+							);
+						})}
+					</nav>
+				</header>
+				<main className="mx-auto max-w-6xl p-4 sm:p-6">{children}</main>
+			</div>
+		</>
+	);
+}