i18n events/polls detail pages, forms, and empty sections.

Align detail headers with admin chrome, translate stats/forms/breadcrumbs, and use admin-empty for prizes, winners, registrations, and questions.

Co-authored-by: Cursor <[email protected]>

src/app/admin/events/[id]/page.tsx

@@ -1,4 +1,5 @@
 import { CalendarDays, Gift, Trophy, Users } from "lucide-react";
+import { getTranslations } from "next-intl/server";
 import { notFound, redirect } from "next/navigation";
 import { AdminBreadcrumb } from "@/components/admin/admin-breadcrumb";
 import { Badge } from "@/components/ui/badge";
@@ -24,6 +25,9 @@ export default async function EventDetailPage({
 	const eventId = parseInt(id, 10);
 	if (Number.isNaN(eventId)) notFound();
 
+	const t = await getTranslations("pages.admin.events");
+	const tHubs = await getTranslations("pages.admin.hubs");
+
 	const event = await prisma.websiteEvent.findUnique({
 		where: { id: eventId },
 		include: {
@@ -55,17 +59,26 @@ export default async function EventDetailPage({
 			: [];
 	const userMap = new Map(users.map((u) => [u.id, u.username]));
 
+	const statusLabel: Record<string, string> = {
+		published: t("statusPublished"),
+		draft: t("statusDraft"),
+		cancelled: t("statusCancelled"),
+		completed: t("statusCompleted"),
+	};
+
 	return (
 		<div className="space-y-6">
 			<div>
 				<AdminBreadcrumb
 					items={[
-						{ label: "Events", href: "/admin/events" },
+						{ label: tHubs("tabs.events"), href: "/admin/events" },
 						{ label: event.title },
 					]}
 				/>
 				<div className="flex items-center gap-3">
-					<h1 className="text-3xl font-bold tracking-tight">{event.title}</h1>
+					<h1 className="m-0 text-2xl font-extrabold text-[var(--admin-text)]">
+						{event.title}
+					</h1>
 					<Badge
 						variant={
 							event.status === "published"
@@ -75,10 +88,10 @@ export default async function EventDetailPage({
 									: "secondary"
 						}
 					>
-						{event.status}
+						{statusLabel[event.status] ?? event.status}
 					</Badge>
 				</div>
-				<p className="text-muted-foreground">
+				<p className="m-0 mt-1 text-sm text-[var(--admin-text-muted)]">
 					{event.type.name} &middot; {new Date(event.startsAt).toLocaleString()}
 				</p>
 			</div>
@@ -87,7 +100,9 @@ export default async function EventDetailPage({
 			<div className="grid gap-4 md:grid-cols-4">
 				<Card>
 					<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
-						<CardTitle className="text-sm font-medium">Registrations</CardTitle>
+						<CardTitle className="text-sm font-medium">
+							{t("statRegistrations")}
+						</CardTitle>
 						<Users className="h-4 w-4 text-muted-foreground" />
 					</CardHeader>
 					<CardContent>
@@ -96,14 +111,14 @@ export default async function EventDetailPage({
 						</div>
 						{event.maxPlayers && (
 							<p className="text-xs text-muted-foreground">
-								Max: {event.maxPlayers}
+								{t("maxPlayers", { count: event.maxPlayers })}
 							</p>
 						)}
 					</CardContent>
 				</Card>
 				<Card>
 					<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
-						<CardTitle className="text-sm font-medium">Prizes</CardTitle>
+						<CardTitle className="text-sm font-medium">{t("statPrizes")}</CardTitle>
 						<Gift className="h-4 w-4 text-muted-foreground" />
 					</CardHeader>
 					<CardContent>
@@ -112,7 +127,9 @@ export default async function EventDetailPage({
 				</Card>
 				<Card>
 					<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
-						<CardTitle className="text-sm font-medium">Winners</CardTitle>
+						<CardTitle className="text-sm font-medium">
+							{t("statWinners")}
+						</CardTitle>
 						<Trophy className="h-4 w-4 text-muted-foreground" />
 					</CardHeader>
 					<CardContent>
@@ -121,16 +138,20 @@ export default async function EventDetailPage({
 				</Card>
 				<Card>
 					<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
-						<CardTitle className="text-sm font-medium">Time</CardTitle>
+						<CardTitle className="text-sm font-medium">{t("statTime")}</CardTitle>
 						<CalendarDays className="h-4 w-4 text-muted-foreground" />
 					</CardHeader>
 					<CardContent>
 						<div className="text-sm font-medium">
-							{new Date(event.startsAt) > new Date() ? "Upcoming" : "Past"}
+							{new Date(event.startsAt) > new Date()
+								? t("timeUpcoming")
+								: t("timePast")}
 						</div>
 						{event.endsAt && (
 							<p className="text-xs text-muted-foreground">
-								Ends: {new Date(event.endsAt).toLocaleString()}
+								{t("endsAt", {
+									date: new Date(event.endsAt).toLocaleString(),
+								})}
 							</p>
 						)}
 					</CardContent>
@@ -168,7 +189,7 @@ export default async function EventDetailPage({
 				eventId={event.id}
 				winners={event.winners.map((w) => ({
 					...w,
-					username: userMap.get(w.userId) ?? `User #${w.userId}`,
+					username: userMap.get(w.userId) ?? t("userFallback", { id: w.userId }),
 				}))}
 			/>
 
@@ -176,7 +197,7 @@ export default async function EventDetailPage({
 			<EventRegistrations
 				registrations={event.registrations.map((r) => ({
 					...r,
-					username: userMap.get(r.userId) ?? `User #${r.userId}`,
+					username: userMap.get(r.userId) ?? t("userFallback", { id: r.userId }),
 				}))}
 			/>
 		</div>