Add collapsible admin sidebar nav groups with persistence.

Category headers toggle open/closed; state is stored in localStorage and the active route group stays expanded.

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

src/app/admin/layout.tsx

@@ -5,12 +5,11 @@ import { getTranslations } from "next-intl/server";
 import type { ReactNode } from "react";
 import { AdminHubChrome } from "@/components/admin/admin-hub-chrome";
 import { AdminMobileWrapper } from "@/components/admin/admin-mobile-wrapper";
-import { AdminNavLink } from "@/components/admin/admin-nav-link";
+import { AdminSidebarNav } from "@/components/admin/admin-sidebar-nav";
 import { AdminTopbar } from "@/components/admin/admin-topbar";
 import { LanguageSwitcher } from "@/components/language-switcher";
 import { ThemeSwitcher } from "@/components/theme-switcher";
 import { requireStaff } from "@/lib/admin/guard";
-import { ADMIN_NAV_GROUPS } from "@/lib/admin-nav";
 import { setCsrfCookie } from "@/lib/foundation/security";
 import { prisma } from "@/lib/prisma";
 import { siteSettings } from "@/lib/services/site-settings";
@@ -94,40 +93,7 @@ async function Sidebar({
 				</div>
 			</div>
 
-			<nav className="flex-1 overflow-y-auto px-3 py-4">
-				{ADMIN_NAV_GROUPS.map((group, gi) => {
-					const GroupIcon = group.icon;
-					return (
-						<div
-							key={group.labelKey}
-							className={
-								gi > 0 ? "mt-4 pt-4 border-t border-[var(--admin-border)]" : ""
-							}
-						>
-							<div className="flex items-center gap-1.5 px-2 pb-2 text-[0.65rem] font-extrabold uppercase tracking-[0.14em] text-[var(--admin-sidebar-text-readable)] opacity-70">
-								<GroupIcon size={14} />
-								<span>{t(group.labelKey)}</span>
-							</div>
-							<div className="space-y-0.5">
-								{group.items.map((item) => {
-									const ItemIcon = item.icon;
-									return (
-										<AdminNavLink
-											key={`${group.labelKey}-${item.href}`}
-											href={item.href}
-											matchPrefixes={item.matchPrefixes}
-											matchExcludePrefixes={item.matchExcludePrefixes}
-											icon={<ItemIcon size={16} />}
-										>
-											{t(item.labelKey)}
-										</AdminNavLink>
-									);
-								})}
-							</div>
-						</div>
-					);
-				})}
-			</nav>
+			<AdminSidebarNav />
 
 			<div className="px-3 py-3 border-t border-[var(--admin-border)]">
 				<Link