79 lines
2.1 KiB
TypeScript
79 lines
2.1 KiB
TypeScript
import { desc, eq } from "drizzle-orm";
|
|
import Link from "next/link";
|
|
import { getTranslations } from "next-intl/server";
|
|
import { ContentCard, EmptyState } from "@/components/public/ui";
|
|
import { db, RadioContests } from "@/lib/db";
|
|
import { formatDate } from "@/lib/format-date";
|
|
|
|
export const revalidate = 300;
|
|
|
|
export default async function RadioContestsPage() {
|
|
const t = await getTranslations("pages.radioContests");
|
|
|
|
const contests = await db
|
|
.select({
|
|
id: RadioContests.id,
|
|
title: RadioContests.title,
|
|
prize: RadioContests.prize,
|
|
startDate: RadioContests.startDate,
|
|
endDate: RadioContests.endDate,
|
|
})
|
|
.from(RadioContests)
|
|
.where(eq(RadioContests.isActive, true))
|
|
.orderBy(desc(RadioContests.startDate))
|
|
.limit(50)
|
|
.catch(() => []);
|
|
|
|
return (
|
|
<main style={{ display: "grid", gap: "1.5rem" }}>
|
|
<ContentCard icon="🎉" title={t("title")} subtitle={t("subtitle")} />
|
|
|
|
<ContentCard padded={contests.length === 0}>
|
|
{contests.length === 0 ? (
|
|
<EmptyState icon="🎉">{t("empty")}</EmptyState>
|
|
) : (
|
|
<div className="card-grid sm-2 lg-3" style={{ padding: "1rem" }}>
|
|
{contests.map((c) => {
|
|
const id = c.id.toString();
|
|
return (
|
|
<Link
|
|
key={id}
|
|
href={`/radio/contests/${id}`}
|
|
className="card hover"
|
|
style={{
|
|
color: "inherit",
|
|
textDecoration: "none",
|
|
display: "grid",
|
|
gap: "0.3rem",
|
|
}}
|
|
>
|
|
<h3 style={{ margin: 0, fontSize: "1rem" }}>
|
|
<span aria-hidden>🎉</span>{" "}
|
|
{c.title || t("contestLabel", { id })}
|
|
</h3>
|
|
{c.prize ? (
|
|
<p
|
|
className="muted"
|
|
style={{ margin: 0, fontSize: "0.9rem" }}
|
|
>
|
|
Prize: {c.prize}
|
|
</p>
|
|
) : null}
|
|
<p
|
|
className="muted"
|
|
style={{ margin: 0, fontSize: "0.85rem" }}
|
|
>
|
|
{c.startDate
|
|
? `${formatDate(c.startDate, "date", "")} — ${c.endDate ? formatDate(c.endDate, "date", "") : "ongoing"}`
|
|
: t("dateUnknown")}
|
|
</p>
|
|
</Link>
|
|
);
|
|
})}
|
|
</div>
|
|
)}
|
|
</ContentCard>
|
|
</main>
|
|
);
|
|
}
|