104 lines
4.1 KiB
TypeScript
104 lines
4.1 KiB
TypeScript
import { VERTICALS } from "@/config/verticals"
|
|
import { notFound } from "next/navigation"
|
|
import { getApiUrl } from "@/lib/api-config"
|
|
import { Show, PaginatedResponse } from "@/types/models"
|
|
import { Card } from "@/components/ui/card"
|
|
import { Calendar, MapPin } from "lucide-react"
|
|
|
|
interface Props {
|
|
params: Promise<{ vertical: string }>
|
|
}
|
|
|
|
export function generateStaticParams() {
|
|
return VERTICALS.map((v) => ({
|
|
vertical: v.slug,
|
|
}))
|
|
}
|
|
|
|
async function getShows(verticalSlug: string): Promise<PaginatedResponse<Show> | null> {
|
|
try {
|
|
const res = await fetch(`${getApiUrl()}/shows/?vertical=${verticalSlug}`, {
|
|
next: { revalidate: 60 }
|
|
})
|
|
if (!res.ok) return null
|
|
return res.json()
|
|
} catch {
|
|
return null
|
|
}
|
|
}
|
|
|
|
export default async function ShowsPage({ params }: Props) {
|
|
const { vertical: verticalSlug } = await params
|
|
const vertical = VERTICALS.find((v) => v.slug === verticalSlug)
|
|
|
|
if (!vertical) {
|
|
notFound()
|
|
}
|
|
|
|
const data = await getShows(vertical.slug)
|
|
const shows = data?.data || []
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
<div className="flex items-center justify-between">
|
|
<h1 className="text-3xl font-bold">{vertical.name} Shows</h1>
|
|
</div>
|
|
|
|
{shows.length === 0 ? (
|
|
<div className="text-center py-12 text-muted-foreground">
|
|
<p>No shows imported yet for {vertical.name}.</p>
|
|
<p className="text-sm mt-2">Run the data importer to populate shows.</p>
|
|
</div>
|
|
) : (
|
|
<div className="grid gap-4">
|
|
{shows.map((show) => (
|
|
<a
|
|
key={show.id}
|
|
href={`/${vertical.slug}/shows/${show.slug}`}
|
|
className="block group"
|
|
>
|
|
<Card className="p-4 hover:bg-accent transition-colors">
|
|
<div className="flex justify-between items-start">
|
|
<div>
|
|
<div className="font-semibold flex items-center gap-2">
|
|
{show.venue?.name || "Unknown Venue"}
|
|
</div>
|
|
<div className="text-sm text-muted-foreground flex items-center gap-1 mt-1">
|
|
<MapPin className="h-3 w-3" />
|
|
{show.venue?.city}, {show.venue?.state || show.venue?.country}
|
|
</div>
|
|
</div>
|
|
<div className="text-right">
|
|
<div className="font-mono text-sm font-bold flex items-center gap-1 justify-end">
|
|
<Calendar className="h-3 w-3" />
|
|
{new Date(show.date).toLocaleDateString()}
|
|
</div>
|
|
{show.performances && show.performances.length > 0 && (
|
|
<div className="text-xs text-muted-foreground mt-1">
|
|
{show.performances.length} songs
|
|
</div>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</Card>
|
|
</a>
|
|
))}
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|
|
</div >
|
|
</div >
|
|
<div className="text-right">
|
|
<div className="font-mono">{new Date(show.date).toLocaleDateString()}</div>
|
|
<div className="text-sm text-muted-foreground">{show.tour?.name}</div>
|
|
</div>
|
|
</div >
|
|
</a >
|
|
))}
|
|
</div >
|
|
)}
|
|
</div >
|
|
)
|
|
}
|