Migrate tickets and CFH lists to DataTable; confirm destructive mod actions.
Local Build and Deploy / deploy (push) Successful in 1m9s

Co-authored-by: Cursor <[email protected]>
This commit is contained in:
SimoandCursor committed 2026-07-17 20:37:50 +02:00
1 parent cbdea70f83
commit 06610e9ae3
7 files changed
+622 -414

No files matched your search

+133 -162
View File
@@ -1,186 +1,157 @@
import { AlertTriangle, CheckCircle2, Clock, Radio } from "lucide-react";
import Link from "next/link";
import { redirect } from "next/navigation";
import { Badge } from "@/components/ui/badge";
import { getTranslations } from "next-intl/server";
import type { Prisma } from "@/generated/prisma/client";
import { calcPagination, parseListParams } from "@/lib/admin-helpers";
import { canAccess, getAdminContext, PERMS } from "@/lib/permissions";
import { prisma } from "@/lib/prisma";
import { CfhTable, type CfhRow } from "./cfh-table";
const CFH_STATES: Record<
number,
{ label: string; class: string; icon: typeof AlertTriangle }
> = {
0: {
label: "Open",
class: "bg-[var(--admin-error-subtle)] text-[var(--admin-error)]",
icon: AlertTriangle,
},
1: {
label: "Picked",
class: "bg-[var(--admin-warning-subtle)] text-[var(--admin-warning)]",
icon: Clock,
},
2: {
label: "Closed",
class: "bg-muted text-muted-foreground",
icon: CheckCircle2,
},
};
export const dynamic = "force-dynamic";
interface PageProps {
searchParams: Promise<{ state?: string; page?: string }>;
}
export default async function CfhListPage({ searchParams }: PageProps) {
export default async function CfhListPage({
searchParams,
}: {
searchParams: Promise<Record<string, string>>;
}) {
const { session, permissions } = await getAdminContext();
if (!canAccess(permissions, PERMS.MODERATION_VIEW, session.user.rank))
if (!canAccess(permissions, PERMS.MODERATION_VIEW, session.user.rank)) {
redirect("/admin");
}
const sp = await searchParams;
const stateFilter = sp.state !== undefined ? Number(sp.state) : -1;
const page = Math.max(1, Number(sp.page) || 1);
const perPage = 25;
const t = await getTranslations("pages.admin.cfh");
const raw = await searchParams;
const parsed = parseListParams(new URLSearchParams(raw));
const stateRaw = raw.filter_state ?? raw.state;
const stateFilter =
stateRaw !== undefined && stateRaw !== "" ? Number(stateRaw) : -1;
const where = stateFilter >= 0 ? { state: stateFilter } : {};
const conditions: Prisma.SupportTicketsWhereInput[] = [];
if (stateFilter >= 0) {
conditions.push({ state: stateFilter });
}
const [tickets, total] = await Promise.all([
prisma.supportTickets.findMany({
if (parsed.search.trim()) {
const q = parsed.search.trim();
const asId = Number(q);
let userIds: number[] = [];
try {
const users = await prisma.user.findMany({
where: { username: { contains: q } },
select: { id: true },
take: 50,
});
userIds = users.map((u) => u.id);
} catch {
userIds = [];
}
conditions.push({
OR: [
{ issue: { contains: q } },
...(Number.isFinite(asId) && asId > 0 ? [{ id: asId }] : []),
...(userIds.length
? [
{ senderId: { in: userIds } },
{ reportedId: { in: userIds } },
{ modId: { in: userIds } },
]
: []),
],
});
}
const where: Prisma.SupportTicketsWhereInput =
conditions.length === 0
? {}
: conditions.length === 1
? conditions[0]!
: { AND: conditions };
const SORT_MAP: Record<string, Prisma.SupportTicketsOrderByWithRelationInput> =
{
id: { id: "desc" },
issue: { issue: "asc" },
sender: { senderId: "asc" },
reported: { reportedId: "asc" },
mod: { modId: "asc" },
state: { state: "asc" },
};
const baseOrder = SORT_MAP[parsed.sort ?? "id"] ?? { id: "desc" };
const orderField = Object.keys(baseOrder)[0] as keyof typeof baseOrder;
const orderBy = {
[orderField]: parsed.order,
} as Prisma.SupportTicketsOrderByWithRelationInput;
const total = await prisma.supportTickets.count({ where }).catch(() => 0);
const pagination = calcPagination(total, parsed.page, parsed.perPage);
const tickets = await prisma.supportTickets
.findMany({
where,
orderBy: { id: "desc" },
skip: (page - 1) * perPage,
take: perPage,
}),
prisma.supportTickets.count({ where }),
]);
orderBy,
skip: pagination.offset,
take: pagination.perPage,
})
.catch(() => []);
// Fetch all related users
const userIds = [
...new Set([
...tickets.map((t) => t.senderId),
...tickets.map((t) => t.reportedId),
...tickets.map((t) => t.modId),
...tickets.map((x) => x.senderId),
...tickets.map((x) => x.reportedId),
...tickets.map((x) => x.modId),
]),
].filter(Boolean);
const users =
userIds.length > 0
? await prisma.user.findMany({
where: { id: { in: userIds } },
select: { id: true, username: true },
})
: [];
const userMap = new Map(users.map((u) => [u.id, u.username]));
let userMap = new Map<number, string>();
if (userIds.length > 0) {
try {
const users = await prisma.user.findMany({
where: { id: { in: userIds } },
select: { id: true, username: true },
});
userMap = new Map(users.map((u) => [u.id, u.username]));
} catch {
userMap = new Map();
}
}
const totalPages = Math.ceil(total / perPage);
const stateLabels: Record<number, string> = {
0: t("stateOpen"),
1: t("statePicked"),
2: t("stateClosed"),
};
const rows: CfhRow[] = tickets.map((ticket) => ({
id: ticket.id,
issue: ticket.issue,
roomId: ticket.roomId,
when: ticket.timestamp
? new Date(ticket.timestamp * 1000).toISOString().slice(0, 16).replace("T", " ")
: "—",
sender: userMap.get(ticket.senderId) ?? "—",
senderId: ticket.senderId,
reported: userMap.get(ticket.reportedId) ?? "—",
reportedId: ticket.reportedId,
mod: userMap.get(ticket.modId) ?? "—",
state: ticket.state,
stateLabel: stateLabels[ticket.state] ?? String(ticket.state),
}));
return (
<div className="space-y-6">
{/* Filters */}
<div className="flex gap-2">
{[
{ key: -1, label: "All" },
{ key: 0, label: "Open" },
{ key: 1, label: "Picked" },
{ key: 2, label: "Closed" },
].map(({ key, label }) => (
<Link
key={key}
href={`/admin/moderation/cfh${key >= 0 ? `?state=${key}` : ""}`}
>
<Badge
variant={stateFilter === key ? "default" : "outline"}
className="cursor-pointer"
>
{label}
</Badge>
</Link>
))}
</div>
{/* Table */}
<div className="rounded-lg border">
<div className="grid grid-cols-[auto_1fr_auto_auto_auto_auto] gap-4 p-3 bg-muted/50 text-xs font-medium text-muted-foreground border-b">
<span>#</span>
<span>Issue</span>
<span>Sender</span>
<span>Reported</span>
<span>Mod</span>
<span>Status</span>
</div>
{tickets.length === 0 ? (
<div className="p-8 text-center text-muted-foreground">
<Radio className="h-8 w-8 mx-auto mb-2" />
No tickets found.
</div>
) : (
tickets.map((ticket) => {
const state = CFH_STATES[ticket.state] ?? CFH_STATES[0];
const StateIcon = state.icon;
return (
<Link
key={ticket.id}
href={`/admin/moderation/cfh/${ticket.id}`}
className="grid grid-cols-[auto_1fr_auto_auto_auto_auto] gap-4 p-3 items-center hover:bg-accent/50 transition-all duration-150 border-b last:border-0 hover:pl-4"
>
<span className="text-xs font-mono text-muted-foreground">
{ticket.id}
</span>
<div className="min-w-0">
<p className="text-sm truncate">
{ticket.issue || "No description"}
</p>
<p className="text-[10px] text-muted-foreground">
Room #{ticket.roomId} ·{" "}
{new Date(ticket.timestamp * 1000).toLocaleString()}
</p>
</div>
<span className="text-xs whitespace-nowrap">
{userMap.get(ticket.senderId) ?? "—"}
</span>
<span className="text-xs whitespace-nowrap font-medium">
{userMap.get(ticket.reportedId) ?? "—"}
</span>
<span className="text-xs text-muted-foreground whitespace-nowrap">
{userMap.get(ticket.modId) ?? "—"}
</span>
<span
className={`inline-flex items-center gap-1 text-xs font-medium px-2 py-0.5 rounded-full whitespace-nowrap ${state.class}`}
>
<StateIcon className="h-3 w-3" />
{state.label}
</span>
</Link>
);
})
)}
</div>
{/* Pagination */}
{totalPages > 1 && (
<div className="flex items-center justify-center gap-2">
{page > 1 && (
<Link
href={`/admin/moderation/cfh?state=${stateFilter}&page=${page - 1}`}
>
<Badge variant="outline" className="cursor-pointer">
Previous
</Badge>
</Link>
)}
<span className="text-sm text-muted-foreground">
Page {page} of {totalPages}
</span>
{page < totalPages && (
<Link
href={`/admin/moderation/cfh?state=${stateFilter}&page=${page + 1}`}
>
<Badge variant="outline" className="cursor-pointer">
Next
</Badge>
</Link>
)}
</div>
{total === 0 && !parsed.search && stateFilter < 0 ? (
<div className="admin-empty">{t("noTickets")}</div>
) : (
<CfhTable
data={{
rows,
total,
page: pagination.page,
perPage: pagination.perPage,
lastPage: pagination.lastPage,
}}
/>
)}
</div>
);