95 lines
3.1 KiB
TypeScript
95 lines
3.1 KiB
TypeScript
import { TieredBandList } from "@/components/home/tiered-band-list"
|
|
import { Button } from "@/components/ui/button"
|
|
import Link from "next/link"
|
|
import { getApiUrl } from "@/lib/api-config"
|
|
|
|
interface Vertical {
|
|
id: number
|
|
name: string
|
|
slug: string
|
|
description: string | null
|
|
}
|
|
|
|
async function getVerticals(): Promise<Vertical[]> {
|
|
try {
|
|
const res = await fetch(`${getApiUrl()}/verticals/`, { next: { revalidate: 60 } })
|
|
if (!res.ok) return []
|
|
return res.json()
|
|
} catch {
|
|
return []
|
|
}
|
|
}
|
|
|
|
|
|
export default async function HomePage() {
|
|
const verticals = await getVerticals()
|
|
|
|
return (
|
|
<div className="space-y-20 pb-16">
|
|
{/* Hero Section */}
|
|
<section className="text-center pt-20 pb-10 space-y-8 animate-in fade-in zoom-in duration-700">
|
|
<div className="space-y-4">
|
|
<h1 className="text-6xl font-extrabold tracking-tighter bg-clip-text text-transparent bg-gradient-to-r from-primary to-primary/60">
|
|
Fediversion
|
|
</h1>
|
|
<p className="text-2xl text-muted-foreground max-w-2xl mx-auto font-light leading-relaxed">
|
|
The definitive archive for the modern jam era.
|
|
<br />
|
|
<span className="text-foreground font-medium">Every setlist. Every sit-in. One profile.</span>
|
|
</p>
|
|
</div>
|
|
|
|
<div className="flex justify-center gap-4 pt-4">
|
|
<Button asChild size="xl" className="h-14 px-8 text-lg rounded-full">
|
|
<Link href="/register">Get on the Bus</Link>
|
|
</Button>
|
|
<Button asChild variant="outline" size="xl" className="h-14 px-8 text-lg rounded-full">
|
|
<Link href="/shows">Explore the Archive</Link>
|
|
</Button>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Tiered Band List - The "Meat" */}
|
|
<TieredBandList initialVerticals={verticals} />
|
|
|
|
{/* Community / Stats - Reimagined */}
|
|
<section className="max-w-4xl mx-auto px-4">
|
|
<div className="bg-muted/50 rounded-3xl p-12 text-center space-y-8 border backdrop-blur-sm">
|
|
<div className="space-y-2">
|
|
<h2 className="text-3xl font-bold tracking-tight">Community Powered</h2>
|
|
<p className="text-lg text-muted-foreground">
|
|
Built by heads, for heads. Track your stats, rate the heat, and find your crew.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 pt-4">
|
|
<StatItem
|
|
value={verticals.length > 0 ? verticals.length.toString() : "50+"}
|
|
label="Bands Indexed"
|
|
/>
|
|
<StatItem
|
|
value="10k+"
|
|
label="Shows Tracked"
|
|
/>
|
|
<StatItem
|
|
value="1"
|
|
label="Unified Profile"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
function StatItem({ value, label }: { value: string, label: string }) {
|
|
return (
|
|
<div className="space-y-1">
|
|
<div className="text-4xl font-black text-primary tracking-tight">{value}</div>
|
|
<div className="text-sm font-medium text-muted-foreground uppercase tracking-wider">{label}</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
|
|
|