PacketStation/frontend/src/screens/admin/ChecklistsTab.test.tsx

import { fireEvent, screen, waitFor } from "@testing-library/react";
import { describe, expect, it } from "vitest";
import { adminBase } from "../../test/admin";
import { renderApp } from "../../test/auth";
import { callsTo, mockFetch } from "../../test/fetchMock";

const VALUE = {
  weld: [
    { group: "Before welding", key: "dwg", text: "Drawing {drawing} Rev {rev} matches the packet" },
    { group: "Before welding", key: "wps", text: "WPS reviewed: {wps}" },
    { group: "After welding", key: "vt", text: "Visual inspection of all welds acceptable" },
  ],
  plain: [{ group: "Before starting", key: "dwg", text: "Drawing {drawing} Rev {rev} matches the packet" }],
};
const DEFAULTS = { weld: VALUE.weld.slice(0, 2), plain: VALUE.plain };

async function openTab() {
  renderApp("/admin");
  fireEvent.click(await screen.findByRole("tab", { name: "Checklists" }));
  return screen.findByLabelText("Weld item 1 text");
}

describe("Admin Checklists tab", () => {
  it("edits, adds, reorders and removes items, checks them, and saves with the version", async () => {
    const fetch = mockFetch({
      ...adminBase(),
      "GET /api/admin/checklists": { body: { value: VALUE, defaults: DEFAULTS, version: 4 } },
      "PUT /api/admin/checklists": { body: { value: VALUE, defaults: DEFAULTS, version: 5 } },
    });
    await openTab();
    expect(screen.getByLabelText("Weld item 1 key")).toHaveAttribute("readonly");
    expect(screen.getByLabelText("Plain item 1 group")).toHaveValue("Before starting");

    fireEvent.change(screen.getByLabelText("Weld item 3 text"), { target: { value: "Visual check of every weld" } });
    fireEvent.click(screen.getByRole("button", { name: "Move weld item 3 up" }));
    fireEvent.click(screen.getByRole("button", { name: "Remove weld item 1" }));
    fireEvent.click(screen.getByRole("button", { name: "Add weld item" }));
    const key = screen.getByLabelText("Weld item 3 key");
    expect(key).not.toHaveAttribute("readonly");
    fireEvent.change(key, { target: { value: "Clean" } });
    fireEvent.change(screen.getByLabelText("Weld item 3 text"), { target: { value: "Slag removed near {part}" } });
    fireEvent.click(screen.getByRole("button", { name: "Save checklists" }));
    expect(await screen.findByRole("alert")).toHaveTextContent("Weld list, item 3: the key is lower case");

    fireEvent.change(key, { target: { value: "clean" } });
    fireEvent.click(screen.getByRole("button", { name: "Save checklists" }));
    expect(await screen.findByRole("alert")).toHaveTextContent("only {drawing}, {rev} and {wps}");

    fireEvent.change(screen.getByLabelText("Weld item 3 text"), { target: { value: "Slag removed" } });
    fireEvent.click(screen.getByRole("button", { name: "Save checklists" }));
    expect(await screen.findByText(/Checklists saved/)).toBeInTheDocument();
    expect(callsTo(fetch, "PUT", "/api/admin/checklists")).toEqual([
      {
        version: 4,
        value: {
          weld: [
            { group: "After welding", key: "vt", text: "Visual check of every weld" },
            { group: "Before welding", key: "wps", text: "WPS reviewed: {wps}" },
            { group: "Before welding", key: "clean", text: "Slag removed" },
          ],
          plain: VALUE.plain,
        },
      },
    ]);
  });

  it("loads the other version after a 409", async () => {
    let gets = 0;
    const fetch = mockFetch({
      ...adminBase(),
      "GET /api/admin/checklists": () => {
        gets += 1;
        return { body: { value: gets > 1 ? { ...VALUE, plain: [{ ...VALUE.plain[0], text: "Changed by Bob" }] } : VALUE, defaults: DEFAULTS, version: 3 + gets } };
      },
      "PUT /api/admin/checklists": { status: 409, body: { detail: "Changed by someone else", code: "version_conflict" } },
    });
    await openTab();
    fireEvent.change(screen.getByLabelText("Plain item 1 text"), { target: { value: "Mine" } });
    fireEvent.click(screen.getByRole("button", { name: "Save checklists" }));
    expect(await screen.findByRole("alert")).toHaveTextContent("Someone else saved the checklists first.");
    await waitFor(() => expect(screen.getByLabelText("Plain item 1 text")).toHaveValue("Changed by Bob"));
    expect(callsTo(fetch, "GET", "/api/admin/checklists")).toHaveLength(2);
  });

  it("copies the default list in", async () => {
    mockFetch({ ...adminBase(), "GET /api/admin/checklists": { body: { value: VALUE, defaults: DEFAULTS, version: 1 } } });
    await openTab();
    expect(screen.getByLabelText("Weld item 3 text")).toBeInTheDocument();
    fireEvent.click(screen.getByRole("button", { name: "Use the default weld list" }));
    expect(screen.queryByLabelText("Weld item 3 text")).not.toBeInTheDocument();
    fireEvent.click(screen.getByRole("button", { name: "Discard changes" }));
    expect(screen.getByLabelText("Weld item 3 text")).toBeInTheDocument();
  });
});