Epicnabbo-Catalogus-Updated-Daily/src/app/(site)/radio/giveaways/page.tsx

import Link from "next/link";
import { getTranslations } from "next-intl/server";
import { ContentCard, EmptyState } from "@/components/public/ui";
import { prisma } from "@/lib/prisma";

export const revalidate = 300;

function formatDate(d: Date | null | undefined): string {
	return d ? d.toISOString().slice(0, 10) : "";
}

export default async function RadioGiveawaysPage() {
	const t = await getTranslations("pages.radioGiveaways");

	const giveaways = await prisma.radioGiveaways
		.findMany({
			where: { isActive: true },
			orderBy: { startDate: "desc" },
			take: 50,
			select: {
				id: true,
				title: true,
				prize: true,
				prizeAmount: true,
				prizeCurrency: true,
				startDate: true,
				endDate: true,
			},
		})
		.catch(() => []);

	return (
		<main style={{ display: "grid", gap: "1.5rem" }}>
			<ContentCard icon="🎁" title={t("title")} subtitle={t("subtitle")} />

			<ContentCard padded={giveaways.length === 0}>
				{giveaways.length === 0 ? (
					<EmptyState icon="🎁">{t("empty")}</EmptyState>
				) : (
					<div className="card-grid sm-2 lg-3" style={{ padding: "1rem" }}>
						{giveaways.map((g) => {
							const id = g.id.toString();
							const prizeStr =
								g.prize ||
								(g.prizeAmount > 0
									? `${g.prizeAmount} ${g.prizeCurrency || "credits"}`
									: null);
							return (
								<Link
									key={id}
									href={`/radio/giveaways/${id}`}
									className="card hover"
									style={{
										color: "inherit",
										textDecoration: "none",
										display: "grid",
										gap: "0.3rem",
									}}
								>
									<h3 style={{ margin: 0, fontSize: "1rem" }}>
										<span aria-hidden>🎁</span>{" "}
										{g.title || t("giveawayLabel", { id })}
									</h3>
									{prizeStr ? (
										<p
											className="muted"
											style={{ margin: 0, fontSize: "0.9rem" }}
										>
											Prize: {prizeStr}
										</p>
									) : null}
									<p
										className="muted"
										style={{ margin: 0, fontSize: "0.85rem" }}
									>
										{g.startDate
											? `${formatDate(g.startDate)} — ${g.endDate ? formatDate(g.endDate) : "ongoing"}`
											: t("dateUnknown")}
									</p>
								</Link>
							);
						})}
					</div>
				)}
			</ContentCard>
		</main>
	);
}