// @vitest-environment jsdom

import { cleanup, fireEvent, render, screen } from "@testing-library/react";
import type { ComponentProps } from "react";
import { afterEach, describe, expect, it, vi } from "vitest";
import { PlayersAdminCreatePlayerSection } from "@/components/players-admin-create-player-section";

function renderSection(overrides?: Partial<ComponentProps<typeof PlayersAdminCreatePlayerSection>>) {
  return render(
    <PlayersAdminCreatePlayerSection
      busy={false}
      message="Player created"
      playerForm={{ name: "Player One", whatsappPhone: "", telegramHandle: "" }}
      setPlayerForm={vi.fn()}
      cardClassName="section-card"
      runMutation={vi.fn()}
      {...overrides}
    />,
  );
}

describe("PlayersAdminCreatePlayerSection", () => {
  afterEach(() => {
    cleanup();
  });

  it("renders the extracted section shell and forwards player form updates", () => {
    const setPlayerForm = vi.fn();
    const { container } = renderSection({
      setPlayerForm,
      message: null,
      playerForm: { name: "", whatsappPhone: "", telegramHandle: "" },
    });

    fireEvent.change(screen.getByPlaceholderText("Player name"), { target: { value: "Player Renamed" } });

    expect((container.firstChild as HTMLElement | null)?.className).toContain("section-card");
    expect(screen.getByText("Players + memberships")).toBeTruthy();
    expect(screen.queryByText("Player created")).toBeNull();
    expect(setPlayerForm).toHaveBeenCalledWith(expect.any(Function));
    expect(screen.getByRole("button", { name: "Add player" })).toHaveProperty("disabled", true);
  });
});