@thepalaceproject/circulation-admin 1.43.0-post.10 → 1.43.0-post.14

package/tests/jest/components/PairedMenus.test.tsx

@@ -0,0 +1,220 @@
+import * as React from "react";
+import { render, screen, within, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import PairedMenus from "../../../src/components/PairedMenus";
+import { SettingData, LibraryData } from "../../../src/interfaces";
+
+describe("PairedMenus", () => {
+  const inputListSetting: SettingData = {
+    key: "input",
+    label: "Input List",
+    default: ["a", "b", "c"],
+    options: [
+      { key: "a", label: "A" },
+      { key: "b", label: "B" },
+      { key: "c", label: "C" },
+      { key: "d", label: "D" },
+      { key: "e", label: "E" },
+    ],
+    paired: "dropdown",
+  };
+  const dropdownSetting: SettingData = {
+    key: "dropdown",
+    label: "Dropdown",
+    default: "b",
+    options: [
+      { key: "a", label: "A" },
+      { key: "b", label: "B" },
+      { key: "c", label: "C" },
+      { key: "d", label: "D" },
+      { key: "e", label: "E" },
+    ],
+    type: "select",
+  };
+
+  const renderPairedMenus = (props = {}) =>
+    render(
+      <PairedMenus
+        inputListSetting={inputListSetting}
+        dropdownSetting={dropdownSetting}
+        disabled={false}
+        {...props}
+      />
+    );
+
+  // The current InputList items are rendered as read-only text inputs inside the
+  // `.input-list-ul` list; return their displayed values.
+  const listItemValues = (container: HTMLElement): string[] =>
+    within(container.querySelector<HTMLElement>(".input-list-ul")!)
+      .getAllByRole("textbox")
+      .map((input) => (input as HTMLInputElement).value);
+
+  const dropdown = (container: HTMLElement): HTMLSelectElement =>
+    container.querySelector<HTMLSelectElement>('select[name="dropdown"]')!;
+
+  it("renders a fieldset with an InputList and a dropdown", () => {
+    const { container } = renderPairedMenus();
+    expect(
+      container.querySelector("fieldset.paired-menus")
+    ).toBeInTheDocument();
+    expect(container.querySelector(".input-list")).toBeInTheDocument();
+    expect(dropdown(container)).toBeInTheDocument();
+  });
+
+  it("renders the InputList items as read-only fields", () => {
+    const { container } = renderPairedMenus();
+    const listItems = within(
+      container.querySelector<HTMLElement>(".input-list-ul")!
+    ).getAllByRole("textbox");
+    expect(listItems).toHaveLength(3);
+    listItems.forEach((input) =>
+      expect((input as HTMLInputElement).readOnly).toBe(true)
+    );
+    expect(listItemValues(container)).toEqual(["A", "B", "C"]);
+  });
+
+  it("renders the dropdown with its default value and available options", () => {
+    const { container } = renderPairedMenus();
+    const select = dropdown(container);
+    expect(select).toHaveValue("b");
+    const options = within(select).getAllByRole("option");
+    expect(options.map((o) => o.textContent)).toEqual(["A", "B", "C"]);
+    expect(options.map((o) => (o as HTMLOptionElement).value)).toEqual([
+      "a",
+      "b",
+      "c",
+    ]);
+  });
+
+  it("optionally disables the InputList's button", () => {
+    const { rerender } = renderPairedMenus();
+    expect(screen.getByRole("button", { name: "Add" })).toBeEnabled();
+
+    rerender(
+      <PairedMenus
+        inputListSetting={inputListSetting}
+        dropdownSetting={dropdownSetting}
+        disabled={false}
+        readOnly={true}
+      />
+    );
+    expect(screen.getByRole("button", { name: "Add" })).toBeDisabled();
+  });
+
+  it("reflects the default InputList values and dropdown value", () => {
+    const { container } = renderPairedMenus();
+    expect(listItemValues(container)).toEqual(["A", "B", "C"]);
+    expect(dropdown(container)).toHaveValue("b");
+  });
+
+  it("takes an optional item prop", () => {
+    const item: LibraryData = {
+      name: "Library",
+      short_name: "lib",
+      uuid: "123",
+      settings: {
+        input: ["c", "d", "e"],
+        dropdown: "d",
+      },
+    };
+    const { container } = renderPairedMenus({ item });
+
+    const listItems = within(
+      container.querySelector<HTMLElement>(".input-list-ul")!
+    ).getAllByRole("textbox");
+    expect(listItems.map((i) => (i as HTMLInputElement).value)).toEqual([
+      "C",
+      "D",
+      "E",
+    ]);
+    expect(listItems.map((i) => (i as HTMLInputElement).name)).toEqual([
+      "input_c",
+      "input_d",
+      "input_e",
+    ]);
+
+    const select = dropdown(container);
+    expect(select).toHaveValue("d");
+    expect(
+      within(select)
+        .getAllByRole("option")
+        .map((o) => o.textContent)
+    ).toEqual(["C", "D", "E"]);
+  });
+
+  it("updates the InputList when an item is removed", async () => {
+    const user = userEvent.setup();
+    const { container } = renderPairedMenus();
+    expect(listItemValues(container)).toEqual(["A", "B", "C"]);
+
+    // Remove the first list item ("A").
+    await user.click(screen.getAllByRole("button", { name: /Delete/ })[0]);
+
+    await waitFor(() =>
+      expect(
+        within(
+          container.querySelector<HTMLElement>(".input-list-ul")!
+        ).getAllByRole("textbox")
+      ).toHaveLength(2)
+    );
+    expect(listItemValues(container)).toEqual(["B", "C"]);
+  });
+
+  it("recalculates the dropdown options based on the InputList values", async () => {
+    const user = userEvent.setup();
+    const { container } = renderPairedMenus();
+    expect(
+      within(dropdown(container))
+        .getAllByRole("option")
+        .map((o) => o.textContent)
+    ).toEqual(["A", "B", "C"]);
+
+    // Removing "A" leaves the InputList holding [b, c], so the dropdown may only
+    // offer B and C.
+    await user.click(screen.getAllByRole("button", { name: /Delete/ })[0]);
+
+    await waitFor(() =>
+      expect(
+        within(dropdown(container))
+          .getAllByRole("option")
+          .map((o) => o.textContent)
+      ).toEqual(["B", "C"])
+    );
+  });
+
+  it("updates the dropdown selection", async () => {
+    const user = userEvent.setup();
+    const { container } = renderPairedMenus();
+    const select = dropdown(container);
+    expect(select).toHaveValue("b");
+
+    await user.selectOptions(select, "c");
+    expect(select).toHaveValue("c");
+  });
+
+  it("displays a message when the dropdown has no available values", async () => {
+    const user = userEvent.setup();
+    const { container } = renderPairedMenus();
+
+    // Remove every item from the InputList.
+    for (let remaining = 3; remaining > 0; remaining--) {
+      const removeButtons = screen.getAllByRole("button", { name: /Delete/ });
+      expect(removeButtons).toHaveLength(remaining);
+      await user.click(removeButtons[0]);
+      await waitFor(() =>
+        expect(
+          screen.queryAllByRole("button", { name: /Delete/ })
+        ).toHaveLength(remaining - 1)
+      );
+    }
+
+    const message =
+      "In order to set this value, you must add at least one option from the menu above.";
+    expect(screen.getByText(message)).toBeInTheDocument();
+    expect(container.querySelector(".bg-warning")).toHaveTextContent(message);
+
+    // The dropdown select is replaced by the warning; only the add menu remains.
+    expect(dropdown(container)).not.toBeInTheDocument();
+    expect(container.querySelectorAll("select")).toHaveLength(1);
+  });
+});

package/tests/jest/components/PatronAuthServices.test.tsx

@@ -0,0 +1,114 @@
+import * as React from "react";
+import { screen, waitFor } from "@testing-library/react";
+
+import { renderWithProviders } from "../testUtils/withProviders";
+import buildStore from "../../../src/store";
+// Render the CONNECTED default export so that mapStateToProps / mapDispatchToProps
+// are exercised: the panel fetches its data on mount, the fetch populates the
+// Redux store, and mapStateToProps feeds it back in as props.
+import PatronAuthServices from "../../../src/components/PatronAuthServices";
+
+const listData = {
+  patron_auth_services: [
+    {
+      id: 2,
+      protocol: "test protocol",
+      settings: { test_setting: "test setting" },
+      libraries: [
+        { short_name: "nypl", test_library_setting: "test library setting" },
+      ],
+      name: "nypl protocol",
+    },
+  ],
+  protocols: [
+    { name: "test protocol", label: "test protocol label", settings: [] },
+  ],
+  allLibraries: [{ short_name: "nypl" }],
+};
+
+/**
+ * Stub `fetch` so the panel's on-mount fetch resolves with `body`. Returning a
+ * fresh Response per call avoids "body already used" when several fetches run.
+ */
+const stubFetch = (body: unknown) =>
+  jest.spyOn(globalThis, "fetch").mockImplementation(
+    async () =>
+      new Response(JSON.stringify(body), {
+        status: 200,
+        headers: { "Content-Type": "application/json" },
+      })
+  );
+
+// A fresh store per test keeps the fetched data isolated between tests.
+const renderConnected = (element: React.ReactElement) =>
+  renderWithProviders(element, {
+    reduxProviderProps: { store: buildStore() },
+  });
+
+describe("PatronAuthServices", () => {
+  afterEach(() => {
+    jest.restoreAllMocks();
+  });
+
+  it("shows the patron auth service list", async () => {
+    stubFetch(listData);
+    const { container } = renderConnected(
+      <PatronAuthServices csrfToken="token" />
+    );
+
+    // The list appears once the connected component's on-mount fetch resolves.
+    // Its heading is the protocol-aware label built by PatronAuthServices.label().
+    expect(
+      await screen.findByRole("heading", {
+        level: 3,
+        name: /nypl protocol: test protocol label/,
+      })
+    ).toBeInTheDocument();
+
+    const editLink = container.querySelector("a.edit-item");
+    expect(editLink).not.toBeNull();
+    expect(editLink.getAttribute("href")).toBe(
+      "/admin/web/config/patronAuth/edit/2"
+    );
+
+    // No neighborhood analytics panel is shown in list mode.
+    expect(
+      screen.queryByText("Patron Neighborhood Analytics: Disabled")
+    ).not.toBeInTheDocument();
+  });
+
+  it("shows the neighborhood analytics panel when creating a service whose protocol has a neighborhood_mode setting", async () => {
+    const neighborhoodSetting = {
+      key: "neighborhood_mode",
+      label: "Neighborhood Mode",
+      description: "",
+      options: [],
+    };
+    const createData = {
+      patron_auth_services: [],
+      protocols: [
+        {
+          name: "test protocol",
+          label: "test protocol label",
+          settings: [neighborhoodSetting],
+        },
+      ],
+      allLibraries: [{ short_name: "nypl" }],
+    };
+    stubFetch(createData);
+
+    const { container } = renderConnected(
+      <PatronAuthServices csrfToken="token" editOrCreate="create" />
+    );
+
+    // Once the protocol data loads, the create form's extra section (the
+    // NeighborhoodAnalyticsForm) renders because the selected protocol carries a
+    // "neighborhood_mode" setting.
+    await waitFor(() =>
+      expect(container.querySelector("#neighborhood-panel")).toBeInTheDocument()
+    );
+    expect(
+      screen.getByText("Patron Neighborhood Analytics: Disabled")
+    ).toBeInTheDocument();
+  });
+});

package/tests/jest/components/ResetAdobeId.test.tsx

@@ -0,0 +1,302 @@
+import * as React from "react";
+import { screen, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+
+import buildStore from "../../../src/store";
+import { renderWithProviders } from "../testUtils/withProviders";
+import ConnectedResetAdobeId, {
+  ResetAdobeId,
+} from "../../../src/components/ResetAdobeId";
+
+const patrons = [
+  {
+    authorization_expires: "",
+    username: "User Name",
+    personal_name: "Personal Name",
+    email_address: "user@email.com",
+    authorization_identifier: "1234",
+    authorization_identifiers: [""],
+    block_reason: "",
+    external_type: "",
+    fines: "",
+    permanent_id: "",
+  },
+  {
+    authorization_expires: "",
+    personal_name: "Personal Name2",
+    authorization_identifier: "5678",
+    authorization_identifiers: [""],
+    block_reason: "",
+    external_type: "",
+    fines: "",
+    permanent_id: "",
+  },
+];
+
+describe("ResetAdobeId", () => {
+  let store: ReturnType<typeof buildStore>;
+
+  beforeEach(() => {
+    store = buildStore();
+  });
+
+  afterEach(() => {
+    jest.restoreAllMocks();
+  });
+
+  // Render the unconnected component with explicit props (patron / resetAdobeId /
+  // responseBody / fetchError are what `connect` would otherwise source from the
+  // store, so tests inject them directly). Wrapped in providers because the
+  // ManagePatronsForm it renders is connected.
+  const resetElement = (props: Record<string, unknown> = {}) => (
+    <ResetAdobeId store={store} csrfToken="token" library="nypl" {...props} />
+  );
+  const renderReset = (props: Record<string, unknown> = {}) =>
+    renderWithProviders(resetElement(props));
+
+  describe("rendering without patron", () => {
+    it("has the patron-actions class", () => {
+      const { container } = renderReset({ patron: null });
+      expect(container.firstChild).toHaveClass("patron-actions");
+    });
+
+    it("has a header", () => {
+      renderReset({ patron: null });
+      expect(
+        screen.getByRole("heading", { name: "Reset Adobe ID" })
+      ).toBeInTheDocument();
+    });
+
+    it("does not render a patron-info section", () => {
+      const { container } = renderReset({ patron: null });
+      expect(container.querySelector(".patron-info")).not.toBeInTheDocument();
+    });
+
+    it("prompts the user to search for a patron", () => {
+      renderReset({ patron: null });
+      expect(
+        screen.getByText("Search for a patron to begin.")
+      ).toBeInTheDocument();
+    });
+  });
+
+  describe("rendering with patron", () => {
+    it("shows a warning before the submit button", () => {
+      const { container } = renderReset({ patron: patrons[0] });
+      expect(container.querySelector(".patron-warning")).toHaveTextContent(
+        "IMPORTANT: Patron User Name will lose access to any existing loans. Loans will still appear in the patron's book list until they expire, but the patron will be unable to read or return them."
+      );
+    });
+
+    it("gives the submit button a danger class", () => {
+      renderReset({ patron: patrons[0] });
+      expect(
+        screen.getByRole("button", { name: "Reset Adobe ID" })
+      ).toHaveClass("danger");
+    });
+  });
+
+  describe("behavior", () => {
+    it("has a disabled submit button initially", () => {
+      renderReset({ patron: patrons[0], resetAdobeId: jest.fn() });
+      expect(
+        screen.getByRole("button", { name: "Reset Adobe ID" })
+      ).toBeDisabled();
+    });
+
+    it("enables the submit button when the checkbox is checked", async () => {
+      const user = userEvent.setup();
+      renderReset({ patron: patrons[0], resetAdobeId: jest.fn() });
+      const button = screen.getByRole("button", { name: "Reset Adobe ID" });
+      expect(button).toBeDisabled();
+
+      await user.click(screen.getByRole("checkbox"));
+
+      expect(button).not.toBeDisabled();
+    });
+
+    it("disables the submit button when the checkbox is unchecked again", async () => {
+      const user = userEvent.setup();
+      renderReset({ patron: patrons[0], resetAdobeId: jest.fn() });
+      const button = screen.getByRole("button", { name: "Reset Adobe ID" });
+      const checkbox = screen.getByRole("checkbox");
+
+      await user.click(checkbox);
+      expect(button).not.toBeDisabled();
+
+      await user.click(checkbox);
+      expect(button).toBeDisabled();
+    });
+
+    it("calls the Adobe ID action when the button is clicked", async () => {
+      const user = userEvent.setup();
+      const resetAdobeId = jest.fn().mockResolvedValue(undefined);
+      renderReset({ patron: patrons[0], resetAdobeId });
+      expect(resetAdobeId).not.toHaveBeenCalled();
+
+      await user.click(screen.getByRole("checkbox"));
+      const button = screen.getByRole("button", { name: "Reset Adobe ID" });
+      expect(button).not.toBeDisabled();
+      await user.click(button);
+
+      await waitFor(() => expect(resetAdobeId).toHaveBeenCalledTimes(1));
+      const [data, library] = resetAdobeId.mock.calls[0];
+      expect(data.get("identifier")).toBe("1234");
+      expect(library).toBe("nypl");
+
+      // After the reset resolves the component clears the checkbox, re-disabling
+      // the button; awaiting that settles the pending promise.
+      await waitFor(() => expect(button).toBeDisabled());
+    });
+
+    it("shows a success alert message if the reset is successful", () => {
+      const { container, rerender } = renderReset({
+        patron: patrons[0],
+        resetAdobeId: jest.fn().mockResolvedValue(undefined),
+      });
+      expect(container.querySelector(".alert-success")).not.toBeInTheDocument();
+
+      // The response now comes from the server (via the responseBody prop).
+      rerender(
+        resetElement({
+          patron: patrons[0],
+          responseBody: "Adobe ID for patron has been reset.",
+        })
+      );
+
+      const alert = container.querySelector(".alert-success");
+      expect(alert).toBeInTheDocument();
+      expect(alert).toHaveTextContent("Adobe ID for patron has been reset.");
+      expect(alert).toHaveTextContent(
+        "Please instruct the patron to sign back into their account."
+      );
+    });
+
+    it("hides the checkbox and the reset button if the reset is successful", () => {
+      const { container, rerender } = renderReset({
+        patron: patrons[0],
+        resetAdobeId: jest.fn().mockResolvedValue(undefined),
+      });
+      expect(
+        container.querySelector(".reset-adobe-id input")
+      ).toBeInTheDocument();
+      expect(
+        container.querySelector(".reset-adobe-id button")
+      ).toBeInTheDocument();
+
+      rerender(
+        resetElement({
+          patron: patrons[0],
+          responseBody: "Adobe ID for patron has been reset.",
+        })
+      );
+
+      expect(
+        container.querySelector(".reset-adobe-id input")
+      ).not.toBeInTheDocument();
+      expect(
+        container.querySelector(".reset-adobe-id button")
+      ).not.toBeInTheDocument();
+    });
+
+    it("shows a failure alert message if the reset fails", () => {
+      const fetchError = { status: 400, response: "", url: "" };
+      // The legacy test modeled the failing action with a rejecting stub; the
+      // failure alert itself is driven by the fetchError prop the reducer sets.
+      const { container, rerender } = renderReset({
+        patron: patrons[0],
+        resetAdobeId: jest.fn().mockRejectedValue(fetchError),
+      });
+      expect(container.querySelector(".alert-danger")).not.toBeInTheDocument();
+
+      rerender(
+        resetElement({
+          patron: patrons[0],
+          resetAdobeId: jest.fn().mockRejectedValue(fetchError),
+          fetchError,
+        })
+      );
+
+      const alert = container.querySelector(".alert-danger");
+      expect(alert).toBeInTheDocument();
+      expect(alert).toHaveTextContent(
+        "Error: failed to reset Adobe ID for patron 1234"
+      );
+    });
+
+    it("updates the warning message if a new patron is searched and found", () => {
+      const { container, rerender } = renderReset({
+        patron: patrons[0],
+        resetAdobeId: jest.fn(),
+      });
+      expect(container.querySelector(".patron-warning")).toHaveTextContent(
+        "IMPORTANT: Patron User Name will lose access"
+      );
+
+      rerender(resetElement({ patron: patrons[1], resetAdobeId: jest.fn() }));
+
+      expect(container.querySelector(".patron-warning")).toHaveTextContent(
+        "IMPORTANT: Patron Personal Name2 will lose access"
+      );
+    });
+
+    it("restores the checkbox and the reset button if a new patron is searched and found", () => {
+      const { container, rerender } = renderReset({
+        patron: patrons[0],
+        responseBody: "Adobe ID for patron has been reset.",
+        resetAdobeId: jest.fn(),
+      });
+      expect(
+        container.querySelector(".reset-adobe-id input")
+      ).not.toBeInTheDocument();
+      expect(
+        container.querySelector(".reset-adobe-id button")
+      ).not.toBeInTheDocument();
+
+      rerender(
+        resetElement({
+          patron: patrons[0],
+          responseBody: "",
+          resetAdobeId: jest.fn(),
+        })
+      );
+
+      expect(
+        container.querySelector(".reset-adobe-id input")
+      ).toBeInTheDocument();
+      expect(
+        container.querySelector(".reset-adobe-id button")
+      ).toBeInTheDocument();
+    });
+  });
+
+  describe("connected (default export)", () => {
+    it("wires state and dispatch through connect", async () => {
+      // Defensive: nothing fetches on this mount, but stub fetch so any stray
+      // request settles rather than crashing the strict worker.
+      jest.spyOn(globalThis, "fetch").mockResolvedValue(
+        new Response(JSON.stringify({}), {
+          status: 200,
+          headers: { "Content-Type": "application/json" },
+        })
+      );
+
+      renderWithProviders(
+        <ConnectedResetAdobeId
+          store={buildStore()}
+          csrfToken="token"
+          library="nypl"
+        />
+      );
+
+      // With no patron in the store, mapStateToProps yields patron=undefined and
+      // the connected component prompts the user to search.
+      expect(
+        await screen.findByRole("heading", { name: "Reset Adobe ID" })
+      ).toBeInTheDocument();
+      expect(
+        screen.getByText("Search for a patron to begin.")
+      ).toBeInTheDocument();
+    });
+  });
+});