import { fireEvent, render, screen } from "@testing-library/react";
import { describe, expect, it, vi } from "vitest";
import { StatusPicker } from "./StatusPicker";

describe("StatusPicker", () => {
  it("renders without crashing", () => {
    const setSelectedStatus = vi.fn();
    render(<StatusPicker selectedStatus="todo" setSelectedStatus={setSelectedStatus} />);
    expect(screen.getByText("Statut")).toBeInTheDocument();
  });

  it("renders all three status buttons", () => {
    const setSelectedStatus = vi.fn();
    render(<StatusPicker selectedStatus="todo" setSelectedStatus={setSelectedStatus} />);
    expect(screen.getByText("À faire")).toBeInTheDocument();
    expect(screen.getByText("En cours")).toBeInTheDocument();
    expect(screen.getByText("Terminé")).toBeInTheDocument();
  });

  it("highlights the selected status", () => {
    const setSelectedStatus = vi.fn();
    render(<StatusPicker selectedStatus="in_progress" setSelectedStatus={setSelectedStatus} />);
    const inProgressButton = screen.getByText("En cours");
    expect(inProgressButton).toHaveClass("bg-blue-100");
  });

  it("calls setSelectedStatus when todo button is clicked", () => {
    const setSelectedStatus = vi.fn();
    render(<StatusPicker selectedStatus="in_progress" setSelectedStatus={setSelectedStatus} />);
    fireEvent.click(screen.getByText("À faire"));
    expect(setSelectedStatus).toHaveBeenCalledWith("todo");
  });

  it("calls setSelectedStatus when in_progress button is clicked", () => {
    const setSelectedStatus = vi.fn();
    render(<StatusPicker selectedStatus="todo" setSelectedStatus={setSelectedStatus} />);
    fireEvent.click(screen.getByText("En cours"));
    expect(setSelectedStatus).toHaveBeenCalledWith("in_progress");
  });

  it("calls setSelectedStatus when done button is clicked", () => {
    const setSelectedStatus = vi.fn();
    render(<StatusPicker selectedStatus="todo" setSelectedStatus={setSelectedStatus} />);
    fireEvent.click(screen.getByText("Terminé"));
    expect(setSelectedStatus).toHaveBeenCalledWith("done");
  });

  it("applies correct styling for done status", () => {
    const setSelectedStatus = vi.fn();
    render(<StatusPicker selectedStatus="done" setSelectedStatus={setSelectedStatus} />);
    const doneButton = screen.getByText("Terminé");
    expect(doneButton).toHaveClass("bg-green-100");
  });
});
