feat: Add vertical-specific archive page
Some checks failed
Deploy Fediversion / deploy (push) Failing after 1s
Some checks failed
Deploy Fediversion / deploy (push) Failing after 1s
This commit is contained in:
parent
9e927c114e
commit
9f57f4f3c2
1 changed files with 50 additions and 0 deletions
50
frontend/app/[vertical]/archive/page.tsx
Normal file
50
frontend/app/[vertical]/archive/page.tsx
Normal file
|
|
@ -0,0 +1,50 @@
|
||||||
|
|
||||||
|
import { Card, CardContent } from "@/components/ui/card"
|
||||||
|
import Link from "next/link"
|
||||||
|
import { Calendar } from "lucide-react"
|
||||||
|
import { VERTICALS } from "@/config/verticals"
|
||||||
|
import { notFound } from "next/navigation"
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
params: { vertical: string }
|
||||||
|
}
|
||||||
|
|
||||||
|
export function generateStaticParams() {
|
||||||
|
return VERTICALS.map((v) => ({
|
||||||
|
vertical: v.slug,
|
||||||
|
}))
|
||||||
|
}
|
||||||
|
|
||||||
|
// TODO: Make this dynamic based on the band's history
|
||||||
|
const currentYear = new Date().getFullYear()
|
||||||
|
const years = Array.from({ length: 50 }, (_, i) => currentYear - i)
|
||||||
|
|
||||||
|
export default function VerticalArchivePage({ params }: Props) {
|
||||||
|
const vertical = VERTICALS.find((v) => v.slug === params.vertical)
|
||||||
|
|
||||||
|
if (!vertical) {
|
||||||
|
notFound()
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="flex flex-col gap-6">
|
||||||
|
<h1 className="text-3xl font-bold tracking-tight">{vertical.name} Archive</h1>
|
||||||
|
<p className="text-muted-foreground">Browse shows by year.</p>
|
||||||
|
<div className="grid gap-4 md:grid-cols-3 lg:grid-cols-4">
|
||||||
|
{years.map((year) => (
|
||||||
|
<Link key={year} href={`/${params.vertical}/shows?year=${year}`}>
|
||||||
|
<Card className="hover:bg-accent/50 transition-colors cursor-pointer text-center py-6">
|
||||||
|
<CardContent>
|
||||||
|
<div className="text-4xl font-bold text-primary">{year}</div>
|
||||||
|
<div className="flex items-center justify-center gap-2 mt-2 text-muted-foreground">
|
||||||
|
<Calendar className="h-4 w-4" />
|
||||||
|
<span>Browse Shows</span>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</Link>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
Loading…
Add table
Reference in a new issue