project-standalo-sonic-cloud/app/label/[id]/page.tsx

85 lines
2.2 KiB
TypeScript

import { LabelHeader } from '@/components/LabelHeader'
import { LabelStats } from '@/components/LabelStats'
import { ArtistRoster } from '@/components/ArtistRoster'
interface PageProps {
params: Promise<{ id: string }>
}
async function getLabel(id: string) {
const res = await fetch(`${process.env.NEXT_PUBLIC_BASE_URL}/api/labels/${id}`, {
cache: 'no-store',
})
if (!res.ok) throw new Error('Label not found')
const data = await res.json()
return data.label
}
async function getLabelStats(id: string) {
const res = await fetch(`${process.env.NEXT_PUBLIC_BASE_URL}/api/labels/${id}/stats`, {
cache: 'no-store',
})
if (!res.ok) {
return {
artistCount: 0,
songCount: 0,
albumCount: 0,
totalPlays: 0
}
}
const data = await res.json()
return data.stats
}
export default async function LabelPage({ params }: PageProps) {
const { id } = await params
const [label, stats] = await Promise.all([
getLabel(id),
getLabelStats(id),
])
return (
<main className="min-h-screen bg-zinc-950">
<LabelHeader
label={{
id: label.id,
name: label.name,
logoUrl: label.logoUrl,
description: label.description,
website: label.website
}}
isOwner={false}
/>
<div className="max-w-7xl mx-auto px-4 py-8">
{/* Stats */}
<section className="mb-12">
<LabelStats stats={stats} />
</section>
{/* Artist Roster */}
<section>
<h2 className="text-2xl font-bold text-white mb-6">Artists</h2>
<ArtistRoster
artists={label.artists || []}
isOwner={false}
emptyMessage="No artists signed to this label yet"
onArtistClick={(artistId) => {
window.location.href = `/artist/${artistId}`
}}
/>
</section>
{/* Description */}
{label.description && (
<section className="mt-12">
<h2 className="text-2xl font-bold text-white mb-4">About</h2>
<p className="text-zinc-300 leading-relaxed max-w-3xl">{label.description}</p>
</section>
)}
</div>
</main>
)
}