'use client';

import LeagueSchedule from '@/components/leagues/LeagueSchedule';
import Card from '@/components/ui/Card';
import { useEffectiveDriverId } from '@/hooks/useEffectiveDriverId';
import { isLeagueAdminOrHigherRole } from '@/lib/leagueRoles';
import { useServices } from '@/lib/services/ServiceProvider';
import { useParams, useRouter } from 'next/navigation';
import { useEffect, useState } from 'react';

export default function LeagueSchedulePage() {
  const params = useParams();
  const router = useRouter();
  const leagueId = params.id as string;
  const currentDriverId = useEffectiveDriverId();
  const { leagueMembershipService } = useServices();
  const [isAdmin, setIsAdmin] = useState(false);
  const [showCreateForm, setShowCreateForm] = useState(false);

  useEffect(() => {
    async function checkAdmin() {
      await leagueMembershipService.fetchLeagueMemberships(leagueId);
      const membership = leagueMembershipService.getMembership(leagueId, currentDriverId);
      setIsAdmin(membership ? isLeagueAdminOrHigherRole(membership.role) : false);
    }
    checkAdmin();
  }, [leagueId, currentDriverId, leagueMembershipService]);

  return (
    <div className="space-y-6">
      <Card>
        <h2 className="text-xl font-semibold text-white mb-4">Schedule</h2>
        <LeagueSchedule leagueId={leagueId} />
      </Card>
    </div>
  );
}