elmeg-demo/frontend/app/archive/page.tsx

33 lines
1.5 KiB
TypeScript

import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
import Link from "next/link"
// Mock data for now - will fetch from API later
const recentShows = [
{ id: 1, date: "2023-12-31", venue: "Madison Square Garden", location: "New York, NY", band: "Phish" },
{ id: 2, date: "2023-12-30", venue: "Madison Square Garden", location: "New York, NY", band: "Phish" },
{ id: 3, date: "2023-12-29", venue: "Madison Square Garden", location: "New York, NY", band: "Phish" },
]
export default function ArchivePage() {
return (
<div className="flex flex-col gap-6">
<h1 className="text-3xl font-bold tracking-tight">Archive</h1>
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
{recentShows.map((show) => (
<Link key={show.id} href={`/shows/${show.id}`}>
<Card className="hover:bg-accent/50 transition-colors cursor-pointer">
<CardHeader>
<CardTitle>{show.date}</CardTitle>
</CardHeader>
<CardContent>
<p className="font-semibold">{show.band}</p>
<p className="text-sm text-muted-foreground">{show.venue}</p>
<p className="text-sm text-muted-foreground">{show.location}</p>
</CardContent>
</Card>
</Link>
))}
</div>
</div>
)
}