'use client';

import StandingsTable from '@/components/leagues/StandingsTable';
import LeagueChampionshipStats from '@/components/leagues/LeagueChampionshipStats';
import Card from '@/components/ui/Card';
import { useEffectiveDriverId } from '@/hooks/useEffectiveDriverId';
import type { LeagueMembership, MembershipRole } from '@/lib/types';
import { isLeagueAdminOrHigherRole } from '@/lib/leagueRoles';
import { useServices } from '@/lib/services/ServiceProvider';
import { DriverViewModel } from '@/lib/view-models';
import type { LeagueStandingsViewModel } from '@/lib/view-models';
import type { StandingEntryViewModel } from '@/lib/view-models/StandingEntryViewModel';
import { useParams } from 'next/navigation';
import { useCallback, useEffect, useState } from 'react';

export default function LeagueStandingsPage() {
  const params = useParams();
  const leagueId = params.id as string;
  const currentDriverId = useEffectiveDriverId();
  const { leagueService } = useServices();

  const [standings, setStandings] = useState<StandingEntryViewModel[]>([]);
  const [drivers, setDrivers] = useState<DriverViewModel[]>([]);
  const [memberships, setMemberships] = useState<LeagueMembership[]>([]);
  const [viewModel, setViewModel] = useState<LeagueStandingsViewModel | null>(null);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState<string | null>(null);
  const [isAdmin, setIsAdmin] = useState(false);

  const loadData = useCallback(async () => {
    try {
      const vm = await leagueService.getLeagueStandings(leagueId, currentDriverId);
      setViewModel(vm);
      setStandings(vm.standings);
      setDrivers(vm.drivers.map(d => new DriverViewModel(d)));
      setMemberships(vm.memberships);

      // Check if current user is admin
      const membership = vm.memberships.find(m => m.driverId === currentDriverId);
      setIsAdmin(membership ? isLeagueAdminOrHigherRole(membership.role) : false);
    } catch (err) {
      setError(err instanceof Error ? err.message : 'Failed to load standings');
    } finally {
      setLoading(false);
    }
  }, [leagueId, currentDriverId, leagueService]);

  useEffect(() => {
    loadData();
  }, [loadData]);

  const handleRemoveMember = async (driverId: string) => {
    if (!confirm('Are you sure you want to remove this member?')) {
      return;
    }

    try {
      await leagueService.removeMember(leagueId, currentDriverId, driverId);
      await loadData();
    } catch (err) {
      setError(err instanceof Error ? err.message : 'Failed to remove member');
    }
  };

  const handleUpdateRole = async (driverId: string, newRole: MembershipRole) => {
    try {
      await leagueService.updateMemberRole(leagueId, currentDriverId, driverId, newRole);
      await loadData();
    } catch (err) {
      setError(err instanceof Error ? err.message : 'Failed to update role');
    }
  };

  if (loading) {
    return (
      <div className="text-center text-gray-400">
        Loading standings...
      </div>
    );
  }

  if (error) {
    return (
      <div className="text-center text-warning-amber">
        {error}
      </div>
    );
  }

  return (
    <div className="space-y-6">
      {/* Championship Stats */}
      <LeagueChampionshipStats standings={standings} drivers={drivers} />

      <Card>
        <h2 className="text-xl font-semibold text-white mb-4">Championship Standings</h2>
        <StandingsTable
          standings={standings}
          drivers={drivers}
          leagueId={leagueId}
          memberships={memberships}
          currentDriverId={currentDriverId}
          isAdmin={isAdmin}
          onRemoveMember={handleRemoveMember}
          onUpdateRole={handleUpdateRole}
        />
      </Card>
    </div>
  );
}