import type { Dispatch, SetStateAction } from "react";
import {
  type PlayerFormState,
} from "@/components/players-admin-client-config";
import { PlayersAdminCreatePlayerSection } from "@/components/players-admin-create-player-section";
import { PlayersAdminPlayerList } from "@/components/players-admin-player-list";
import { playersAdminShellStyles } from "@/components/players-admin-shell-styles";
import { PlayersAdminStats } from "@/components/players-admin-stats";
import type { BallboxStoreAdminPlayer, BallboxStoreClubListItem } from "@/lib/ballbox-store";

type PlayersAdminShellProps = {
  players: BallboxStoreAdminPlayer[];
  setPlayers: Dispatch<SetStateAction<BallboxStoreAdminPlayer[]>>;
  busy: boolean;
  message: string | null;
  playerForm: PlayerFormState;
  setPlayerForm: Dispatch<SetStateAction<PlayerFormState>>;
  clubs: BallboxStoreClubListItem[];
  membershipClubIds: Record<string, string>;
  setMembershipClubIds: Dispatch<SetStateAction<Record<string, string>>>;
  runMutation: (task: () => Promise<void>, successMessage: string) => Promise<void>;
};

export function PlayersAdminShell({
  players,
  setPlayers,
  busy,
  message,
  playerForm,
  setPlayerForm,
  clubs,
  membershipClubIds,
  setMembershipClubIds,
  runMutation,
}: PlayersAdminShellProps) {
  return (
    <div className="space-y-6">
      <PlayersAdminStats players={players} clubs={clubs} cardClassName={playersAdminShellStyles.statCard} />

      <PlayersAdminCreatePlayerSection
        busy={busy}
        message={message}
        playerForm={playerForm}
        setPlayerForm={setPlayerForm}
        cardClassName={playersAdminShellStyles.sectionCard}
        runMutation={runMutation}
      />

      <PlayersAdminPlayerList
        players={players}
        setPlayers={setPlayers}
        busy={busy}
        clubs={clubs}
        membershipClubIds={membershipClubIds}
        setMembershipClubIds={setMembershipClubIds}
        articleCardClassName={playersAdminShellStyles.articleCard}
        insetPanelClassName={playersAdminShellStyles.insetPanel}
        wellClassName={playersAdminShellStyles.well}
        selectClassName={playersAdminShellStyles.select}
        runMutation={runMutation}
      />
    </div>
  );
}