Files
Epicnabbo-Catalogus-Updated…/src/app/admin/commandocentrum/page.tsx
T

460 lines
21 KiB
TypeScript

import os from "node:os";
import { getTranslations } from "next-intl/server";
import { Activity } from 'lucide-react';
import {
hotelAlert,
updateCatalog,
updateNavigator,
updateWordFilter,
disconnectUser,
alertUser,
forwardUser,
giveCredits,
giveDuckets,
giveDiamonds,
giveBadge,
setMotto,
setRank,
executeCommand,
sendGift,
} from "@/actions/commandocentrum";
import { DiagnosticRow, InfoItem, StatusCard, OnlineUsersWidget } from "@/components/admin/dashboard";
import { prisma } from "@/lib/prisma";
import { rcon } from "@/lib/services/rcon";
import { siteSettings } from "@/lib/services/site-settings";
export const dynamic = "force-dynamic";
function formatTimestamp(ts: number | null | undefined): string {
if (!ts) return "";
return new Date(ts * 1000).toISOString().slice(0, 19).replace("T", " ");
}
function fromDate(d: Date | null | undefined): string {
return d ? d.toISOString().slice(0, 19).replace("T", " ") : "—";
}
function decodeStacktrace(raw: unknown): string {
if (raw == null) return "";
try {
if (typeof raw === "string") return raw;
return Buffer.from(raw as Uint8Array).toString("utf8");
} catch {
return "";
}
}
function mb(bytes: number): string {
return `${Math.round(bytes / 1024 / 1024)} MB`;
}
function uptime(seconds: number): string {
const d = Math.floor(seconds / 86400);
const h = Math.floor((seconds % 86400) / 3600);
const m = Math.floor((seconds % 3600) / 60);
return d > 0 ? `${d}d ${h}h ${m}m` : h > 0 ? `${h}h ${m}m` : `${m}m`;
}
export default async function CommandoCentrum() {
const t = await getTranslations("pages.admin.commandocentrum");
const [onlineCount, totalUsers, errors, dbOk, emulatorOnline, maintenance, activity] =
await Promise.all([
prisma.user.count({ where: { online: "1" } }).catch(() => 0),
prisma.user.count().catch(() => -1),
prisma.emulatorErrors.findMany({ orderBy: { timestamp: "desc" }, take: 50 }).catch(() => []),
prisma.websiteSetting
.count()
.then(() => true)
.catch(() => false),
rcon.send("ping", null).catch(() => false),
siteSettings.getBool("maintenance_enabled", false),
prisma.staffActivities
.findMany({ orderBy: { createdAt: "desc" }, take: 12 })
.catch(() => [] as Awaited<ReturnType<typeof prisma.staffActivities.findMany>>),
]);
const staffIds = Array.from(new Set(activity.map((a) => Number(a.userId)))).filter((n) => n > 0);
let nameById = new Map<number, string>();
if (staffIds.length) {
const users = await prisma.user
.findMany({ where: { id: { in: staffIds } }, select: { id: true, username: true } })
.catch(() => []);
nameById = new Map(users.map((u) => [u.id, u.username]));
}
const appKeySet = !!process.env.APP_KEY;
const smtpSet = !!process.env.SMTP_HOST;
const rconSet = !!process.env.RCON_HOST;
return (
<main>
<div className="flex items-center gap-3 mb-6">
<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-[var(--color-primary)]/20 to-[var(--color-primary)]/5 grid place-items-center">
<Activity size={20} className="text-[var(--color-primary)]" />
</div>
<div>
<h1 className="m-0 text-xl font-extrabold text-[var(--color-text)]">{t("title")}</h1>
<p className="m-0 text-xs text-[var(--color-text-muted)] mt-0.5">{t("subtitle")}</p>
</div>
</div>
{/* ── Live status ────────────────────────────────────────── */}
<div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6" style={{ marginTop: "1.1rem" }}>
<StatusCard
label={t("playersOnline")}
value={onlineCount}
hint={totalUsers >= 0 ? t("totalAccounts", { count: totalUsers }) : t("dbUnavailable")}
state="neutral"
icon="👤"
/>
<StatusCard
label={t("emulator")}
value={emulatorOnline ? t("online") : t("offline")}
hint={emulatorOnline ? t("rconReachable") : t("rconNotResponding")}
state={emulatorOnline ? "ok" : "danger"}
icon="🎮"
/>
<StatusCard
label={t("database")}
value={dbOk ? t("connected") : t("down")}
hint={dbOk ? t("queriesResponding") : t("cannotReachDb")}
state={dbOk ? "ok" : "danger"}
icon="🗄️"
/>
<StatusCard
label={t("emulatorErrors")}
value={errors.length}
hint={t("last50Logged")}
state={errors.length === 0 ? "ok" : "warn"}
icon="⚠️"
/>
</div>
{/* ── Online users widget ───────────────────────────────── */}
<section className="admin-card mb-6">
<h2 className="admin-section-title">{t("onlineUsers")}</h2>
<OnlineUsersWidget
users={[]}
isLoading={false}
/>
</section>
{/* ── Server info + diagnostics ──────────────────────────── */}
<div className="grid cols-2">
<section className="admin-card p-5">
<h2 className="admin-section-title">{t("serverInfo")}</h2>
<div className="grid grid-cols-[repeat(auto-fit,minmax(150px,1fr))] gap-2.5">
<InfoItem label={t("node")} value={process.version} />
<InfoItem label={t("platform")} value={`${process.platform} ${process.arch}`} />
<InfoItem label={t("appUptime")} value={uptime(process.uptime())} />
<InfoItem label={t("heapUsed")} value={mb(process.memoryUsage().heapUsed)} />
<InfoItem label={t("rss")} value={mb(process.memoryUsage().rss)} />
<InfoItem label={t("hostUptime")} value={uptime(os.uptime())} />
<InfoItem label={t("load1m")} value={os.loadavg()[0]?.toFixed(2) ?? "—"} />
<InfoItem label={t("cpus")} value={os.cpus().length} />
</div>
</section>
<section className="admin-card p-5">
<h2 className="admin-section-title">{t("systemDiagnostics")}</h2>
<div className="flex flex-col">
<DiagnosticRow
label={t("database")}
detail={dbOk ? t("connectionHealthy") : t("unreachable")}
state={dbOk ? "ok" : "danger"}
/>
<DiagnosticRow
label={t("emulatorRcon")}
detail={emulatorOnline ? t("respondingToPing") : t("noResponse")}
state={emulatorOnline ? "ok" : "warn"}
/>
<DiagnosticRow
label={t("rconConfig")}
detail={rconSet ? t("rconHostSet") : t("rconHostNotConfigured")}
state={rconSet ? "ok" : "warn"}
/>
<DiagnosticRow
label={t("twoFaEncryptionKey")}
detail={appKeySet ? t("appKeyConfigured") : t("appKeyMissing")}
state={appKeySet ? "ok" : "warn"}
/>
<DiagnosticRow
label={t("emailSmtp")}
detail={smtpSet ? t("smtpHostSet") : t("notConfigured")}
state={smtpSet ? "ok" : "warn"}
/>
<DiagnosticRow
label={t("maintenanceMode")}
detail={maintenance ? t("siteIsInMaintenance") : t("siteIsLive")}
state={maintenance ? "warn" : "ok"}
/>
</div>
</section>
</div>
<section className="mt-6">
<h2 className="admin-section-title">{t("emulatorControls")}</h2>
<div className="grid grid-cols-1 sm:grid-cols-3 gap-4">
<form action={updateCatalog} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("updateCatalog")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-4">
{t("updateCatalogDesc")}
</p>
<button type="submit" className="btn btn-primary">
{t("updateCatalog")}
</button>
</form>
<form action={updateWordFilter} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("updateWordFilter")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-4">
{t("updateWordFilterDesc")}
</p>
<button type="submit" className="btn btn-primary">
{t("updateWordFilter")}
</button>
</form>
<form action={updateNavigator} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("updateNavigator")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-4">
{t("updateNavigatorDesc")}
</p>
<button type="submit" className="btn btn-primary">
{t("updateNavigator")}
</button>
</form>
</div>
<form action={hotelAlert} className="admin-card mt-6">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("hotelAlert")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">
{t("hotelAlertDesc")}
</p>
<div className="flex gap-2">
<input
name="message"
required
maxLength={512}
placeholder={t("messageToBroadcast")}
className="flex-1 min-w-[220px]"
/>
<button type="submit" className="btn btn-danger">
{t("sendAlert")}
</button>
</div>
</form>
</section>
{/* ── User RCON actions ──────────────────────────────────── */}
<section className="mt-6">
<h2 className="admin-section-title">{t("userActions")}</h2>
<p className="text-xs text-[var(--color-text-muted)] mb-4">
{t("userActionsDesc")}
</p>
<div className="grid grid-cols-1 sm:grid-cols-3 gap-4">
<form action={disconnectUser} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("actions.disconnect")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">{t("disconnectDesc")}</p>
<div className="space-y-2">
<input name="userId" type="number" min={1} placeholder={t("userId")} required className="w-full" />
<input name="username" type="text" placeholder={t("usernameRequired")} required className="w-full" />
<button type="submit" className="btn btn-danger w-full">{t("actions.disconnect")}</button>
</div>
</form>
<form action={alertUser} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("actions.alert")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">{t("alertDesc")}</p>
<div className="space-y-2">
<input name="userId" type="number" min={1} placeholder={t("userId")} required className="w-full" />
<input name="message" type="text" placeholder={t("alertMessage")} required maxLength={512} className="w-full" />
<button type="submit" className="btn btn-primary w-full">{t("actions.alert")}</button>
</div>
</form>
<form action={forwardUser} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("forwardToRoom")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">{t("forwardDesc")}</p>
<div className="space-y-2">
<input name="userId" type="number" min={1} placeholder={t("userId")} required className="w-full" />
<input name="roomId" type="number" min={1} placeholder={t("roomId")} required className="w-full" />
<button type="submit" className="btn btn-primary w-full">{t("forwardUser")}</button>
</div>
</form>
</div>
<div className="grid grid-cols-1 sm:grid-cols-3 gap-4 mt-4">
<form action={giveCredits} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("giveCredits")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">{t("giveCreditsDesc")}</p>
<div className="space-y-2">
<input name="userId" type="number" min={1} placeholder={t("userId")} required className="w-full" />
<input name="credits" type="number" min={1} placeholder={t("amount")} required className="w-full" />
<button type="submit" className="btn btn-primary w-full">{t("giveCredits")}</button>
</div>
</form>
<form action={giveDuckets} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("giveDuckets")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">{t("giveDucketsDesc")}</p>
<div className="space-y-2">
<input name="userId" type="number" min={1} placeholder={t("userId")} required className="w-full" />
<input name="amount" type="number" min={1} placeholder={t("amount")} required className="w-full" />
<button type="submit" className="btn btn-primary w-full">{t("giveDuckets")}</button>
</div>
</form>
<form action={giveDiamonds} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("giveDiamonds")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">{t("giveDiamondsDesc")}</p>
<div className="space-y-2">
<input name="userId" type="number" min={1} placeholder={t("userId")} required className="w-full" />
<input name="amount" type="number" min={1} placeholder={t("amount")} required className="w-full" />
<button type="submit" className="btn btn-primary w-full">{t("giveDiamonds")}</button>
</div>
</form>
</div>
<div className="grid grid-cols-1 sm:grid-cols-3 gap-4 mt-4">
<form action={giveBadge} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("giveBadge")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">{t("giveBadgeDesc")}</p>
<div className="space-y-2">
<input name="userId" type="number" min={1} placeholder={t("userId")} required className="w-full" />
<input name="badge" type="text" placeholder={t("badgeCode")} required maxLength={32} className="w-full" />
<button type="submit" className="btn btn-primary w-full">{t("giveBadge")}</button>
</div>
</form>
<form action={setMotto} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("setMotto")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">{t("setMottoDesc")}</p>
<div className="space-y-2">
<input name="userId" type="number" min={1} placeholder={t("userId")} required className="w-full" />
<input name="motto" type="text" placeholder={t("newMotto")} required maxLength={127} className="w-full" />
<button type="submit" className="btn btn-primary w-full">{t("setMotto")}</button>
</div>
</form>
<form action={setRank} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("setRank")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">{t("setRankDesc")}</p>
<div className="space-y-2">
<input name="userId" type="number" min={1} placeholder={t("userId")} required className="w-full" />
<input name="rank" type="number" min={0} max={10} placeholder={t("rankPlaceholder")} required className="w-full" />
<button type="submit" className="btn btn-primary w-full">{t("setRank")}</button>
</div>
</form>
</div>
<div className="grid grid-cols-1 sm:grid-cols-3 gap-4 mt-4">
<form action={executeCommand} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("executeCommand")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">{t("executeCommandDesc")}</p>
<div className="space-y-2">
<input name="userId" type="number" min={1} placeholder={t("userId")} required className="w-full" />
<input name="command" type="text" placeholder={t("commandPlaceholder")} required maxLength={100} className="w-full" />
<button type="submit" className="btn btn-primary w-full">{t("execute")}</button>
</div>
</form>
<form action={sendGift} className="admin-card">
<h3 className="text-sm font-bold text-[var(--color-text)] mb-2">{t("sendGift")}</h3>
<p className="text-xs text-[var(--color-text-muted)] mb-3">{t("sendGiftDesc")}</p>
<div className="space-y-2">
<input name="userId" type="number" min={1} placeholder={t("userId")} required className="w-full" />
<input name="itemId" type="number" min={1} placeholder={t("furniId")} required className="w-full" />
<input name="message" type="text" placeholder={t("giftMessage")} maxLength={255} defaultValue={t("defaultGiftMessage")} className="w-full" />
<button type="submit" className="btn btn-primary w-full">{t("sendGift")}</button>
</div>
</form>
</div>
</section>
{/* ── Staff activity ─────────────────────────────────────── */}
<section className="mt-6">
<h2 className="admin-section-title">{t("recentStaffActivity")}</h2>
{activity.length === 0 ? (
<div className="admin-empty">{t("noStaffActivity")}</div>
) : (
<div className="admin-card overflow-x-auto">
<table>
<thead>
<tr>
<th>{t("colWhen")}</th>
<th>{t("colStaff")}</th>
<th>{t("colAction")}</th>
<th>{t("colDescription")}</th>
</tr>
</thead>
<tbody>
{activity.map((a) => (
<tr key={String(a.id)}>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{fromDate(a.createdAt)}
</td>
<td>{nameById.get(Number(a.userId)) ?? `#${a.userId}`}</td>
<td>
<span className="inline-block text-[0.6rem] font-bold px-2 py-0.5 rounded-full bg-[var(--color-primary)]/18 text-[var(--color-text)]">{a.action}</span>
</td>
<td className="text-sm text-gray-500 dark:text-gray-400">{a.description}</td>
</tr>
))}
</tbody>
</table>
</div>
)}
</section>
{/* ── Emulator errors ────────────────────────────────────── */}
<section className="mt-6">
<h2 className="admin-section-title">{t("recentEmulatorErrors")}</h2>
{errors.length === 0 ? (
<div className="admin-empty">{t("noEmulatorErrors")}</div>
) : (
<div className="admin-card overflow-x-auto">
<table>
<thead>
<tr>
<th>{t("colWhen")}</th>
<th>{t("colType")}</th>
<th>{t("colVersion")}</th>
<th>{t("colStacktrace")}</th>
</tr>
</thead>
<tbody>
{errors.map((e) => {
const trace = decodeStacktrace(e.stacktrace);
const snippet = trace
? trace.split("\n").slice(0, 20).join("\n") +
(trace.split("\n").length > 20 ? "\n… " + t("truncated") : "")
: t("empty");
return (
<tr key={e.id}>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{formatTimestamp(e.timestamp)}
</td>
<td>{e.type}</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{e.version}
</td>
<td>
<pre className="text-xs p-2 bg-gray-50 dark:bg-black/20 rounded overflow-auto max-h-[160px]">
{snippet}
</pre>
</td>
</tr>
);
})}
</tbody>
</table>
</div>
)}
</section>
</main>
);
}