This commit is contained in:
1 parent
8efd032cc6
commit
df38dccbf1
735 files changed
+128321
-120870
No files matched your search
+461
-237
@@ -1,260 +1,484 @@
|
||||
import {
|
||||
Award,
|
||||
Ban,
|
||||
Bell,
|
||||
Calendar,
|
||||
ClipboardList,
|
||||
Cog,
|
||||
Compass,
|
||||
CreditCard,
|
||||
DoorOpen,
|
||||
FileText,
|
||||
Filter,
|
||||
Gem,
|
||||
Globe,
|
||||
Group,
|
||||
HelpCircle,
|
||||
History,
|
||||
Image,
|
||||
Key,
|
||||
Languages,
|
||||
LayoutDashboard,
|
||||
LogOut,
|
||||
Mail,
|
||||
Megaphone,
|
||||
MessageSquare,
|
||||
Monitor,
|
||||
Music,
|
||||
Newspaper,
|
||||
Palette,
|
||||
Radio,
|
||||
Receipt,
|
||||
Settings,
|
||||
Shield,
|
||||
ShoppingCart,
|
||||
SquarePen,
|
||||
Store,
|
||||
Tags,
|
||||
Terminal,
|
||||
Ticket,
|
||||
Trophy,
|
||||
Upload,
|
||||
Users,
|
||||
Wrench,
|
||||
} from "lucide-react";
|
||||
import Link from "next/link";
|
||||
import { redirect } from "next/navigation";
|
||||
import type { ReactNode } from "react";
|
||||
import { getTranslations } from "next-intl/server";
|
||||
import { AdminNavLink } from "@/components/admin/admin-nav-link";
|
||||
import type { ReactNode } from "react";
|
||||
import { AdminMobileWrapper } from "@/components/admin/admin-mobile-wrapper";
|
||||
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";
|
||||
import {
|
||||
LayoutDashboard,
|
||||
Newspaper,
|
||||
Tags,
|
||||
Compass,
|
||||
HelpCircle,
|
||||
Megaphone,
|
||||
SquarePen,
|
||||
Image,
|
||||
Users,
|
||||
Ban,
|
||||
Globe,
|
||||
Shield,
|
||||
ClipboardList,
|
||||
Group,
|
||||
Key,
|
||||
Store,
|
||||
ShoppingCart,
|
||||
Receipt,
|
||||
Ticket,
|
||||
CreditCard,
|
||||
Gem,
|
||||
Award,
|
||||
Trophy,
|
||||
Calendar,
|
||||
Radio,
|
||||
History,
|
||||
Terminal,
|
||||
Monitor,
|
||||
Bell,
|
||||
FileText,
|
||||
Filter,
|
||||
Wrench,
|
||||
Settings,
|
||||
DoorOpen,
|
||||
Mail,
|
||||
Palette,
|
||||
Cog,
|
||||
LogOut,
|
||||
Music,
|
||||
Languages,
|
||||
Upload,
|
||||
MessageSquare,
|
||||
} from "lucide-react";
|
||||
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
function getNavGroups(t: (key: string) => string) {
|
||||
return [
|
||||
{
|
||||
label: t("overview"),
|
||||
icon: <LayoutDashboard size={14} />,
|
||||
items: [{ href: "/admin", label: t("dashboard"), icon: <LayoutDashboard size={16} /> }],
|
||||
},
|
||||
{
|
||||
label: t("content"),
|
||||
icon: <Newspaper size={14} />,
|
||||
items: [
|
||||
{ href: "/admin/articles", label: t("articles"), icon: <Newspaper size={16} /> },
|
||||
{ href: "/admin/tags", label: t("tags"), icon: <Tags size={16} /> },
|
||||
{ href: "/admin/navigation", label: t("navigator"), icon: <Compass size={16} /> },
|
||||
{ href: "/admin/help-questions", label: t("helpCenter"), icon: <HelpCircle size={16} /> },
|
||||
{ href: "/admin/ads", label: t("advertisements"), icon: <Megaphone size={16} /> },
|
||||
{ href: "/admin/writeable-boxes", label: t("writeableBoxes"), icon: <SquarePen size={16} /> },
|
||||
{ href: "/admin/photos", label: t("photos"), icon: <Image size={16} /> },
|
||||
{ href: "/admin/tickets", label: t("tickets"), icon: <MessageSquare size={16} /> },
|
||||
{ href: "/admin/events", label: "Events", icon: <Calendar size={16} /> },
|
||||
{ href: "/admin/polls", label: "Polls", icon: <ClipboardList size={16} /> },
|
||||
{ href: "/admin/banners", label: "Banners", icon: <Image size={16} /> },
|
||||
{ href: "/admin/prefixes", label: "Prefixes", icon: <Languages size={16} /> },
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t("usersAccess"),
|
||||
icon: <Shield size={14} />,
|
||||
items: [
|
||||
{ href: "/admin/users", label: t("users"), icon: <Users size={16} /> },
|
||||
{ href: "/admin/bans", label: t("bans"), icon: <Ban size={16} /> },
|
||||
{ href: "/admin/ip", label: t("ipManagement"), icon: <Globe size={16} /> },
|
||||
{ href: "/admin/vpn", label: t("vpn"), icon: <Shield size={16} /> },
|
||||
{ href: "/admin/applications", label: t("applications"), icon: <ClipboardList size={16} /> },
|
||||
{ href: "/admin/teams", label: t("teams"), icon: <Group size={16} /> },
|
||||
{ href: "/admin/permissions", label: t("permissions"), icon: <Key size={16} /> },
|
||||
{ href: "/admin/online", label: "Online Users", icon: <Users size={16} /> },
|
||||
{ href: "/admin/moderation", label: "Moderation", icon: <Shield size={16} /> },
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t("economy"),
|
||||
icon: <ShoppingCart size={14} />,
|
||||
items: [
|
||||
{ href: "/admin/catalog", label: t("catalog"), icon: <Store size={16} /> },
|
||||
{ href: "/admin/shop", label: t("shop"), icon: <ShoppingCart size={16} /> },
|
||||
{ href: "/admin/transactions", label: t("transactions"), icon: <Receipt size={16} /> },
|
||||
{ href: "/admin/vouchers", label: t("vouchers"), icon: <Ticket size={16} /> },
|
||||
{ href: "/admin/subscriptions", label: t("subscriptions"), icon: <CreditCard size={16} /> },
|
||||
{ href: "/admin/rare-values", label: t("rareValues"), icon: <Gem size={16} /> },
|
||||
{ href: "/admin/badges", label: t("badges"), icon: <Award size={16} /> },
|
||||
{ href: "/admin/achievements", label: t("achievements"), icon: <Trophy size={16} /> },
|
||||
{ href: "/admin/calendar", label: t("calendar"), icon: <Calendar size={16} /> },
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t("radio"),
|
||||
icon: <Radio size={14} />,
|
||||
items: [
|
||||
{ href: "/admin/radio", label: t("radio"), icon: <Radio size={16} /> },
|
||||
{ href: "/admin/radio/history", label: t("radioHistory"), icon: <History size={16} /> },
|
||||
{ href: "/admin/radio/banners", label: t("radioBanners"), icon: <Image size={16} /> },
|
||||
{ href: "/admin/radio/embed", label: t("radioEmbed"), icon: <Radio size={16} /> },
|
||||
{ href: "/admin/radio/api-keys", label: t("radioApiKeys"), icon: <Key size={16} /> },
|
||||
{ href: "/admin/radio/moderation", label: t("radioModeration"), icon: <Shield size={16} /> },
|
||||
{ href: "/admin/radio/settings", label: t("radioSettings"), icon: <Settings size={16} /> },
|
||||
{ href: "/admin/radio/monitoring", label: t("radioMonitoring"), icon: <Monitor size={16} /> },
|
||||
{ href: "/admin/radio/points", label: t("radioPoints"), icon: <Gem size={16} /> },
|
||||
{ href: "/admin/radio/ranks", label: t("radioRanks"), icon: <Group size={16} /> },
|
||||
{ href: "/admin/radio/autodj", label: t("radioAutodj"), icon: <Radio size={16} /> },
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t("system"),
|
||||
icon: <Settings size={14} />,
|
||||
items: [
|
||||
{ href: "/admin/commandocentrum", label: t("commandocentrum"), icon: <Terminal size={16} /> },
|
||||
{ href: "/admin/emulator", label: t("emulator"), icon: <Monitor size={16} /> },
|
||||
{ href: "/admin/alerts", label: t("alerts"), icon: <Bell size={16} /> },
|
||||
{ href: "/admin/logs", label: t("logs"), icon: <FileText size={16} /> },
|
||||
{ href: "/admin/logs/audit", label: "Audit Log", icon: <FileText size={16} /> },
|
||||
{ href: "/admin/analytics", label: "Analytics", icon: <LayoutDashboard size={16} /> },
|
||||
{ href: "/admin/devops", label: "DevOps", icon: <Monitor size={16} /> },
|
||||
{ href: "/admin/wordfilter", label: t("wordFilter"), icon: <Filter size={16} /> },
|
||||
{ href: "/admin/maintenance", label: t("maintenance"), icon: <Wrench size={16} /> },
|
||||
{ href: "/admin/housekeeping", label: t("housekeeping"), icon: <Settings size={16} /> },
|
||||
{ href: "/admin/rooms", label: t("rooms"), icon: <DoorOpen size={16} /> },
|
||||
{ href: "/admin/email-templates", label: t("emailTemplates"), icon: <Mail size={16} /> },
|
||||
{ href: "/admin/theme", label: t("theme"), icon: <Palette size={16} /> },
|
||||
{ href: "/admin/media", label: t("media"), icon: <Image size={16} /> },
|
||||
{ href: "/admin/favicon", label: t("favicon"), icon: <Image size={16} /> },
|
||||
{ href: "/admin/sounds", label: t("sounds"), icon: <Music size={16} /> },
|
||||
{ href: "/admin/translations", label: t("translations"), icon: <Languages size={16} /> },
|
||||
{ href: "/admin/import", label: t("import"), icon: <Upload size={16} /> },
|
||||
{ href: "/admin/settings", label: t("settings"), icon: <Cog size={16} /> },
|
||||
],
|
||||
},
|
||||
];
|
||||
return [
|
||||
{
|
||||
label: t("overview"),
|
||||
icon: <LayoutDashboard size={14} />,
|
||||
items: [
|
||||
{
|
||||
href: "/admin",
|
||||
label: t("dashboard"),
|
||||
icon: <LayoutDashboard size={16} />,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t("content"),
|
||||
icon: <Newspaper size={14} />,
|
||||
items: [
|
||||
{
|
||||
href: "/admin/articles",
|
||||
label: t("articles"),
|
||||
icon: <Newspaper size={16} />,
|
||||
},
|
||||
{ href: "/admin/tags", label: t("tags"), icon: <Tags size={16} /> },
|
||||
{
|
||||
href: "/admin/navigation",
|
||||
label: t("navigator"),
|
||||
icon: <Compass size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/help-questions",
|
||||
label: t("helpCenter"),
|
||||
icon: <HelpCircle size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/ads",
|
||||
label: t("advertisements"),
|
||||
icon: <Megaphone size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/writeable-boxes",
|
||||
label: t("writeableBoxes"),
|
||||
icon: <SquarePen size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/photos",
|
||||
label: t("photos"),
|
||||
icon: <Image size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/tickets",
|
||||
label: t("tickets"),
|
||||
icon: <MessageSquare size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/events",
|
||||
label: "Events",
|
||||
icon: <Calendar size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/polls",
|
||||
label: "Polls",
|
||||
icon: <ClipboardList size={16} />,
|
||||
},
|
||||
{ href: "/admin/banners", label: "Banners", icon: <Image size={16} /> },
|
||||
{
|
||||
href: "/admin/prefixes",
|
||||
label: "Prefixes",
|
||||
icon: <Languages size={16} />,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t("usersAccess"),
|
||||
icon: <Shield size={14} />,
|
||||
items: [
|
||||
{ href: "/admin/users", label: t("users"), icon: <Users size={16} /> },
|
||||
{ href: "/admin/bans", label: t("bans"), icon: <Ban size={16} /> },
|
||||
{
|
||||
href: "/admin/ip",
|
||||
label: t("ipManagement"),
|
||||
icon: <Globe size={16} />,
|
||||
},
|
||||
{ href: "/admin/vpn", label: t("vpn"), icon: <Shield size={16} /> },
|
||||
{
|
||||
href: "/admin/applications",
|
||||
label: t("applications"),
|
||||
icon: <ClipboardList size={16} />,
|
||||
},
|
||||
{ href: "/admin/teams", label: t("teams"), icon: <Group size={16} /> },
|
||||
{
|
||||
href: "/admin/permissions",
|
||||
label: t("permissions"),
|
||||
icon: <Key size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/online",
|
||||
label: "Online Users",
|
||||
icon: <Users size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/moderation",
|
||||
label: "Moderation",
|
||||
icon: <Shield size={16} />,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t("economy"),
|
||||
icon: <ShoppingCart size={14} />,
|
||||
items: [
|
||||
{
|
||||
href: "/admin/catalog",
|
||||
label: t("catalog"),
|
||||
icon: <Store size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/shop",
|
||||
label: t("shop"),
|
||||
icon: <ShoppingCart size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/transactions",
|
||||
label: t("transactions"),
|
||||
icon: <Receipt size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/vouchers",
|
||||
label: t("vouchers"),
|
||||
icon: <Ticket size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/subscriptions",
|
||||
label: t("subscriptions"),
|
||||
icon: <CreditCard size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/rare-values",
|
||||
label: t("rareValues"),
|
||||
icon: <Gem size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/badges",
|
||||
label: t("badges"),
|
||||
icon: <Award size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/achievements",
|
||||
label: t("achievements"),
|
||||
icon: <Trophy size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/calendar",
|
||||
label: t("calendar"),
|
||||
icon: <Calendar size={16} />,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t("radio"),
|
||||
icon: <Radio size={14} />,
|
||||
items: [
|
||||
{ href: "/admin/radio", label: t("radio"), icon: <Radio size={16} /> },
|
||||
{
|
||||
href: "/admin/radio/history",
|
||||
label: t("radioHistory"),
|
||||
icon: <History size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/radio/banners",
|
||||
label: t("radioBanners"),
|
||||
icon: <Image size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/radio/embed",
|
||||
label: t("radioEmbed"),
|
||||
icon: <Radio size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/radio/api-keys",
|
||||
label: t("radioApiKeys"),
|
||||
icon: <Key size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/radio/moderation",
|
||||
label: t("radioModeration"),
|
||||
icon: <Shield size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/radio/settings",
|
||||
label: t("radioSettings"),
|
||||
icon: <Settings size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/radio/monitoring",
|
||||
label: t("radioMonitoring"),
|
||||
icon: <Monitor size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/radio/points",
|
||||
label: t("radioPoints"),
|
||||
icon: <Gem size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/radio/ranks",
|
||||
label: t("radioRanks"),
|
||||
icon: <Group size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/radio/autodj",
|
||||
label: t("radioAutodj"),
|
||||
icon: <Radio size={16} />,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t("system"),
|
||||
icon: <Settings size={14} />,
|
||||
items: [
|
||||
{
|
||||
href: "/admin/commandocentrum",
|
||||
label: t("commandocentrum"),
|
||||
icon: <Terminal size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/emulator",
|
||||
label: t("emulator"),
|
||||
icon: <Monitor size={16} />,
|
||||
},
|
||||
{ href: "/admin/alerts", label: t("alerts"), icon: <Bell size={16} /> },
|
||||
{ href: "/admin/logs", label: t("logs"), icon: <FileText size={16} /> },
|
||||
{
|
||||
href: "/admin/logs/audit",
|
||||
label: "Audit Log",
|
||||
icon: <FileText size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/analytics",
|
||||
label: "Analytics",
|
||||
icon: <LayoutDashboard size={16} />,
|
||||
},
|
||||
{ href: "/admin/devops", label: "DevOps", icon: <Monitor size={16} /> },
|
||||
{
|
||||
href: "/admin/wordfilter",
|
||||
label: t("wordFilter"),
|
||||
icon: <Filter size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/maintenance",
|
||||
label: t("maintenance"),
|
||||
icon: <Wrench size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/housekeeping",
|
||||
label: t("housekeeping"),
|
||||
icon: <Settings size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/rooms",
|
||||
label: t("rooms"),
|
||||
icon: <DoorOpen size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/email-templates",
|
||||
label: t("emailTemplates"),
|
||||
icon: <Mail size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/theme",
|
||||
label: t("theme"),
|
||||
icon: <Palette size={16} />,
|
||||
},
|
||||
{ href: "/admin/media", label: t("media"), icon: <Image size={16} /> },
|
||||
{
|
||||
href: "/admin/favicon",
|
||||
label: t("favicon"),
|
||||
icon: <Image size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/sounds",
|
||||
label: t("sounds"),
|
||||
icon: <Music size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/translations",
|
||||
label: t("translations"),
|
||||
icon: <Languages size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/import",
|
||||
label: t("import"),
|
||||
icon: <Upload size={16} />,
|
||||
},
|
||||
{
|
||||
href: "/admin/settings",
|
||||
label: t("settings"),
|
||||
icon: <Cog size={16} />,
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
export default async function AdminLayout({ children }: { children: ReactNode }) {
|
||||
const staff = await requireStaff();
|
||||
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");
|
||||
}
|
||||
export default async function AdminLayout({
|
||||
children,
|
||||
}: {
|
||||
children: ReactNode;
|
||||
}) {
|
||||
const staff = await requireStaff();
|
||||
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");
|
||||
}
|
||||
|
||||
return (
|
||||
<AdminMobileWrapper sidebar={<Sidebar staff={staff} />}>
|
||||
<div
|
||||
data-admin
|
||||
className="flex flex-col min-w-0 p-5 lg:p-6 min-h-screen"
|
||||
style={{ backgroundColor: "var(--admin-canvas)" }}
|
||||
>
|
||||
<Topbar staff={staff} />
|
||||
<section className="admin-page flex-1">{children}</section>
|
||||
</div>
|
||||
</AdminMobileWrapper>
|
||||
);
|
||||
return (
|
||||
<AdminMobileWrapper sidebar={<Sidebar staff={staff} />}>
|
||||
<div
|
||||
data-admin
|
||||
className="flex flex-col min-w-0 p-5 lg:p-6 min-h-screen"
|
||||
style={{ backgroundColor: "var(--admin-canvas)" }}
|
||||
>
|
||||
<Topbar staff={staff} />
|
||||
<section className="admin-page flex-1">{children}</section>
|
||||
</div>
|
||||
</AdminMobileWrapper>
|
||||
);
|
||||
}
|
||||
|
||||
async function Sidebar({ staff }: { staff: { id: number; username: string; rank: number } }) {
|
||||
const t = await getTranslations("pages.admin.nav");
|
||||
const initial = staff.username.charAt(0).toUpperCase();
|
||||
const navGroups = getNavGroups(t);
|
||||
async function Sidebar({
|
||||
staff,
|
||||
}: {
|
||||
staff: { id: number; username: string; rank: number };
|
||||
}) {
|
||||
const t = await getTranslations("pages.admin.nav");
|
||||
const initial = staff.username.charAt(0).toUpperCase();
|
||||
const navGroups = getNavGroups(t);
|
||||
|
||||
return (
|
||||
<aside
|
||||
data-admin
|
||||
className="sticky top-0 self-start h-auto lg:h-screen overflow-y-auto bg-[var(--admin-sidebar-background)] text-[var(--admin-sidebar-text-readable)] shadow-xl flex flex-col"
|
||||
>
|
||||
<div className="flex items-center gap-3 px-4 py-5 border-b border-[var(--admin-border)]">
|
||||
<span
|
||||
className="flex-none w-10 h-10 rounded-xl grid place-items-center font-extrabold text-base text-[var(--color-primary-foreground-readable)] bg-[var(--admin-accent)] shadow-lg shadow-[var(--admin-accent)]/20"
|
||||
aria-hidden
|
||||
>
|
||||
{initial}
|
||||
</span>
|
||||
<div className="min-w-0 flex-1">
|
||||
<div className="font-semibold text-sm text-[var(--admin-sidebar-text-readable)] truncate">
|
||||
{staff.username}
|
||||
</div>
|
||||
<span className="inline-block mt-0.5 text-[0.6rem] font-bold uppercase tracking-widest text-[var(--admin-sidebar-muted-readable)]">
|
||||
{t("rankLabel", { rank: staff.rank })}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
return (
|
||||
<aside
|
||||
data-admin
|
||||
className="sticky top-0 self-start h-auto lg:h-screen overflow-y-auto bg-[var(--admin-sidebar-background)] text-[var(--admin-sidebar-text-readable)] shadow-xl flex flex-col"
|
||||
>
|
||||
<div className="flex items-center gap-3 px-4 py-5 border-b border-[var(--admin-border)]">
|
||||
<span
|
||||
className="flex-none w-10 h-10 rounded-xl grid place-items-center font-extrabold text-base text-[var(--color-primary-foreground-readable)] bg-[var(--admin-accent)] shadow-lg shadow-[var(--admin-accent)]/20"
|
||||
aria-hidden
|
||||
>
|
||||
{initial}
|
||||
</span>
|
||||
<div className="min-w-0 flex-1">
|
||||
<div className="font-semibold text-sm text-[var(--admin-sidebar-text-readable)] truncate">
|
||||
{staff.username}
|
||||
</div>
|
||||
<span className="inline-block mt-0.5 text-[0.6rem] font-bold uppercase tracking-widest text-[var(--admin-sidebar-muted-readable)]">
|
||||
{t("rankLabel", { rank: staff.rank })}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav className="flex-1 overflow-y-auto px-3 py-4">
|
||||
{navGroups.map((group, gi) => (
|
||||
<div key={group.label} 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">
|
||||
{group.icon}
|
||||
<span>{group.label}</span>
|
||||
</div>
|
||||
<div className="space-y-0.5">
|
||||
{group.items.map((item) => (
|
||||
<AdminNavLink key={item.href} href={item.href} icon={item.icon}>
|
||||
{item.label}
|
||||
</AdminNavLink>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</nav>
|
||||
<nav className="flex-1 overflow-y-auto px-3 py-4">
|
||||
{navGroups.map((group, gi) => (
|
||||
<div
|
||||
key={group.label}
|
||||
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">
|
||||
{group.icon}
|
||||
<span>{group.label}</span>
|
||||
</div>
|
||||
<div className="space-y-0.5">
|
||||
{group.items.map((item) => (
|
||||
<AdminNavLink key={item.href} href={item.href} icon={item.icon}>
|
||||
{item.label}
|
||||
</AdminNavLink>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</nav>
|
||||
|
||||
<div className="px-3 py-3 border-t border-[var(--admin-border)]">
|
||||
<Link
|
||||
href="/"
|
||||
className="flex items-center gap-2.5 px-2.5 py-2 rounded-lg text-[var(--admin-sidebar-muted-readable)] text-xs font-medium hover:text-[var(--admin-sidebar-text-readable)] hover:bg-[var(--admin-accent)]/10 transition-all duration-150 no-underline"
|
||||
>
|
||||
<LogOut size={14} />
|
||||
<span>{t("backToSite")}</span>
|
||||
</Link>
|
||||
</div>
|
||||
</aside>
|
||||
);
|
||||
<div className="px-3 py-3 border-t border-[var(--admin-border)]">
|
||||
<Link
|
||||
href="/"
|
||||
className="flex items-center gap-2.5 px-2.5 py-2 rounded-lg text-[var(--admin-sidebar-muted-readable)] text-xs font-medium hover:text-[var(--admin-sidebar-text-readable)] hover:bg-[var(--admin-accent)]/10 transition-all duration-150 no-underline"
|
||||
>
|
||||
<LogOut size={14} />
|
||||
<span>{t("backToSite")}</span>
|
||||
</Link>
|
||||
</div>
|
||||
</aside>
|
||||
);
|
||||
}
|
||||
|
||||
async function Topbar({ staff }: { staff: { id: number; username: string; rank: number } }) {
|
||||
const t = await getTranslations("pages.admin.nav");
|
||||
async function Topbar({
|
||||
staff,
|
||||
}: {
|
||||
staff: { id: number; username: string; rank: number };
|
||||
}) {
|
||||
const t = await getTranslations("pages.admin.nav");
|
||||
|
||||
return (
|
||||
<header className="flex items-center justify-between gap-4 bg-[var(--admin-surface)] border border-[var(--admin-border)] rounded-2xl px-5 py-3 mb-5 shadow-card">
|
||||
<div className="flex items-center gap-3">
|
||||
<h2 className="m-0 text-base font-extrabold text-[var(--admin-text)]">{t("housekeeping")}</h2>
|
||||
<span className="hidden sm:inline-block w-px h-5 bg-[var(--admin-border)]" />
|
||||
<span className="hidden sm:inline text-xs text-[var(--admin-text-muted)]">
|
||||
{t("hotelManagementPanel")}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-3">
|
||||
<span className="text-xs text-[var(--admin-text-muted)]">
|
||||
<strong className="text-[var(--admin-text)]">{staff.username}</strong>
|
||||
</span>
|
||||
<span className="inline-flex items-center gap-1.5 text-[0.6rem] font-bold uppercase tracking-wider text-[var(--color-primary-foreground-readable)] bg-[var(--admin-accent)] rounded-full px-2.5 py-1">
|
||||
{t("rankLabel", { rank: staff.rank })}
|
||||
</span>
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
return (
|
||||
<header className="flex items-center justify-between gap-4 bg-[var(--admin-surface)] border border-[var(--admin-border)] rounded-2xl px-5 py-3 mb-5 shadow-card">
|
||||
<div className="flex items-center gap-3">
|
||||
<h2 className="m-0 text-base font-extrabold text-[var(--admin-text)]">
|
||||
{t("housekeeping")}
|
||||
</h2>
|
||||
<span className="hidden sm:inline-block w-px h-5 bg-[var(--admin-border)]" />
|
||||
<span className="hidden sm:inline text-xs text-[var(--admin-text-muted)]">
|
||||
{t("hotelManagementPanel")}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-3">
|
||||
<span className="text-xs text-[var(--admin-text-muted)]">
|
||||
<strong className="text-[var(--admin-text)]">{staff.username}</strong>
|
||||
</span>
|
||||
<span className="inline-flex items-center gap-1.5 text-[0.6rem] font-bold uppercase tracking-wider text-[var(--color-primary-foreground-readable)] bg-[var(--admin-accent)] rounded-full px-2.5 py-1">
|
||||
{t("rankLabel", { rank: staff.rank })}
|
||||
</span>
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
}
|
||||
Reference in new issue
Block a user