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

Co-authored-by: Cursor <[email protected]>

src/components/top-header.tsx

@@ -3,6 +3,7 @@ import Link from "next/link";
 import type { Session } from "next-auth";
 import { signOut } from "@/lib/auth";
 import { avatarImageUrl } from "@/lib/format";
+import { canAccess, getApiAdminContext, PERMS } from "@/lib/permissions";
 import { prisma } from "@/lib/prisma";
 import { siteSettings } from "@/lib/services/site-settings";
 
@@ -70,7 +71,25 @@ export async function TopHeader({ session }: { session: Session | null }) {
 			"https://www.habbo.com/habbo-imaging/avatarimage",
 		)) ?? "";
 	const avatar = avatarImageUrl(imager, look, { headOnly: true, direction: 2 });
-	const isStaff = (session.user.rank ?? 0) >= 7;
+	let showAdmin = false;
+	let showMod = false;
+	const ctx = await getApiAdminContext();
+	if (ctx) {
+		showAdmin = canAccess(
+			ctx.permissions,
+			PERMS.ADMIN_DASHBOARD,
+			ctx.session.user.rank,
+		);
+		showMod =
+			canAccess(ctx.permissions, PERMS.MOD_DASHBOARD, ctx.session.user.rank) ||
+			canAccess(
+				ctx.permissions,
+				PERMS.MODERATION_VIEW,
+				ctx.session.user.rank,
+			) ||
+			canAccess(ctx.permissions, PERMS.MOD_CFH_VIEW, ctx.session.user.rank) ||
+			canAccess(ctx.permissions, PERMS.MOD_ACTIONS, ctx.session.user.rank);
+	}
 	const textColor =
 		"var(--color-navbar-text-readable, var(--color-navbar-text, var(--color-text)))";
 
@@ -88,36 +107,49 @@ export async function TopHeader({ session }: { session: Session | null }) {
 				</div>
 
 				<div className="flex items-center gap-x-1 sm:gap-x-3">
-					{isStaff ? (
+					{showAdmin || showMod ? (
 						<details className="relative">
 							<summary
 								className="list-none cursor-pointer font-semibold text-xs sm:text-sm [&::-webkit-details-marker]:hidden"
 								style={{ color: textColor }}
 							>
-								<span className="hidden sm:inline">Administration</span>
-								<span className="sm:hidden">Admin</span>
+								<span className="hidden sm:inline">Staff</span>
+								<span className="sm:hidden">Staff</span>
 							</summary>
 							<div
 								role="menu"
 								className="dropdown-menu absolute right-0 top-full mt-0.5 min-w-[180px] rounded-xl z-50 py-2"
 							>
-								<Link href="/admin" className="dropdown-item" role="menuitem">
-									Admin panel
-								</Link>
-								<Link
-									href="/admin/commandocentrum"
-									className="dropdown-item"
-									role="menuitem"
-								>
-									Commandocentrum
-								</Link>
-								<Link
-									href="/admin/logs"
-									className="dropdown-item"
-									role="menuitem"
-								>
-									Logs
-								</Link>
+								{showMod ? (
+									<Link href="/mod" className="dropdown-item" role="menuitem">
+										Mod panel
+									</Link>
+								) : null}
+								{showAdmin ? (
+									<>
+										<Link
+											href="/admin"
+											className="dropdown-item"
+											role="menuitem"
+										>
+											Admin panel
+										</Link>
+										<Link
+											href="/admin/commandocentrum"
+											className="dropdown-item"
+											role="menuitem"
+										>
+											Commandocentrum
+										</Link>
+										<Link
+											href="/admin/logs"
+											className="dropdown-item"
+											role="menuitem"
+										>
+											Logs
+										</Link>
+									</>
+								) : null}
 								<Link href="/logo" className="dropdown-item" role="menuitem">
 									Logo generator
 								</Link>