Add admin foundation + Users resource (Filament replacement, slice 1)
Plain App Router admin (aligned to habbo-next, no Refine): - rank surfaced on the NextAuth session; staff guard isStaff() [pure, unit-tested] + requireStaff() reading min_staff_rank, gating /admin. - /admin dashboard (counts), /admin/users (paginated + search), /admin/users/[id] detail. - src/actions/admin-users.ts: staff-gated server actions wiring the user editor to the existing services — giveCurrency (RCON or DB fallback), setMotto/setRank (DB + RCON), alertUser, disconnectUser. Verified: tsc exit 0, vitest 45/45, next build exit 0 (/admin routes).
This commit is contained in:
Simo committed
1 parent
d9a8ce532f
commit
9f81096f05
10 files changed
+334
-3
No files matched your search
@@ -0,0 +1,24 @@
|
||||
import Link from "next/link";
|
||||
import type { ReactNode } from "react";
|
||||
import { requireStaff } from "@/lib/admin/guard";
|
||||
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
export default async function AdminLayout({ children }: { children: ReactNode }) {
|
||||
const staff = await requireStaff();
|
||||
|
||||
return (
|
||||
<div style={{ display: "grid", gridTemplateColumns: "190px 1fr", gap: "1.5rem" }}>
|
||||
<aside className="card" style={{ height: "fit-content" }}>
|
||||
<p className="muted" style={{ marginTop: 0 }}>
|
||||
Staff · {staff.username} (rank {staff.rank})
|
||||
</p>
|
||||
<nav style={{ display: "grid", gap: "0.45rem" }}>
|
||||
<Link href="/admin">Dashboard</Link>
|
||||
<Link href="/admin/users">Users</Link>
|
||||
</nav>
|
||||
</aside>
|
||||
<section>{children}</section>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
import { prisma } from "@/lib/prisma";
|
||||
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
export default async function AdminDashboard() {
|
||||
const [users, online, articles] = await Promise.all([
|
||||
prisma.user.count(),
|
||||
prisma.user.count({ where: { online: "1" } }),
|
||||
prisma.websiteArticles.count(),
|
||||
]);
|
||||
|
||||
const stats = [
|
||||
{ label: "Users", value: users },
|
||||
{ label: "Online now", value: online },
|
||||
{ label: "Articles", value: articles },
|
||||
];
|
||||
|
||||
return (
|
||||
<main>
|
||||
<h1>Dashboard</h1>
|
||||
<div className="grid cols-2">
|
||||
{stats.map((s) => (
|
||||
<div key={s.label} className="card">
|
||||
<h2 style={{ margin: 0 }}>{s.value}</h2>
|
||||
<p className="muted" style={{ margin: 0 }}>
|
||||
{s.label}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,82 @@
|
||||
import Link from "next/link";
|
||||
import { notFound } from "next/navigation";
|
||||
import {
|
||||
alertUser,
|
||||
disconnectUser,
|
||||
giveCurrency,
|
||||
setMotto,
|
||||
setRank,
|
||||
} from "@/actions/admin-users";
|
||||
import { prisma } from "@/lib/prisma";
|
||||
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
export default async function AdminUserDetail({
|
||||
params,
|
||||
}: {
|
||||
params: Promise<{ id: string }>;
|
||||
}) {
|
||||
const { id } = await params;
|
||||
const userId = Number(id);
|
||||
const user = await prisma.user.findUnique({
|
||||
where: { id: userId },
|
||||
select: { id: true, username: true, motto: true, rank: true, credits: true, look: true, online: true },
|
||||
});
|
||||
if (!user) notFound();
|
||||
|
||||
return (
|
||||
<main>
|
||||
<p className="muted">
|
||||
<Link href="/admin/users">← Users</Link>
|
||||
</p>
|
||||
<h1>{user.username}</h1>
|
||||
<p className="muted">
|
||||
ID {user.id} · rank {user.rank} · {user.credits} credits ·{" "}
|
||||
{user.online === "1" ? "Online" : "Offline"}
|
||||
</p>
|
||||
|
||||
<div className="grid cols-2">
|
||||
<form action={giveCurrency} className="card">
|
||||
<input type="hidden" name="userId" value={user.id} />
|
||||
<h3 style={{ marginTop: 0 }}>Give currency</h3>
|
||||
<select name="type">
|
||||
<option value="credits">Credits</option>
|
||||
<option value="duckets">Duckets</option>
|
||||
<option value="diamonds">Diamonds</option>
|
||||
<option value="points">Points</option>
|
||||
</select>{" "}
|
||||
<input name="amount" type="number" min={1} placeholder="Amount" />{" "}
|
||||
<button type="submit">Give</button>
|
||||
</form>
|
||||
|
||||
<form action={setMotto} className="card">
|
||||
<input type="hidden" name="userId" value={user.id} />
|
||||
<h3 style={{ marginTop: 0 }}>Set motto</h3>
|
||||
<input name="motto" defaultValue={user.motto} maxLength={127} />{" "}
|
||||
<button type="submit">Save</button>
|
||||
</form>
|
||||
|
||||
<form action={setRank} className="card">
|
||||
<input type="hidden" name="userId" value={user.id} />
|
||||
<h3 style={{ marginTop: 0 }}>Set rank</h3>
|
||||
<input name="rank" type="number" min={1} defaultValue={user.rank} />{" "}
|
||||
<button type="submit">Set</button>
|
||||
</form>
|
||||
|
||||
<form action={alertUser} className="card">
|
||||
<input type="hidden" name="userId" value={user.id} />
|
||||
<h3 style={{ marginTop: 0 }}>Alert</h3>
|
||||
<input name="message" placeholder="Message" />{" "}
|
||||
<button type="submit">Send</button>
|
||||
</form>
|
||||
|
||||
<form action={disconnectUser} className="card">
|
||||
<input type="hidden" name="userId" value={user.id} />
|
||||
<input type="hidden" name="username" value={user.username} />
|
||||
<h3 style={{ marginTop: 0 }}>Disconnect</h3>
|
||||
<button type="submit">Disconnect from hotel</button>
|
||||
</form>
|
||||
</div>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,74 @@
|
||||
import Link from "next/link";
|
||||
import { prisma } from "@/lib/prisma";
|
||||
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
const PER_PAGE = 25;
|
||||
|
||||
export default async function AdminUsers({
|
||||
searchParams,
|
||||
}: {
|
||||
searchParams: Promise<{ q?: string; page?: string }>;
|
||||
}) {
|
||||
const sp = await searchParams;
|
||||
const q = (sp.q ?? "").trim();
|
||||
const page = Math.max(1, Number(sp.page ?? "1") || 1);
|
||||
const where = q ? { username: { contains: q } } : {};
|
||||
|
||||
const [users, total] = await Promise.all([
|
||||
prisma.user.findMany({
|
||||
where,
|
||||
select: { id: true, username: true, rank: true, credits: true, online: true },
|
||||
orderBy: { id: "desc" },
|
||||
skip: (page - 1) * PER_PAGE,
|
||||
take: PER_PAGE,
|
||||
}),
|
||||
prisma.user.count({ where }),
|
||||
]);
|
||||
const pages = Math.max(1, Math.ceil(total / PER_PAGE));
|
||||
|
||||
return (
|
||||
<main>
|
||||
<h1>Users</h1>
|
||||
<form style={{ display: "flex", gap: "0.5rem", marginBottom: "1rem" }}>
|
||||
<input name="q" defaultValue={q} placeholder="Search username" />
|
||||
<button type="submit">Search</button>
|
||||
</form>
|
||||
|
||||
<table style={{ width: "100%", borderCollapse: "collapse" }}>
|
||||
<thead>
|
||||
<tr style={{ textAlign: "left", color: "var(--muted)" }}>
|
||||
<th>ID</th>
|
||||
<th>Username</th>
|
||||
<th>Rank</th>
|
||||
<th>Credits</th>
|
||||
<th>Online</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{users.map((u) => (
|
||||
<tr key={u.id} style={{ borderTop: "1px solid var(--border)" }}>
|
||||
<td>{u.id}</td>
|
||||
<td>
|
||||
<Link href={`/admin/users/${u.id}`}>{u.username}</Link>
|
||||
</td>
|
||||
<td>{u.rank}</td>
|
||||
<td>{u.credits}</td>
|
||||
<td>{u.online === "1" ? "●" : "○"}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<p className="muted">
|
||||
Page {page} / {pages} · {total} users
|
||||
{page < pages ? (
|
||||
<>
|
||||
{" · "}
|
||||
<Link href={`/admin/users?q=${encodeURIComponent(q)}&page=${page + 1}`}>Next →</Link>
|
||||
</>
|
||||
) : null}
|
||||
</p>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
Reference in new issue
Block a user