Reorganize admin nav by feature and soften light mode.

Sidebar lists one entry per feature; keep hub tabs only for sibling views (events, tickets, ranks/permissions, moderation, radio, analytics, devops). Soft cool-gray light canvas/surface replaces harsh white.

Co-authored-by: Cursor <[email protected]>
This commit is contained in:
SimoandCursor committed 2026-07-18 22:06:41 +02:00
1 parent 022fbfa223
commit dd806d2527
9 files changed
+344 -267

No files matched your search

+242 -245
View File
@@ -1,19 +1,42 @@
import type { LucideIcon } from "lucide-react";
import {
Activity,
AlertTriangle,
BadgeCheck,
Ban,
Calendar,
CalendarDays,
ClipboardList,
Cog,
Compass,
FileText,
Filter,
Gavel,
HelpCircle,
Image,
Import,
KeyRound,
Languages,
LayoutDashboard,
Megaphone,
Monitor,
Newspaper,
Package,
Radio,
Server,
Settings,
Shield,
ShoppingCart,
Sparkles,
Store,
Tags,
Terminal,
Ticket,
Trophy,
Users,
Volume2,
Vote,
Wifi,
Wrench,
} from "lucide-react";
@@ -43,6 +66,8 @@ export interface AdminNavItem {
icon: LucideIcon;
/** When set, sidebar item is active if pathname matches any prefix. */
matchPrefixes?: string[];
/** Prefixes that must NOT count as active (e.g. /admin/users vs multi-accounts). */
matchExcludePrefixes?: string[];
}
export interface AdminNavGroup {
@@ -51,65 +76,29 @@ export interface AdminNavGroup {
items: AdminNavItem[];
}
/**
* Hubs with real sibling tabs only. Standalone features have no hub chrome
* (sidebar links go straight to the page).
*/
export const ADMIN_HUBS: AdminHubDefinition[] = [
{
id: "news-media",
titleKey: "newsMedia",
subtitleKey: "newsMediaSubtitle",
icon: Newspaper,
prefixes: [
"/admin/articles",
"/admin/photos",
"/admin/banners",
"/admin/ads",
"/admin/media",
],
tabs: [
{
href: "/admin/articles",
labelKey: "articles",
match: ["/admin/articles"],
},
{ href: "/admin/photos", labelKey: "photos" },
{ href: "/admin/banners", labelKey: "banners" },
{ href: "/admin/ads", labelKey: "ads", match: ["/admin/ads"] },
{ href: "/admin/media", labelKey: "media" },
],
},
{
id: "site-content",
titleKey: "siteContent",
subtitleKey: "siteContentSubtitle",
icon: Compass,
prefixes: [
"/admin/navigation",
"/admin/help-questions",
"/admin/writeable-boxes",
"/admin/tags",
"/admin/prefixes",
],
tabs: [
{ href: "/admin/navigation", labelKey: "navigator" },
{
href: "/admin/help-questions",
labelKey: "help",
match: ["/admin/help-questions"],
},
{ href: "/admin/writeable-boxes", labelKey: "boxes" },
{ href: "/admin/tags", labelKey: "tags" },
{ href: "/admin/prefixes", labelKey: "prefixes" },
],
},
{
id: "engagement",
titleKey: "engagement",
subtitleKey: "engagementSubtitle",
id: "events",
titleKey: "events",
subtitleKey: "eventsSubtitle",
icon: Calendar,
prefixes: ["/admin/events", "/admin/polls", "/admin/tickets"],
prefixes: ["/admin/events"],
tabs: [
{ href: "/admin/events", labelKey: "events", match: ["/admin/events"] },
{ href: "/admin/events/types", labelKey: "eventTypes" },
{ href: "/admin/polls", labelKey: "polls", match: ["/admin/polls"] },
],
},
{
id: "tickets",
titleKey: "tickets",
subtitleKey: "ticketsSubtitle",
icon: Ticket,
prefixes: ["/admin/tickets"],
tabs: [
{
href: "/admin/tickets",
labelKey: "tickets",
@@ -119,50 +108,19 @@ export const ADMIN_HUBS: AdminHubDefinition[] = [
],
},
{
id: "users",
titleKey: "users",
subtitleKey: "usersSubtitle",
icon: Users,
prefixes: [
"/admin/users",
"/admin/online",
"/admin/applications",
"/admin/teams",
],
id: "staff-access",
titleKey: "staffAccess",
subtitleKey: "staffAccessSubtitle",
icon: KeyRound,
prefixes: ["/admin/teams", "/admin/permissions", "/admin/housekeeping"],
tabs: [
{
href: "/admin/users",
labelKey: "directory",
match: ["/admin/users"],
},
{ href: "/admin/users/multi-accounts", labelKey: "multiAccounts" },
{ href: "/admin/online", labelKey: "online" },
{ href: "/admin/applications", labelKey: "applications" },
{ href: "/admin/teams", labelKey: "teams" },
],
},
{
id: "access",
titleKey: "access",
subtitleKey: "accessSubtitle",
icon: Shield,
prefixes: [
"/admin/bans",
"/admin/ip",
"/admin/vpn",
"/admin/permissions",
"/admin/wordfilter",
],
tabs: [
{ href: "/admin/bans", labelKey: "bans" },
{ href: "/admin/ip", labelKey: "ip" },
{ href: "/admin/vpn", labelKey: "vpn" },
{
href: "/admin/permissions",
labelKey: "permissions",
match: ["/admin/permissions"],
},
{ href: "/admin/wordfilter", labelKey: "wordFilter" },
{ href: "/admin/housekeeping", labelKey: "housekeeping" },
],
},
{
@@ -182,50 +140,6 @@ export const ADMIN_HUBS: AdminHubDefinition[] = [
{ href: "/admin/moderation/team", labelKey: "team" },
],
},
{
id: "catalog",
titleKey: "catalog",
subtitleKey: "catalogSubtitle",
icon: Store,
prefixes: [
"/admin/catalog",
"/admin/rare-values",
"/admin/badges",
"/admin/achievements",
"/admin/sounds",
],
tabs: [
{ href: "/admin/catalog", labelKey: "catalogTab", match: ["/admin/catalog"] },
{ href: "/admin/rare-values", labelKey: "rares" },
{ href: "/admin/badges", labelKey: "badges" },
{ href: "/admin/achievements", labelKey: "achievements" },
{ href: "/admin/sounds", labelKey: "sounds" },
],
},
{
id: "shop",
titleKey: "shop",
subtitleKey: "shopSubtitle",
icon: ShoppingCart,
prefixes: [
"/admin/shop",
"/admin/transactions",
"/admin/vouchers",
"/admin/subscriptions",
"/admin/calendar",
],
tabs: [
{ href: "/admin/shop", labelKey: "shopTab" },
{ href: "/admin/transactions", labelKey: "transactions" },
{ href: "/admin/vouchers", labelKey: "vouchers" },
{ href: "/admin/subscriptions", labelKey: "subscriptions" },
{
href: "/admin/calendar",
labelKey: "calendar",
match: ["/admin/calendar"],
},
],
},
{
id: "radio",
titleKey: "radio",
@@ -245,7 +159,11 @@ export const ADMIN_HUBS: AdminHubDefinition[] = [
labelKey: "monitoring",
group: "primary",
},
{ href: "/admin/radio/settings", labelKey: "settingsTab", group: "primary" },
{
href: "/admin/radio/settings",
labelKey: "settingsTab",
group: "primary",
},
{ href: "/admin/radio/banners", labelKey: "banners", group: "tools" },
{ href: "/admin/radio/embed", labelKey: "embed", group: "tools" },
{ href: "/admin/radio/api-keys", labelKey: "apiKeys", group: "tools" },
@@ -255,68 +173,12 @@ export const ADMIN_HUBS: AdminHubDefinition[] = [
],
},
{
id: "settings",
titleKey: "settings",
subtitleKey: "settingsSubtitle",
icon: Cog,
prefixes: [
"/admin/settings",
"/admin/theme",
"/admin/maintenance",
"/admin/favicon",
"/admin/emulator",
"/admin/email-templates",
"/admin/housekeeping",
],
id: "analytics",
titleKey: "analytics",
subtitleKey: "analyticsSubtitle",
icon: Activity,
prefixes: ["/admin/analytics"],
tabs: [
{ href: "/admin/settings", labelKey: "cms" },
{ href: "/admin/theme", labelKey: "theme" },
{ href: "/admin/maintenance", labelKey: "maintenance" },
{ href: "/admin/favicon", labelKey: "favicon" },
{ href: "/admin/emulator", labelKey: "emulator" },
{ href: "/admin/email-templates", labelKey: "email" },
{ href: "/admin/housekeeping", labelKey: "housekeeping" },
],
},
{
id: "tools",
titleKey: "tools",
subtitleKey: "toolsSubtitle",
icon: Wrench,
prefixes: [
"/admin/commandocentrum",
"/admin/rooms",
"/admin/import",
"/admin/translations",
],
tabs: [
{ href: "/admin/commandocentrum", labelKey: "commando" },
{ href: "/admin/rooms", labelKey: "rooms", match: ["/admin/rooms"] },
{ href: "/admin/import", labelKey: "import", match: ["/admin/import"] },
{
href: "/admin/translations",
labelKey: "translations",
match: ["/admin/translations"],
},
],
},
{
id: "observability",
titleKey: "observability",
subtitleKey: "observabilitySubtitle",
icon: Monitor,
prefixes: [
"/admin/logs",
"/admin/analytics",
"/admin/devops",
"/admin/alerts",
],
tabs: [
{ href: "/admin/logs", labelKey: "logs" },
{ href: "/admin/logs/audit", labelKey: "audit" },
{ href: "/admin/logs/chat", labelKey: "chat" },
{ href: "/admin/logs/commands", labelKey: "commands" },
{ href: "/admin/logs/trades", labelKey: "trades" },
{
href: "/admin/analytics",
labelKey: "analytics",
@@ -324,26 +186,38 @@ export const ADMIN_HUBS: AdminHubDefinition[] = [
},
{ href: "/admin/analytics/activity", labelKey: "activity" },
{ href: "/admin/analytics/economy", labelKey: "economy" },
],
},
{
id: "devops",
titleKey: "devops",
subtitleKey: "devopsSubtitle",
icon: Server,
prefixes: ["/admin/devops"],
tabs: [
{ href: "/admin/devops", labelKey: "devops", match: ["/admin/devops"] },
{ href: "/admin/devops/errors", labelKey: "errors" },
{ href: "/admin/alerts", labelKey: "alerts" },
],
},
];
/** Longest-prefix match so nested routes (e.g. /admin/logs/audit) win. */
export function findAdminHub(pathname: string): AdminHubDefinition | null {
return (
ADMIN_HUBS.find((hub) =>
hub.prefixes.some((p) => pathname === p || pathname.startsWith(`${p}/`)),
) ?? null
);
let best: AdminHubDefinition | null = null;
let bestLen = -1;
for (const hub of ADMIN_HUBS) {
for (const prefix of hub.prefixes) {
const hit = pathname === prefix || pathname.startsWith(`${prefix}/`);
if (hit && prefix.length > bestLen) {
best = hub;
bestLen = prefix.length;
}
}
}
return best;
}
function hubPrefixes(id: string): string[] {
return ADMIN_HUBS.find((h) => h.id === id)?.prefixes ?? [];
}
/** Condensed sidebar — one entry per hub (plus dashboard). */
/** Feature-first sidebar: one entry per feature; hubs only for sibling tabs. */
export const ADMIN_NAV_GROUPS: AdminNavGroup[] = [
{
labelKey: "overview",
@@ -362,45 +236,100 @@ export const ADMIN_NAV_GROUPS: AdminNavGroup[] = [
items: [
{
href: "/admin/articles",
labelKey: "hubNewsMedia",
labelKey: "articles",
icon: Newspaper,
matchPrefixes: hubPrefixes("news-media"),
matchPrefixes: ["/admin/articles"],
},
{ href: "/admin/photos", labelKey: "photos", icon: Image },
{ href: "/admin/banners", labelKey: "banners", icon: Megaphone },
{
href: "/admin/ads",
labelKey: "advertisements",
icon: FileText,
matchPrefixes: ["/admin/ads"],
},
{ href: "/admin/media", labelKey: "media", icon: Image },
{ href: "/admin/navigation", labelKey: "navigator", icon: Compass },
{
href: "/admin/help-questions",
labelKey: "helpCenter",
icon: HelpCircle,
matchPrefixes: ["/admin/help-questions"],
},
{
href: "/admin/navigation",
labelKey: "hubSiteContent",
icon: Compass,
matchPrefixes: hubPrefixes("site-content"),
href: "/admin/writeable-boxes",
labelKey: "writeableBoxes",
icon: Package,
},
{ href: "/admin/tags", labelKey: "tags", icon: Tags },
{ href: "/admin/prefixes", labelKey: "prefixes", icon: Sparkles },
],
},
{
labelKey: "community",
icon: Calendar,
items: [
{
href: "/admin/events",
labelKey: "hubEngagement",
labelKey: "events",
icon: Calendar,
matchPrefixes: hubPrefixes("engagement"),
matchPrefixes: ["/admin/events"],
},
{
href: "/admin/polls",
labelKey: "polls",
icon: Vote,
matchPrefixes: ["/admin/polls"],
},
{
href: "/admin/tickets",
labelKey: "tickets",
icon: Ticket,
matchPrefixes: ["/admin/tickets"],
},
],
},
{
labelKey: "usersAndAccess",
icon: Shield,
icon: Users,
items: [
{
href: "/admin/users",
labelKey: "hubUsers",
labelKey: "users",
icon: Users,
matchPrefixes: hubPrefixes("users"),
matchPrefixes: ["/admin/users"],
matchExcludePrefixes: ["/admin/users/multi-accounts"],
},
{
href: "/admin/bans",
labelKey: "hubAccess",
icon: Ban,
matchPrefixes: hubPrefixes("access"),
href: "/admin/users/multi-accounts",
labelKey: "multiAccounts",
icon: Users,
},
{ href: "/admin/online", labelKey: "onlineUsers", icon: Wifi },
{
href: "/admin/applications",
labelKey: "applications",
icon: ClipboardList,
},
{
href: "/admin/teams",
labelKey: "staffAccess",
icon: KeyRound,
matchPrefixes: [
"/admin/teams",
"/admin/permissions",
"/admin/housekeeping",
],
},
{ href: "/admin/bans", labelKey: "bans", icon: Ban },
{ href: "/admin/ip", labelKey: "ipManagement", icon: Shield },
{ href: "/admin/vpn", labelKey: "vpn", icon: Shield },
{ href: "/admin/wordfilter", labelKey: "wordFilter", icon: Filter },
{
href: "/admin/moderation",
labelKey: "moderation",
icon: Gavel,
matchPrefixes: hubPrefixes("moderation"),
matchPrefixes: ["/admin/moderation"],
},
],
},
@@ -410,15 +339,27 @@ export const ADMIN_NAV_GROUPS: AdminNavGroup[] = [
items: [
{
href: "/admin/catalog",
labelKey: "hubCatalog",
labelKey: "catalog",
icon: Store,
matchPrefixes: hubPrefixes("catalog"),
matchPrefixes: ["/admin/catalog"],
},
{ href: "/admin/rare-values", labelKey: "rareValues", icon: Sparkles },
{ href: "/admin/badges", labelKey: "badges", icon: BadgeCheck },
{ href: "/admin/achievements", labelKey: "achievements", icon: Trophy },
{ href: "/admin/sounds", labelKey: "sounds", icon: Volume2 },
{ href: "/admin/shop", labelKey: "shop", icon: ShoppingCart },
{ href: "/admin/transactions", labelKey: "transactions", icon: Activity },
{ href: "/admin/vouchers", labelKey: "vouchers", icon: Ticket },
{
href: "/admin/subscriptions",
labelKey: "subscriptions",
icon: ClipboardList,
},
{
href: "/admin/shop",
labelKey: "hubShop",
icon: ShoppingCart,
matchPrefixes: hubPrefixes("shop"),
href: "/admin/calendar",
labelKey: "calendar",
icon: CalendarDays,
matchPrefixes: ["/admin/calendar"],
},
],
},
@@ -438,24 +379,80 @@ export const ADMIN_NAV_GROUPS: AdminNavGroup[] = [
labelKey: "system",
icon: Settings,
items: [
{ href: "/admin/settings", labelKey: "settings", icon: Cog },
{ href: "/admin/theme", labelKey: "theme", icon: Sparkles },
{ href: "/admin/maintenance", labelKey: "maintenance", icon: Wrench },
{ href: "/admin/favicon", labelKey: "favicon", icon: Image },
{ href: "/admin/emulator", labelKey: "emulator", icon: Server },
{
href: "/admin/settings",
labelKey: "settings",
icon: Cog,
matchPrefixes: hubPrefixes("settings"),
},
{
href: "/admin/commandocentrum",
labelKey: "hubTools",
icon: Wrench,
matchPrefixes: hubPrefixes("tools"),
},
{
href: "/admin/logs",
labelKey: "hubObservability",
icon: Monitor,
matchPrefixes: hubPrefixes("observability"),
href: "/admin/email-templates",
labelKey: "emailTemplates",
icon: FileText,
},
],
},
{
labelKey: "tools",
icon: Wrench,
items: [
{
href: "/admin/commandocentrum",
labelKey: "commandocentrum",
icon: Terminal,
},
{
href: "/admin/rooms",
labelKey: "rooms",
icon: Store,
matchPrefixes: ["/admin/rooms"],
},
{
href: "/admin/import",
labelKey: "import",
icon: Import,
matchPrefixes: ["/admin/import"],
},
{
href: "/admin/translations",
labelKey: "translations",
icon: Languages,
matchPrefixes: ["/admin/translations"],
},
],
},
{
labelKey: "monitoring",
icon: Monitor,
items: [
{
href: "/admin/logs",
labelKey: "logs",
icon: FileText,
matchPrefixes: ["/admin/logs"],
matchExcludePrefixes: [
"/admin/logs/audit",
"/admin/logs/chat",
"/admin/logs/commands",
"/admin/logs/trades",
],
},
{ href: "/admin/logs/audit", labelKey: "auditLog", icon: ClipboardList },
{ href: "/admin/logs/chat", labelKey: "chatLog", icon: FileText },
{ href: "/admin/logs/commands", labelKey: "commandLog", icon: Terminal },
{ href: "/admin/logs/trades", labelKey: "tradeLog", icon: Activity },
{
href: "/admin/analytics",
labelKey: "analytics",
icon: Activity,
matchPrefixes: ["/admin/analytics"],
},
{
href: "/admin/devops",
labelKey: "devops",
icon: Server,
matchPrefixes: ["/admin/devops"],
},
{ href: "/admin/alerts", labelKey: "alerts", icon: AlertTriangle },
],
},
];