hurkicorgi
6c91f7fef0
- Admin page split into tabs (Server/Players/Chat/Mods/Backups/Logs) with hash + localStorage persistence; inactive tabs no longer mount. - Log viewer: level color-coding, search, level filter chips, auto-scroll toggle, copy button, visible-line count. - Installed mods list: search field + side filter (all/both/server/client) with live count; public ModList gets skeleton + empty states and search. - Theme toggle with no-flash inline init, localStorage + system preference. - Layout: full OG / Twitter metadata, title template, keywords, dual-theme themeColor, metadataBase. - lib/mods.ts: per-jar mtime+size parse cache (cold 6s -> warm ~45ms on /api/mods for the full mod list); cache eviction on mod removal. - ChatBridge polling eased 3s -> 5s with 2s stale window. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
80 lines
2.5 KiB
TypeScript
80 lines
2.5 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
|
import { ServerControls } from "@/components/ServerControls";
|
|
import { Analytics } from "@/components/Analytics";
|
|
import { PlayerManager } from "@/components/PlayerManager";
|
|
import { ChatBridge } from "@/components/ChatBridge";
|
|
import { ModManager } from "@/components/ModManager";
|
|
import { BackupManager } from "@/components/BackupManager";
|
|
import { LogViewer } from "@/components/LogViewer";
|
|
|
|
const TABS = [
|
|
{ value: "server", label: "Server" },
|
|
{ value: "players", label: "Players" },
|
|
{ value: "chat", label: "Chat" },
|
|
{ value: "mods", label: "Mods" },
|
|
{ value: "backups", label: "Backups" },
|
|
{ value: "logs", label: "Logs" },
|
|
];
|
|
|
|
export function AdminTabs() {
|
|
const [mounted, setMounted] = useState(false);
|
|
const [value, setValue] = useState<string>("server");
|
|
|
|
useEffect(() => {
|
|
setMounted(true);
|
|
const hash = window.location.hash.replace("#", "");
|
|
if (hash && TABS.some((t) => t.value === hash)) {
|
|
setValue(hash);
|
|
return;
|
|
}
|
|
const saved = localStorage.getItem("admin-tab");
|
|
if (saved && TABS.some((t) => t.value === saved)) setValue(saved);
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
if (!mounted) return;
|
|
localStorage.setItem("admin-tab", value);
|
|
history.replaceState(null, "", `#${value}`);
|
|
}, [value, mounted]);
|
|
|
|
if (!mounted) return null;
|
|
|
|
return (
|
|
<Tabs
|
|
value={value}
|
|
onValueChange={(v) => setValue(v as string)}
|
|
className="w-full"
|
|
>
|
|
<TabsList className="flex w-full flex-wrap h-auto sm:h-9 gap-1 p-1 overflow-x-auto justify-start sm:justify-center">
|
|
{TABS.map((t) => (
|
|
<TabsTrigger key={t.value} value={t.value} className="text-xs sm:text-sm">
|
|
{t.label}
|
|
</TabsTrigger>
|
|
))}
|
|
</TabsList>
|
|
|
|
<TabsContent value="server" className="mt-4 space-y-4 sm:space-y-6">
|
|
<ServerControls />
|
|
<Analytics />
|
|
</TabsContent>
|
|
<TabsContent value="players" className="mt-4">
|
|
<PlayerManager />
|
|
</TabsContent>
|
|
<TabsContent value="chat" className="mt-4" keepMounted={false}>
|
|
<ChatBridge />
|
|
</TabsContent>
|
|
<TabsContent value="mods" className="mt-4">
|
|
<ModManager />
|
|
</TabsContent>
|
|
<TabsContent value="backups" className="mt-4">
|
|
<BackupManager />
|
|
</TabsContent>
|
|
<TabsContent value="logs" className="mt-4" keepMounted={false}>
|
|
<LogViewer />
|
|
</TabsContent>
|
|
</Tabs>
|
|
);
|
|
}
|