/**
 * @vitest-environment jsdom
 */
import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { describe, expect, it } from "vitest";
import { Dialog, JourneyTrail, Select, Switch } from "@/components/ui";
import { EmptyState, ErrorState, LoadingBlock } from "@/components/states";

describe("estados e controles", () => {
  it("mostra loading, vazio, erro e switch acessível", async () => {
    const user = userEvent.setup();
    let checked = false;
    const view = render(
      <div>
        <LoadingBlock />
        <EmptyState title="Nada aqui" description="Cadastre um modelo." />
        <ErrorState message="Falha recuperável" onRetry={() => undefined} />
        <Switch label="Permitir upload" checked={checked} onCheckedChange={(value) => { checked = value; }} />
        <JourneyTrail steps={["Modelo", "Fontes"]} current={0} />
        <Select aria-label="Coluna fonte">
          <option value="">Não mapear</option>
          <option value="Nome">Nome</option>
        </Select>
        <Dialog open title="Critérios" onClose={() => undefined}>Formatos XLSX e CSV.</Dialog>
      </div>,
    );
    expect(screen.getByRole("status")).toBeTruthy();
    expect(screen.getByText("Nada aqui")).toBeTruthy();
    expect(screen.getByRole("alert")).toBeTruthy();
    expect(screen.getByRole("switch", { name: "Permitir upload" }).getAttribute("aria-checked")).toBe("false");
    await user.click(screen.getByRole("switch", { name: "Permitir upload" }));
    expect(checked).toBe(true);
    expect(screen.getByRole("dialog", { name: "Critérios" })).toBeTruthy();
    await user.selectOptions(screen.getByRole("combobox", { name: "Coluna fonte" }), "Nome");
    expect((screen.getByRole("combobox", { name: "Coluna fonte" }) as HTMLSelectElement).value).toBe("Nome");
    view.unmount();
  });
});