import { notFound } from 'next/navigation';
import { LeagueDetailTemplate } from '@/templates/LeagueDetailTemplate';
import { LeagueDetailPageQuery } from '@/lib/page-queries/LeagueDetailPageQuery';
import { LeagueDetailViewDataBuilder } from '@/lib/builders/view-data/LeagueDetailViewDataBuilder';
import { ErrorBanner } from '@/ui/ErrorBanner';

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

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();
  
  // 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: [],
  });
  
  return (
    <LeagueDetailTemplate viewData={viewData} tabs={[]}>
      {null}
    </LeagueDetailTemplate>
  );
}