@thepalaceproject/circulation-admin 1.46.0 → 1.47.0

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

@@ -4,6 +4,7 @@ import { render, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 
 import ServiceEditForm, {
+  libraryRefKey,
   ServiceEditFormProps,
   ServiceEditFormState,
 } from "../../../src/components/ServiceEditForm";
@@ -483,6 +484,91 @@ describe("ServiceEditForm", () => {
       expect(container.querySelector(".with-edit-button a")).toBeNull();
     });
 
+    it("shows a loading indicator in the Libraries panel until allLibraries arrives", () => {
+      // Undefined allLibraries means the library list is still loading.
+      const dataStillLoading = Object.assign({}, servicesData, {
+        allLibraries: undefined,
+      });
+      const { container, rerender } = renderForm({
+        data: dataStillLoading,
+        item: serviceData,
+      });
+      expect(container.querySelector(".update-libraries")).toBeNull();
+      expect(container.querySelector('[role="status"]')).toHaveTextContent(
+        "Loading libraries..."
+      );
+
+      rerenderForm(rerender, { item: serviceData });
+      // The status line stays mounted and announces completion; the
+      // completion text is visually hidden.
+      const status = container.querySelector('[role="status"]');
+      expect(status).toHaveTextContent("Libraries loaded.");
+      expect(status).toHaveClass("visuallyHidden");
+      const editable = container.querySelectorAll(".with-edit-button");
+      expect(editable).toHaveLength(1);
+      expect(editable[0]).toHaveTextContent("New York Public Library - nypl");
+    });
+
+    it("explains a failed library list load in the Libraries panel", () => {
+      // On failure allLibraries settles to [] and allLibrariesError is set.
+      const dataWithError = Object.assign({}, servicesData, {
+        allLibraries: [],
+        allLibrariesError: {
+          status: 500,
+          response: "nope",
+          url: "/admin/libraries",
+        },
+      });
+      const { container } = renderForm({
+        data: dataWithError,
+        item: serviceData,
+      });
+      expect(container.querySelector(".alert-danger")).toHaveTextContent(
+        "The library list failed to load"
+      );
+      // The role="alert" danger Alert announces the failure itself, so the
+      // status region empties rather than duplicating the announcement.
+      expect(container.querySelector('[role="status"]')).toBeEmptyDOMElement();
+      // The associated library still renders, by short name.
+      const editable = container.querySelectorAll(".with-edit-button");
+      expect(editable).toHaveLength(1);
+      expect(editable[0]).toHaveTextContent("nypl");
+      // A removal could not be undone in-session, so it is disabled too.
+      expect(container.querySelector("button.remove-btn")).toBeDisabled();
+    });
+
+    it("warns when the library list could not be refreshed", () => {
+      const staleData = Object.assign({}, servicesData, {
+        allLibrariesRefreshError: {
+          status: 500,
+          response: "nope",
+          url: "/admin/libraries",
+        },
+      });
+      const { container } = renderForm({ data: staleData, item: serviceData });
+      expect(container.querySelector(".alert-warning")).toHaveTextContent(
+        "The library list could not be refreshed"
+      );
+      // The role="alert" warning announces the refresh failure itself, so
+      // the status region empties rather than duplicating the announcement.
+      expect(container.querySelector('[role="status"]')).toBeEmptyDOMElement();
+      // The stale list still renders in full, links included, and the
+      // panel stays editable; only the blocking error disables removal.
+      const editable = container.querySelectorAll(".with-edit-button");
+      expect(editable).toHaveLength(1);
+      expect(editable[0]).toHaveTextContent("New York Public Library - nypl");
+      expect(container.querySelector(".alert-danger")).toBeNull();
+      expect(container.querySelector("button.remove-btn")).toBeEnabled();
+    });
+
+    it("says when no libraries are configured", () => {
+      const emptyData = Object.assign({}, servicesData, { allLibraries: [] });
+      const { container } = renderForm({ data: emptyData });
+      expect(container.querySelector(".update-libraries")).toHaveTextContent(
+        "No libraries are configured."
+      );
+    });
+
     it("renders removable and editable libraries", () => {
       const { container, unmount } = renderForm();
       expect(container.querySelectorAll(".with-remove-button")).toHaveLength(0);
@@ -896,6 +982,27 @@ describe("ServiceEditForm", () => {
       expect(libraries).toHaveLength(0);
     });
 
+    it("removes an expanded library and closes its settings", async () => {
+      const user = userEvent.setup();
+      const { container } = renderForm({ item: serviceData });
+      const libraryItem = container.querySelector(
+        ".with-remove-button"
+      ) as HTMLElement;
+
+      await user.click(
+        libraryItem.querySelector("button.edit-btn") as HTMLElement
+      );
+      expect(
+        container.querySelector(".edit-library-settings")
+      ).toBeInTheDocument();
+
+      await user.click(
+        libraryItem.querySelector("button.remove-btn") as HTMLElement
+      );
+      expect(container.querySelectorAll(".with-remove-button")).toHaveLength(0);
+      expect(container.querySelector(".edit-library-settings")).toBeNull();
+    });
+
     it("edits a library", async () => {
       const user = userEvent.setup();
       const { container } = renderForm({ item: serviceData });
@@ -978,6 +1085,15 @@ describe("ServiceEditForm", () => {
       ).toBe("option3");
     });
 
+    it("builds library ref keys for add and edit mode", () => {
+      expect(libraryRefKey("key", "add")).toBe("key");
+      expect(libraryRefKey("key", "edit", "nypl")).toBe("nypl_key");
+      // Compile-time guard: ts-jest fails this file if the overloads stop
+      // rejecting an edit-mode call with no short name.
+      // @ts-expect-error edit mode must pass the library short name
+      libraryRefKey("key", "edit");
+    });
+
     it("calls save when the form is submitted", async () => {
       // The reusable Form wires submission solely through its submit button's
       // onClick, so clicking it is the only way to submit; assert the resulting
@@ -1059,6 +1175,28 @@ describe("ServiceEditForm", () => {
       expect(nameInput().value).toBe("");
     });
 
+    it("clears every associated library after a successful save (PP-5153)", () => {
+      const threeLibraries = {
+        ...serviceData,
+        libraries: [
+          { short_name: "nypl" },
+          { short_name: "bpl" },
+          { short_name: "qpl" },
+        ],
+      };
+      const { container, rerender } = renderForm({ item: threeLibraries });
+      expect(container.querySelectorAll(".with-remove-button")).toHaveLength(3);
+
+      // clearForm fires onRemove once per library inside one React batch.
+      // Each removal must build on the previous one, otherwise only the last
+      // one survives and the other libraries stay in the list.
+      rerenderForm(rerender, {
+        item: threeLibraries,
+        responseBody: "new service",
+      });
+      expect(container.querySelectorAll(".with-remove-button")).toHaveLength(0);
+    });
+
     it("doesn't clear the form if there's an error message", async () => {
       const user = userEvent.setup();
       const { container, rerender } = renderForm();

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

@@ -6,13 +6,16 @@ import SetupPage from "../../../src/components/SetupPage";
 
 describe("SetupPage", () => {
   beforeEach(() => {
-    // SetupPage renders the connected IndividualAdmins list, which fetches the
-    // admin list on mount. Stub fetch so mounting does not hit the network.
-    jest.spyOn(globalThis, "fetch").mockResolvedValue(
-      new Response(JSON.stringify({ individualAdmins: [] }), {
-        status: 200,
-        headers: { "Content-Type": "application/json" },
-      })
+    // SetupPage renders the connected IndividualAdmins list, which fetches on
+    // mount. Stub fetch so mounting does not hit the network; a Response body
+    // can only be read once, so build one per call.
+    jest.spyOn(globalThis, "fetch").mockImplementation(() =>
+      Promise.resolve(
+        new Response(JSON.stringify({ individualAdmins: [] }), {
+          status: 200,
+          headers: { "Content-Type": "application/json" },
+        })
+      )
     );
   });
 
@@ -37,5 +40,19 @@ describe("SetupPage", () => {
         name: "Set up your system admin account",
       })
     ).toBeInTheDocument();
+
+    // settingUp skips the libraries request, which cannot succeed before an
+    // admin exists. The positive check keeps the negative one honest.
+    const urls = (globalThis.fetch as jest.Mock).mock.calls.map((call) =>
+      String(call[0])
+    );
+    expect(urls).toEqual(
+      expect.arrayContaining([
+        expect.stringContaining("/admin/individual_admins"),
+      ])
+    );
+    expect(urls).not.toEqual(
+      expect.arrayContaining([expect.stringContaining("/admin/libraries")])
+    );
   });
 });

package/tests/jest/reducers/libraries.test.ts

@@ -0,0 +1,171 @@
+import libraries from "../../../src/reducers/libraries";
+import ActionCreator from "../../../src/actions";
+
+const REQUEST = `${ActionCreator.LIBRARIES}_${ActionCreator.REQUEST}`;
+const FAILURE = `${ActionCreator.LIBRARIES}_${ActionCreator.FAILURE}`;
+const SUCCESS = `${ActionCreator.LIBRARIES}_${ActionCreator.SUCCESS}`;
+const LOAD = `${ActionCreator.LIBRARIES}_${ActionCreator.LOAD}`;
+const EDIT_REQUEST = `${ActionCreator.EDIT_LIBRARY}_${ActionCreator.REQUEST}`;
+const EDIT_SUCCESS = `${ActionCreator.EDIT_LIBRARY}_${ActionCreator.SUCCESS}`;
+
+describe("libraries reducer", () => {
+  const fetchError = { status: 500, response: "nope", url: "/admin/libraries" };
+
+  it("clears state on a first-load request", () => {
+    const state = libraries(undefined, { type: REQUEST });
+    expect(state.isFetching).toBe(true);
+    expect(state.isLoaded).toBe(false);
+    expect(state.fetchError).toBeNull();
+  });
+
+  it("moves the previous failure to lastFetchError while a retry is in flight", () => {
+    const failed = libraries(undefined, { type: FAILURE, error: fetchError });
+    expect(failed.fetchError).toEqual(fetchError);
+    expect(failed.isLoaded).toBe(true);
+
+    const retrying = libraries(failed, { type: REQUEST });
+    expect(retrying.isFetching).toBe(true);
+    // fetchError keeps meaning "the current request failed"; the old
+    // failure moves to lastFetchError so consumers can keep showing it.
+    expect(retrying.fetchError).toBeNull();
+    expect(retrying.lastFetchError).toEqual(fetchError);
+    expect(retrying.isLoaded).toBe(false);
+  });
+
+  it("retains the loaded list as lastData while a refetch is in flight", () => {
+    const data = { libraries: [{ short_name: "nypl" }] };
+    let state = libraries(undefined, { type: LOAD, data });
+    state = libraries(state, { type: REQUEST });
+
+    expect(state.isFetching).toBe(true);
+    // data keeps its normal lifecycle (nulled by REQUEST) for the Libraries
+    // config page; the retained copy moves to lastData.
+    expect(state.data).toBeNull();
+    expect(state.isLoaded).toBe(false);
+    expect(state.lastData).toEqual(data);
+  });
+
+  it("keeps lastData through a failed refetch and clears it on a fresh load", () => {
+    const data = { libraries: [{ short_name: "nypl" }] };
+    let state = libraries(undefined, { type: LOAD, data });
+    state = libraries(state, { type: REQUEST });
+    state = libraries(state, { type: FAILURE, error: fetchError });
+    expect(state.lastData).toEqual(data);
+    expect(state.fetchError).toEqual(fetchError);
+
+    state = libraries(state, { type: REQUEST });
+    state = libraries(state, { type: SUCCESS });
+    state = libraries(state, { type: LOAD, data });
+    expect(state.lastData).toBeNull();
+    expect(state.data).toEqual(data);
+  });
+
+  it("drops a failure recorded beside current data when a refetch starts", () => {
+    // Overlapping requests with mixed outcomes leave data plus fetchError.
+    // Consumers ignore that failure, so it must not resurface against the
+    // retained copy while the next refetch runs.
+    const data = { libraries: [{ short_name: "nypl" }] };
+    let state = libraries(undefined, { type: LOAD, data });
+    state = libraries(state, { type: FAILURE, error: fetchError });
+    expect(state.data).toEqual(data);
+    expect(state.fetchError).toEqual(fetchError);
+
+    state = libraries(state, { type: REQUEST });
+    expect(state.lastData).toEqual(data);
+    expect(state.lastFetchError).toBeNull();
+  });
+
+  it("keeps lastFetchError when a second request starts before the retry settles", () => {
+    // The header's fetch and the Libraries tab's fetch can overlap.
+    let state = libraries(undefined, { type: FAILURE, error: fetchError });
+    state = libraries(state, { type: REQUEST });
+    state = libraries(state, { type: REQUEST });
+
+    expect(state.fetchError).toBeNull();
+    expect(state.lastFetchError).toEqual(fetchError);
+  });
+
+  it("keeps lastFetchError through a retry's SUCCESS until LOAD", () => {
+    let state = libraries(undefined, { type: FAILURE, error: fetchError });
+    state = libraries(state, { type: REQUEST });
+    state = libraries(state, { type: SUCCESS });
+
+    expect(state.data).toBeNull();
+    expect(state.isLoaded).toBe(false);
+    expect(state.fetchError).toBeNull();
+    expect(state.lastFetchError).toEqual(fetchError);
+  });
+
+  it("clears the old failure once a retry succeeds", () => {
+    const data = { libraries: [{ short_name: "nypl" }] };
+    let state = libraries(undefined, { type: FAILURE, error: fetchError });
+    state = libraries(state, { type: REQUEST });
+    state = libraries(state, { type: SUCCESS });
+    state = libraries(state, { type: LOAD, data });
+
+    expect(state.fetchError).toBeNull();
+    expect(state.lastFetchError).toBeNull();
+    expect(state.isLoaded).toBe(true);
+    expect(state.data).toEqual(data);
+  });
+
+  it("keeps a list-fetch failure when a library form submit starts", () => {
+    // EDIT_LIBRARY_REQUEST shares this reducer and clears fetchError; the
+    // failure must survive as lastFetchError so consumers do not mistake
+    // the state for a cleanly loaded list.
+    let state = libraries(undefined, { type: FAILURE, error: fetchError });
+    state = libraries(state, { type: EDIT_REQUEST });
+
+    expect(state.fetchError).toBeNull();
+    expect(state.lastFetchError).toEqual(fetchError);
+  });
+
+  it("keeps an already-retained failure when a library form submit starts", () => {
+    let state = libraries(undefined, { type: FAILURE, error: fetchError });
+    state = libraries(state, { type: REQUEST });
+    state = libraries(state, { type: EDIT_REQUEST });
+
+    expect(state.lastFetchError).toEqual(fetchError);
+  });
+
+  it("does not invent a failure when a library form submit starts cleanly", () => {
+    const state = libraries(undefined, { type: EDIT_REQUEST });
+    expect(state.lastFetchError).toBeNull();
+  });
+
+  it("keeps a list-fetch failure when a library form submit succeeds", () => {
+    // A list refetch can fail between EDIT_LIBRARY_REQUEST and its
+    // SUCCESS, and the base reducer's SUCCESS also clears fetchError.
+    let state = libraries(undefined, { type: REQUEST });
+    state = libraries(state, { type: EDIT_REQUEST });
+    state = libraries(state, { type: FAILURE, error: fetchError });
+    state = libraries(state, { type: EDIT_SUCCESS });
+
+    expect(state.fetchError).toBeNull();
+    expect(state.lastFetchError).toEqual(fetchError);
+  });
+
+  it("drops a failure beside current data when a library form submit starts", () => {
+    // Same rule as LIBRARIES_REQUEST: consumers ignore that failure.
+    const data = { libraries: [{ short_name: "nypl" }] };
+    let state = libraries(undefined, { type: LOAD, data });
+    state = libraries(state, { type: FAILURE, error: fetchError });
+    state = libraries(state, { type: EDIT_REQUEST });
+
+    expect(state.lastFetchError).toBeNull();
+  });
+
+  it("reports only the new failure when a retry fails again", () => {
+    const newError = {
+      status: 502,
+      response: "worse",
+      url: "/admin/libraries",
+    };
+    let state = libraries(undefined, { type: FAILURE, error: fetchError });
+    state = libraries(state, { type: REQUEST });
+    state = libraries(state, { type: FAILURE, error: newError });
+
+    expect(state.fetchError).toEqual(newError);
+    expect(state.lastFetchError).toBeNull();
+  });
+});

package/tests/jest/utils/allLibraries.test.ts

@@ -0,0 +1,235 @@
+import {
+  fetchLibrariesIfNeeded,
+  settledAllLibraries,
+} from "../../../src/utils/allLibraries";
+
+describe("settledAllLibraries", () => {
+  const libraries = [{ short_name: "nypl", name: "New York Public Library" }];
+  const stateWith = (librariesState) => ({
+    editor: { libraries: librariesState },
+  });
+
+  it("returns nothing while the request has not settled", () => {
+    expect(settledAllLibraries(stateWith(undefined))).toEqual({});
+    expect(
+      settledAllLibraries(
+        stateWith({ data: null, isLoaded: false, isFetching: true })
+      )
+    ).toEqual({});
+  });
+
+  it("reports not settled when isLoaded is set without a list or error", () => {
+    // EDIT_LIBRARY actions can clear fetchError while leaving isLoaded
+    // true; that state proves nothing worth showing.
+    expect(settledAllLibraries(stateWith({ isLoaded: true }))).toEqual({});
+  });
+
+  it("settles an empty loaded list", () => {
+    expect(
+      settledAllLibraries(
+        stateWith({ data: { libraries: [] }, isLoaded: true })
+      )
+    ).toEqual({
+      allLibraries: [],
+      allLibrariesError: undefined,
+      allLibrariesRefreshError: undefined,
+    });
+  });
+
+  it("returns the loaded list", () => {
+    expect(
+      settledAllLibraries(
+        stateWith({ data: { libraries }, isLoaded: true, fetchError: null })
+      )
+    ).toEqual({ allLibraries: libraries, allLibrariesError: undefined });
+  });
+
+  it("serves the retained list while a refetch is in flight", () => {
+    expect(
+      settledAllLibraries(
+        stateWith({
+          data: null,
+          isLoaded: false,
+          isFetching: true,
+          lastData: { libraries },
+        })
+      )
+    ).toEqual({
+      allLibraries: libraries,
+      allLibrariesError: undefined,
+      allLibrariesRefreshError: undefined,
+    });
+  });
+
+  it("serves the retained list plus a refresh error after a failed refetch", () => {
+    const fetchError = {
+      status: 500,
+      response: "nope",
+      url: "/admin/libraries",
+    };
+    expect(
+      settledAllLibraries(
+        stateWith({
+          data: null,
+          isLoaded: true,
+          fetchError,
+          lastData: { libraries },
+        })
+      )
+    ).toEqual({
+      allLibraries: libraries,
+      allLibrariesError: undefined,
+      allLibrariesRefreshError: fetchError,
+    });
+  });
+
+  it("ignores a failure recorded beside a current list", () => {
+    // Overlapping requests with mixed outcomes (one LOAD, one FAILURE) can
+    // leave a current list next to a recorded failure. The list on screen
+    // is up to date, so no error of either kind is reported.
+    const fetchError = {
+      status: 500,
+      response: "nope",
+      url: "/admin/libraries",
+    };
+    expect(
+      settledAllLibraries(
+        stateWith({ data: { libraries }, isLoaded: true, fetchError })
+      )
+    ).toEqual({
+      allLibraries: libraries,
+      allLibrariesError: undefined,
+      allLibrariesRefreshError: undefined,
+    });
+  });
+
+  it("settles to an empty list plus the error on failure", () => {
+    const fetchError = {
+      status: 500,
+      response: "nope",
+      url: "/admin/libraries",
+    };
+    expect(
+      settledAllLibraries(stateWith({ data: null, isLoaded: true, fetchError }))
+    ).toEqual({ allLibraries: [], allLibrariesError: fetchError });
+  });
+
+  it("keeps a previous failure settled while a retry is in flight", () => {
+    // The reducer moves the old failure to lastFetchError during a retry.
+    const lastFetchError = {
+      status: 500,
+      response: "nope",
+      url: "/admin/libraries",
+    };
+    expect(
+      settledAllLibraries(
+        stateWith({
+          data: null,
+          isLoaded: false,
+          isFetching: true,
+          fetchError: null,
+          lastFetchError,
+        })
+      )
+    ).toEqual({ allLibraries: [], allLibrariesError: lastFetchError });
+  });
+});
+
+describe("fetchLibrariesIfNeeded", () => {
+  const fetchThunk = "libraries thunk";
+  const actions = { fetchLibraries: jest.fn(() => fetchThunk) } as any;
+
+  // A dispatch that runs thunks against the given libraries state and
+  // records every other dispatched action.
+  const makeDispatch = (librariesState) => {
+    const dispatched = [];
+    const getState = () => ({ editor: { libraries: librariesState } });
+    const dispatch = (action) => {
+      if (typeof action === "function") {
+        return action(dispatch, getState);
+      }
+      dispatched.push(action);
+      return Promise.resolve();
+    };
+    return { dispatch, dispatched };
+  };
+
+  beforeEach(() => jest.clearAllMocks());
+
+  it("fetches when the list has never loaded", () => {
+    const { dispatch, dispatched } = makeDispatch(undefined);
+    fetchLibrariesIfNeeded(dispatch, actions);
+    expect(dispatched).toEqual([fetchThunk]);
+  });
+
+  it("does not fetch when the list is already loaded", () => {
+    const { dispatch, dispatched } = makeDispatch({
+      data: { libraries: [] },
+      isLoaded: true,
+      isFetching: false,
+      fetchError: null,
+    });
+    fetchLibrariesIfNeeded(dispatch, actions);
+    expect(dispatched).toEqual([]);
+  });
+
+  it("fetches when isLoaded is set without a list or error", () => {
+    // EDIT_LIBRARY actions can clear fetchError while leaving isLoaded
+    // true; there is nothing to show, so fetch.
+    const { dispatch, dispatched } = makeDispatch({
+      isLoaded: true,
+      isFetching: false,
+      fetchError: null,
+    });
+    fetchLibrariesIfNeeded(dispatch, actions);
+    expect(dispatched).toEqual([fetchThunk]);
+  });
+
+  it("retries when a retained list carries a retained failure", () => {
+    const { dispatch, dispatched } = makeDispatch({
+      data: null,
+      isLoaded: false,
+      isFetching: false,
+      fetchError: null,
+      lastData: { libraries: [] },
+      lastFetchError: {
+        status: 500,
+        response: "nope",
+        url: "/admin/libraries",
+      },
+    });
+    fetchLibrariesIfNeeded(dispatch, actions);
+    expect(dispatched).toEqual([fetchThunk]);
+  });
+
+  it("does not fetch while a request is already in flight", () => {
+    const { dispatch, dispatched } = makeDispatch({
+      isLoaded: false,
+      isFetching: true,
+      fetchError: null,
+    });
+    fetchLibrariesIfNeeded(dispatch, actions);
+    expect(dispatched).toEqual([]);
+  });
+
+  it("retries when a loaded list has a recorded failure", () => {
+    const { dispatch, dispatched } = makeDispatch({
+      data: { libraries: [] },
+      isLoaded: true,
+      isFetching: false,
+      fetchError: { status: 500, response: "nope", url: "/admin/libraries" },
+    });
+    fetchLibrariesIfNeeded(dispatch, actions);
+    expect(dispatched).toEqual([fetchThunk]);
+  });
+
+  it("retries after a failed request", () => {
+    const { dispatch, dispatched } = makeDispatch({
+      isLoaded: true,
+      isFetching: false,
+      fetchError: { status: 500, response: "nope", url: "/admin/libraries" },
+    });
+    fetchLibrariesIfNeeded(dispatch, actions);
+    expect(dispatched).toEqual([fetchThunk]);
+  });
+});