i18n events and polls admin DataTable columns.

Wire column headers, search placeholders, and status/type labels through pages.admin.events/polls (en/nl/it), matching tickets-table.

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

src/app/admin/events/events-table.tsx

@@ -2,6 +2,7 @@
 
 import { Pencil } from "lucide-react";
 import Link from "next/link";
+import { useTranslations } from "next-intl";
 import { DataTable } from "@/components/admin/data-table";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -28,18 +29,31 @@ const statusVariants: Record<
 	completed: "outline",
 };
 
-function getColumns(): DataTableColumn<EventRow>[] {
-	return [
-		{ key: "id", label: "ID", sortable: true },
+interface EventsTableProps {
+	data: PaginatedResult<EventRow>;
+}
+
+export function EventsTable({ data }: EventsTableProps) {
+	const t = useTranslations("pages.admin.events");
+
+	const statusLabel: Record<string, string> = {
+		published: t("statusPublished"),
+		draft: t("statusDraft"),
+		cancelled: t("statusCancelled"),
+		completed: t("statusCompleted"),
+	};
+
+	const columns: DataTableColumn<EventRow>[] = [
+		{ key: "id", label: t("colId"), sortable: true },
 		{
 			key: "title",
-			label: "Title",
+			label: t("colTitle"),
 			sortable: true,
 			render: (value) => <span className="font-medium">{String(value)}</span>,
 		},
 		{
 			key: "typeName",
-			label: "Type",
+			label: t("colType"),
 			sortable: false,
 			render: (_, row) => (
 				<Badge style={{ backgroundColor: row.typeColor, color: "#fff" }}>
@@ -49,7 +63,7 @@ function getColumns(): DataTableColumn<EventRow>[] {
 		},
 		{
 			key: "startsAt",
-			label: "Starts",
+			label: t("colStarts"),
 			sortable: true,
 			render: (value) => (
 				<span className="text-sm">
@@ -59,17 +73,20 @@ function getColumns(): DataTableColumn<EventRow>[] {
 		},
 		{
 			key: "status",
-			label: "Status",
+			label: t("colStatus"),
 			sortable: true,
-			render: (value) => (
-				<Badge variant={statusVariants[String(value)] ?? "secondary"}>
-					{String(value)}
-				</Badge>
-			),
+			render: (value) => {
+				const key = String(value);
+				return (
+					<Badge variant={statusVariants[key] ?? "secondary"}>
+						{statusLabel[key] ?? key}
+					</Badge>
+				);
+			},
 		},
 		{
 			key: "actions",
-			label: "Actions",
+			label: t("colActions"),
 			render: (_, row) => (
 				<Button variant="ghost" size="icon" asChild>
 					<Link href={`/admin/events/${row.id}`}>
@@ -79,18 +96,12 @@ function getColumns(): DataTableColumn<EventRow>[] {
 			),
 		},
 	];
-}
 
-interface EventsTableProps {
-	data: PaginatedResult<EventRow>;
-}
-
-export function EventsTable({ data }: EventsTableProps) {
 	return (
 		<DataTable
 			data={data}
-			columns={getColumns()}
-			searchPlaceholder="Search events..."
+			columns={columns}
+			searchPlaceholder={t("searchPlaceholder")}
 		/>
 	);
 }

src/app/admin/polls/polls-table.tsx

@@ -2,6 +2,7 @@
 
 import { Pencil } from "lucide-react";
 import Link from "next/link";
+import { useTranslations } from "next-intl";
 import { DataTable } from "@/components/admin/data-table";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
@@ -24,37 +25,52 @@ const statusVariants: Record<string, "default" | "secondary" | "outline"> = {
 	closed: "outline",
 };
 
-function getColumns(): DataTableColumn<PollRow>[] {
-	return [
-		{ key: "id", label: "ID", sortable: true },
+interface PollsTableProps {
+	data: PaginatedResult<PollRow>;
+}
+
+export function PollsTable({ data }: PollsTableProps) {
+	const t = useTranslations("pages.admin.polls");
+
+	const statusLabel: Record<string, string> = {
+		active: t("statusActive"),
+		draft: t("statusDraft"),
+		closed: t("statusClosed"),
+	};
+
+	const columns: DataTableColumn<PollRow>[] = [
+		{ key: "id", label: t("colId"), sortable: true },
 		{
 			key: "title",
-			label: "Title",
+			label: t("colTitle"),
 			sortable: true,
 			render: (value) => <span className="font-medium">{String(value)}</span>,
 		},
 		{
 			key: "status",
-			label: "Status",
+			label: t("colStatus"),
 			sortable: true,
-			render: (value) => (
-				<Badge variant={statusVariants[String(value)] ?? "secondary"}>
-					{String(value)}
-				</Badge>
-			),
+			render: (value) => {
+				const key = String(value);
+				return (
+					<Badge variant={statusVariants[key] ?? "secondary"}>
+						{statusLabel[key] ?? key}
+					</Badge>
+				);
+			},
 		},
 		{
 			key: "multipleChoice",
-			label: "Type",
+			label: t("colType"),
 			render: (value) => (
 				<span className="text-sm">
-					{Number(value) ? "Multiple choice" : "Single choice"}
+					{Number(value) ? t("typeMultiple") : t("typeSingle")}
 				</span>
 			),
 		},
 		{
 			key: "createdAt",
-			label: "Created",
+			label: t("colCreated"),
 			sortable: true,
 			render: (value) => (
 				<span className="text-sm">
@@ -64,7 +80,7 @@ function getColumns(): DataTableColumn<PollRow>[] {
 		},
 		{
 			key: "actions",
-			label: "Actions",
+			label: t("colActions"),
 			render: (_, row) => (
 				<Button variant="ghost" size="icon" asChild>
 					<Link href={`/admin/polls/${row.id}`}>
@@ -74,18 +90,12 @@ function getColumns(): DataTableColumn<PollRow>[] {
 			),
 		},
 	];
-}
 
-interface PollsTableProps {
-	data: PaginatedResult<PollRow>;
-}
-
-export function PollsTable({ data }: PollsTableProps) {
 	return (
 		<DataTable
 			data={data}
-			columns={getColumns()}
-			searchPlaceholder="Search polls..."
+			columns={columns}
+			searchPlaceholder={t("searchPlaceholder")}
 		/>
 	);
 }