739 lines
21 KiB
TypeScript
739 lines
21 KiB
TypeScript
import os from "node:os";
|
|
import { Activity } from "lucide-react";
|
|
import { getTranslations } from "next-intl/server";
|
|
import {
|
|
alertUser,
|
|
disconnectUser,
|
|
executeCommand,
|
|
forwardUser,
|
|
giveBadge,
|
|
giveCredits,
|
|
giveDiamonds,
|
|
giveDuckets,
|
|
hotelAlert,
|
|
sendGift,
|
|
setMotto,
|
|
setRank,
|
|
updateCatalog,
|
|
updateNavigator,
|
|
updateWordFilter,
|
|
} from "@/actions/commandocentrum";
|
|
import {
|
|
DiagnosticRow,
|
|
InfoItem,
|
|
OnlineUsersWidget,
|
|
StatusCard,
|
|
} 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(--admin-accent)]/20 to-[var(--admin-accent)]/5 grid place-items-center">
|
|
<Activity size={20} className="text-[var(--admin-accent)]" />
|
|
</div>
|
|
<div>
|
|
<h1 className="m-0 text-xl font-extrabold text-[var(--admin-text)]">
|
|
{t("title")}
|
|
</h1>
|
|
<p className="m-0 text-xs text-[var(--admin-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 grid-cols-1 gap-4 md: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(--admin-text)] mb-2">
|
|
{t("updateCatalog")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("updateWordFilter")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("updateNavigator")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("hotelAlert")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-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(--admin-text)] mb-2">
|
|
{t("actions.disconnect")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("actions.alert")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("forwardToRoom")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("giveCredits")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("giveDuckets")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("giveDiamonds")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("giveBadge")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("setMotto")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("setRank")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("executeCommand")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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(--admin-text)] mb-2">
|
|
{t("sendGift")}
|
|
</h3>
|
|
<p className="text-xs text-[var(--admin-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 theme-text-muted dark:theme-text-muted 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(--admin-accent)]/18 text-[var(--admin-text)]">
|
|
{a.action}
|
|
</span>
|
|
</td>
|
|
<td className="text-sm theme-text-muted dark:theme-text-muted">
|
|
{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 theme-text-muted dark:theme-text-muted whitespace-nowrap">
|
|
{formatTimestamp(e.timestamp)}
|
|
</td>
|
|
<td>{e.type}</td>
|
|
<td className="text-sm theme-text-muted dark:theme-text-muted whitespace-nowrap">
|
|
{e.version}
|
|
</td>
|
|
<td>
|
|
<pre className="text-xs p-2 bg-[var(--admin-canvas)] text-[var(--color-text-readable)] rounded overflow-auto max-h-[160px]">
|
|
{snippet}
|
|
</pre>
|
|
</td>
|
|
</tr>
|
|
);
|
|
})}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
)}
|
|
</section>
|
|
</main>
|
|
);
|
|
}
|