import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { vi } from "vitest";
import WorksPickerModal from "@/components/repairs/WorksPickerModal";
import type { MechWork } from "@/api/repairsCreate";

const works: MechWork[] = [
  { id: 1, name: "Замена масла", category_id: 1, price: 1500, norma_hours: null },
  { id: 2, name: "Развал-схождение", category_id: 1, price: "2000", norma_hours: null },
];

test("рендерит работы с ценой и зовёт onPick по клику", async () => {
  const user = userEvent.setup();
  const onPick = vi.fn();
  render(
    <WorksPickerModal query="" results={works} onQuery={() => {}} onPick={onPick} onClose={() => {}} />,
  );
  expect(screen.getByText("Замена масла")).toBeInTheDocument();
  expect(screen.getByText("1 500 ₽")).toBeInTheDocument(); // число из 1500
  expect(screen.getByText("2 000 ₽")).toBeInTheDocument(); // строка "2000" → число
  await user.click(screen.getByText("Развал-схождение"));
  expect(onPick).toHaveBeenCalledWith(works[1]);
});

test("пустой список → «Ничего не найдено»", () => {
  render(
    <WorksPickerModal query="x" results={[]} onQuery={() => {}} onPick={() => {}} onClose={() => {}} />,
  );
  expect(screen.getByText("Ничего не найдено")).toBeInTheDocument();
});

test("ввод в поиск зовёт onQuery; кнопка назад — onClose", async () => {
  const user = userEvent.setup();
  const onQuery = vi.fn();
  const onClose = vi.fn();
  render(
    <WorksPickerModal query="" results={[]} onQuery={onQuery} onPick={() => {}} onClose={onClose} />,
  );
  await user.type(screen.getByPlaceholderText("Поиск работы…"), "масло");
  expect(onQuery).toHaveBeenCalled();
  await user.click(screen.getByLabelText("Закрыть"));
  expect(onClose).toHaveBeenCalled();
});
