import { notFound } from 'next/navigation';
import { LeagueOverviewTemplate } from '@/templates/LeagueOverviewTemplate';
import { LeagueDetailPageQuery } from '@/lib/page-queries/LeagueDetailPageQuery';
import { LeagueDetailViewDataBuilder } from '@/lib/builders/view-data/LeagueDetailViewDataBuilder';
import { ErrorBanner } from '@/ui/ErrorBanner';
import { Metadata } from 'next';
import { MetadataHelper } from '@/lib/seo/MetadataHelper';
import { JsonLd } from '@/ui/JsonLd';

interface Props {
  params: Promise<{ id: string }>;
}

export async function generateMetadata({ params }: Props): Promise<Metadata> {
  const { id } = await params;
  const result = await LeagueDetailPageQuery.execute(id);

  if (result.isErr()) {
    return MetadataHelper.generate({
      title: 'League Not Found',
      description: 'The requested league could not be found on GridPilot.',
      path: `/leagues/${id}`,
    });
  }

  const data = result.unwrap();
  const league = data.league;

  return MetadataHelper.generate({
    title: league.name,
    description: league.description || `Join ${league.name} on GridPilot. Professional iRacing league with automated results, standings, and obsessive attention to detail.`,
    path: `/leagues/${id}`,
  });
}

export default async function Page({ params }: Props) {
  const { id } = await params;
  // Execute the PageQuery
  const result = await LeagueDetailPageQuery.execute(id);
  
  // Handle different result types
  if (result.isErr()) {
    const error = result.getError();
    
    switch (error) {
      case 'notFound':
        notFound();
      case 'redirect':
        // In a real app, this would redirect to login
        notFound();
      default:
        // Return error state
        return (
          <ErrorBanner
            title="Load Failed"
            message="Failed to load league details"
            variant="error"
          />
        );
    }
  }
  
  const data = result.unwrap();
  const league = data.league;
  
  // Build ViewData using the builder
  // Note: This would need additional data (owner, scoring config, etc.) in real implementation
  const viewData = LeagueDetailViewDataBuilder.build({
    league: data.league,
    owner: null,
    scoringConfig: null,
    memberships: { members: [] },
    races: [],
    sponsors: [],
  });

  const jsonLd = {
    '@context': 'https://schema.org',
    '@type': 'SportsOrganization',
    name: league.name,
    description: league.description,
    url: `https://gridpilot.com/leagues/${league.id}`,
  };
  
  return (
    <>
      <JsonLd data={jsonLd} />
      <LeagueOverviewTemplate viewData={viewData} />
    </>
  );
}