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]>
This commit is contained in:
simoleo89
2026-07-18 21:46:52 +02:00
co-authored by Cursor
parent dd9c5e70c2
commit a25008deb5
12 changed files with 325 additions and 91 deletions
+27 -7
View File
@@ -1,3 +1,4 @@
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";
@@ -22,6 +23,9 @@ export default async function PollDetailPage({
const pollId = parseInt(id, 10);
if (Number.isNaN(pollId)) notFound();
const t = await getTranslations("pages.admin.polls");
const tHubs = await getTranslations("pages.admin.hubs");
const poll = await prisma.websitePoll.findUnique({
where: { id: pollId },
include: {
@@ -40,17 +44,25 @@ export default async function PollDetailPage({
poll.questions.flatMap((q) => q.votes.map((v) => v.userId)),
).size;
const statusLabel: Record<string, string> = {
active: t("statusActive"),
draft: t("statusDraft"),
closed: t("statusClosed"),
};
return (
<div className="space-y-6">
<div>
<AdminBreadcrumb
items={[
{ label: "Polls", href: "/admin/polls" },
{ label: tHubs("tabs.polls"), href: "/admin/polls" },
{ label: poll.title },
]}
/>
<div className="flex items-center gap-3">
<h1 className="text-3xl font-bold tracking-tight">{poll.title}</h1>
<h1 className="m-0 text-2xl font-extrabold text-[var(--admin-text)]">
{poll.title}
</h1>
<Badge
variant={
poll.status === "active"
@@ -60,11 +72,13 @@ export default async function PollDetailPage({
: "secondary"
}
>
{poll.status}
{statusLabel[poll.status] ?? poll.status}
</Badge>
</div>
{poll.description && (
<p className="text-muted-foreground">{poll.description}</p>
<p className="m-0 mt-1 text-sm text-[var(--admin-text-muted)]">
{poll.description}
</p>
)}
</div>
@@ -72,7 +86,9 @@ export default async function PollDetailPage({
<div className="grid gap-4 md:grid-cols-3">
<Card>
<CardHeader className="pb-2">
<CardTitle className="text-sm font-medium">Total Voters</CardTitle>
<CardTitle className="text-sm font-medium">
{t("statVoters")}
</CardTitle>
</CardHeader>
<CardContent>
<div className="text-2xl font-bold">{totalVoters}</div>
@@ -80,7 +96,9 @@ export default async function PollDetailPage({
</Card>
<Card>
<CardHeader className="pb-2">
<CardTitle className="text-sm font-medium">Questions</CardTitle>
<CardTitle className="text-sm font-medium">
{t("statQuestions")}
</CardTitle>
</CardHeader>
<CardContent>
<div className="text-2xl font-bold">{poll.questions.length}</div>
@@ -88,7 +106,9 @@ export default async function PollDetailPage({
</Card>
<Card>
<CardHeader className="pb-2">
<CardTitle className="text-sm font-medium">Total Votes</CardTitle>
<CardTitle className="text-sm font-medium">
{t("statVotes")}
</CardTitle>
</CardHeader>
<CardContent>
<div className="text-2xl font-bold">
+7 -5
View File
@@ -1,6 +1,7 @@
"use client";
import { GripVertical, Pencil, Plus, Trash2 } from "lucide-react";
import { useTranslations } from "next-intl";
import { useState } from "react";
import {
addPollQuestion,
@@ -37,6 +38,7 @@ interface Props {
type PollQuestionUpdateInput = PollQuestionInput & { id: number };
export function PollQuestionsManager({ pollId, questions }: Props) {
const t = useTranslations("pages.admin.polls");
const { run, isPending } = useServerAction();
const [showForm, setShowForm] = useState(false);
const [editingId, setEditingId] = useState<number | null>(null);
@@ -96,7 +98,9 @@ export function PollQuestionsManager({ pollId, questions }: Props) {
return (
<Card>
<CardHeader className="flex flex-row items-center justify-between">
<CardTitle>Questions ({questions.length})</CardTitle>
<CardTitle>
{t("questionsTitle", { count: questions.length })}
</CardTitle>
<Button
size="sm"
onClick={() => {
@@ -104,7 +108,7 @@ export function PollQuestionsManager({ pollId, questions }: Props) {
setShowForm(!showForm);
}}
>
<Plus className="h-4 w-4 mr-1" /> Add Question
<Plus className="h-4 w-4 mr-1" /> {t("addQuestion")}
</Button>
</CardHeader>
<CardContent className="space-y-4">
@@ -177,9 +181,7 @@ export function PollQuestionsManager({ pollId, questions }: Props) {
)}
{questions.length === 0 && !showForm && (
<p className="text-sm text-muted-foreground text-center py-4">
No questions yet. Add your first question above.
</p>
<div className="admin-empty">{t("noQuestions")}</div>
)}
<div className="space-y-2">
+4 -1
View File
@@ -1,5 +1,6 @@
"use client";
import { useTranslations } from "next-intl";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
interface QuestionResult {
@@ -14,10 +15,12 @@ interface Props {
}
export function PollResultsView({ questions }: Props) {
const t = useTranslations("pages.admin.polls");
return (
<Card>
<CardHeader>
<CardTitle>Results</CardTitle>
<CardTitle>{t("resultsTitle")}</CardTitle>
</CardHeader>
<CardContent className="space-y-6">
{questions.map((q) => {