import { describe, it, expect } from "vitest";
import { render, screen } from "@testing-library/react";
import { MemoryRouter } from "react-router";
import { DraftScheduleGantt, type GanttSport } from "../DraftScheduleGantt";

const nbaWindow = {
  id: "ss-1",
  name: "2026 NBA Playoffs",
  year: 2026,
  status: "upcoming" as const,
  draftOn: "2026-08-01",
  draftOff: "2026-09-15",
  sport: { id: "nba", name: "NBA", slug: "nba", iconUrl: null },
};

function renderGantt(sports: GanttSport[], months = 6) {
  return render(
    <MemoryRouter>
      <DraftScheduleGantt sports={sports} today="2026-07-02" months={months} />
    </MemoryRouter>
  );
}

describe("DraftScheduleGantt", () => {
  it("renders empty state when there are no sports", () => {
    renderGantt([]);
    expect(screen.getByText("No sports found.")).toBeInTheDocument();
  });

  it("renders a bar linking to the sport-season for each draft window", () => {
    renderGantt([
      { id: "nba", name: "NBA", slug: "nba", iconUrl: null, windows: [nbaWindow] },
    ]);

    const bar = screen.getByRole("link", { name: /2026 NBA Playoffs/ });
    expect(bar).toHaveAttribute("href", "/admin/sports-seasons/ss-1");
  });

  it("renders overlapping windows as separate, clickable bars", () => {
    const overlappingWindow = {
      id: "ss-2",
      name: "2027 NBA Playoffs",
      year: 2027,
      status: "active" as const,
      draftOn: "2026-08-15",
      draftOff: "2026-10-01",
      sport: { id: "nba", name: "NBA", slug: "nba", iconUrl: null },
    };

    renderGantt([
      {
        id: "nba",
        name: "NBA",
        slug: "nba",
        iconUrl: null,
        windows: [nbaWindow, overlappingWindow],
      },
    ]);

    expect(
      screen.getByRole("link", { name: /2026 NBA Playoffs/ })
    ).toHaveAttribute("href", "/admin/sports-seasons/ss-1");
    expect(
      screen.getByRole("link", { name: /2027 NBA Playoffs/ })
    ).toHaveAttribute("href", "/admin/sports-seasons/ss-2");
  });

  it("shows a 'No draft window' hint for a sport with no windows", () => {
    renderGantt([
      { id: "golf", name: "Golf", slug: "golf", iconUrl: null, windows: [] },
    ]);

    expect(screen.getByText("Golf")).toBeInTheDocument();
    expect(screen.getByText("No draft window")).toBeInTheDocument();
  });

  it("renders the status legend", () => {
    renderGantt([
      { id: "nba", name: "NBA", slug: "nba", iconUrl: null, windows: [nbaWindow] },
    ]);

    expect(screen.getByText("Active")).toBeInTheDocument();
    expect(screen.getByText("Upcoming")).toBeInTheDocument();
    expect(screen.getByText("Completed")).toBeInTheDocument();
  });

  it("reflects the horizon length in the description", () => {
    renderGantt(
      [{ id: "nba", name: "NBA", slug: "nba", iconUrl: null, windows: [nbaWindow] }],
      12
    );

    expect(
      screen.getByText(/Draft windows across the next 12 months/)
    ).toBeInTheDocument();
  });
});