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>
  )
}