@applicaster/zapp-react-native-utils 16.0.0-alpha.6861239588 → 16.0.0-alpha.6918106967

package/modalState/__tests__/RemoteEditableCollection.test.ts

@@ -0,0 +1,326 @@
+import { RemoteEditableCollection } from "../RemoteEditableCollection";
+import { actionExecutor } from "../../actionsExecutor/ActionExecutor";
+import type { Content, MenuItem } from "../types";
+
+jest.mock("../../actionsExecutor/ActionExecutor", () => ({
+  actionExecutor: { handleAction: jest.fn() },
+  ActionResult: { Success: "success", Error: "error" },
+}));
+
+const handleAction = actionExecutor.handleAction as jest.Mock;
+
+/**
+ * BehaviorSubject emits its current value synchronously on subscribe, so this
+ * returns the latest items snapshot.
+ */
+function currentItems(col: RemoteEditableCollection): MenuItem[] {
+  let items: MenuItem[] = [];
+  const sub = col.items$.subscribe((i) => (items = i));
+  sub.unsubscribe();
+
+  return items;
+}
+
+const removeAction = { type: "sendCloudEvent", options: { foo: "bar" } };
+
+const itemWithRemove: MenuItem = {
+  id: "1",
+  title: "A",
+  entryActions: [{ button: { alias: "remove_item" }, actions: [removeAction] }],
+};
+
+const itemPlain: MenuItem = { id: "2", title: "B" };
+
+function makeCollection(
+  items: MenuItem[],
+  refetch = jest.fn().mockResolvedValue(undefined),
+  operations = ["remove", "reorder"]
+) {
+  const content = {
+    items,
+    dynamicCollection: { operations, postUrl: "https://x/cloud-events" },
+  } as unknown as Content;
+
+  return { col: new RemoteEditableCollection(content, refetch), refetch };
+}
+
+describe("RemoteEditableCollection", () => {
+  beforeEach(() => jest.clearAllMocks());
+
+  it("exposes the declared operations and initial items", () => {
+    const { col } = makeCollection([itemWithRemove, itemPlain]);
+
+    expect(col.operations).toEqual(["remove", "reorder"]);
+    expect(currentItems(col)).toEqual([itemWithRemove, itemPlain]);
+  });
+
+  describe("remove", () => {
+    it("optimistically removes, dispatches the aliased action, then refetches", async () => {
+      handleAction.mockResolvedValue("success");
+      const { col, refetch } = makeCollection([itemWithRemove, itemPlain]);
+
+      await col.remove(0);
+
+      expect(handleAction).toHaveBeenCalledWith(removeAction, {
+        entry: itemWithRemove,
+      });
+
+      expect(refetch).toHaveBeenCalledTimes(1);
+      expect(currentItems(col)).toEqual([itemPlain]);
+    });
+
+    it("rolls back to the snapshot when the action dispatch fails", async () => {
+      handleAction.mockRejectedValue(new Error("network"));
+      const { col, refetch } = makeCollection([itemWithRemove, itemPlain]);
+
+      await col.remove(0);
+
+      // optimistic removal reverted
+      expect(currentItems(col)).toEqual([itemWithRemove, itemPlain]);
+      // refetch never reached on failure
+      expect(refetch).not.toHaveBeenCalled();
+    });
+
+    it("lets the refetched server result replace the optimistic list", async () => {
+      handleAction.mockResolvedValue("success");
+      const serverItems: MenuItem[] = [{ id: "99", title: "server truth" }];
+
+      const refetch = jest.fn();
+      const { col } = makeCollection([itemWithRemove, itemPlain], refetch);
+
+      // Emulate ContentViewModel.refetch pushing authoritative items via sync()
+      refetch.mockImplementation(async () => {
+        col.sync(serverItems);
+      });
+
+      await col.remove(0);
+
+      expect(currentItems(col)).toEqual(serverItems);
+    });
+
+    it("is a no-op for an out-of-range index", async () => {
+      const { col, refetch } = makeCollection([itemWithRemove]);
+
+      await col.remove(5);
+
+      expect(handleAction).not.toHaveBeenCalled();
+      expect(refetch).not.toHaveBeenCalled();
+      expect(currentItems(col)).toEqual([itemWithRemove]);
+    });
+
+    it("skips dispatch (no throw) when no matching alias exists", async () => {
+      const { col, refetch } = makeCollection([itemPlain, itemWithRemove]);
+
+      await col.remove(0); // itemPlain has no entryActions
+
+      expect(handleAction).not.toHaveBeenCalled();
+      // still optimistic-removes and refetches (server is source of truth)
+      expect(refetch).toHaveBeenCalledTimes(1);
+      expect(currentItems(col)).toEqual([itemWithRemove]);
+    });
+  });
+
+  describe("move", () => {
+    it("optimistically reorders and dispatches reorder_item with itemIds", async () => {
+      handleAction.mockResolvedValue("success");
+
+      const itemA: MenuItem = {
+        id: "2",
+        title: "B",
+        entryActions: [
+          { button: { alias: "reorder_item" }, actions: [removeAction] },
+        ],
+      };
+
+      const moved: MenuItem = {
+        id: "3",
+        title: "C",
+        entryActions: [
+          { button: { alias: "reorder_item" }, actions: [removeAction] },
+        ],
+      };
+
+      const { col, refetch } = makeCollection([moved, itemA]);
+
+      await col.move(["2", "3"]);
+
+      expect(currentItems(col)).toEqual([itemA, moved]);
+
+      expect(handleAction).toHaveBeenCalledWith(
+        {
+          ...removeAction,
+          options: {
+            ...removeAction.options,
+            itemIds: ["2", "3"],
+            data: {
+              ...removeAction.options?.data,
+              itemIds: ["2", "3"],
+            },
+          },
+        },
+        { entry: itemA }
+      );
+
+      expect(refetch).toHaveBeenCalledTimes(1);
+    });
+
+    it("rolls back on failure", async () => {
+      handleAction.mockRejectedValue(new Error("nope"));
+
+      const itemA: MenuItem = {
+        id: "2",
+        title: "B",
+        entryActions: [
+          { button: { alias: "reorder_item" }, actions: [removeAction] },
+        ],
+      };
+
+      const moved: MenuItem = {
+        id: "3",
+        title: "C",
+        entryActions: [
+          { button: { alias: "reorder_item" }, actions: [removeAction] },
+        ],
+      };
+
+      const { col } = makeCollection([moved, itemA]);
+
+      await col.move(["2", "3"]);
+
+      expect(currentItems(col)).toEqual([moved, itemA]);
+    });
+
+    it("is a no-op for empty or non-existent IDs", async () => {
+      const { col, refetch } = makeCollection([itemWithRemove, itemPlain]);
+
+      await col.move([]);
+
+      expect(refetch).not.toHaveBeenCalled();
+      expect(currentItems(col)).toEqual([itemWithRemove, itemPlain]);
+    });
+  });
+
+  describe("sync", () => {
+    it("replaces the current items with the provided list", () => {
+      const { col } = makeCollection([itemWithRemove]);
+      const next: MenuItem[] = [{ id: "7", title: "next" }];
+
+      col.sync(next);
+
+      expect(currentItems(col)).toEqual(next);
+    });
+
+    it("suppresses sync updates while a local mutation is in-flight", async () => {
+      let resolveAction: () => void = () => {};
+
+      handleAction.mockImplementation(
+        () =>
+          new Promise<void>((resolve) => {
+            resolveAction = resolve;
+          })
+      );
+
+      const { col } = makeCollection([itemWithRemove, itemPlain]);
+      const staleServerItems: MenuItem[] = [{ id: "stale", title: "Stale" }];
+
+      // Initiate optimistic removal (mutation in-flight)
+      const removePromise = col.remove(0);
+
+      // Verify optimistic state applied locally
+      expect(currentItems(col)).toEqual([itemPlain]);
+
+      // Attempt sync while mutation is in-flight
+      col.sync(staleServerItems);
+
+      // Verify sync was suppressed and optimistic state remained
+      expect(currentItems(col)).toEqual([itemPlain]);
+
+      // Resolve the in-flight mutation
+      resolveAction();
+      await removePromise;
+
+      // After mutation completes, sync applies normally
+      const freshServerItems: MenuItem[] = [{ id: "fresh", title: "Fresh" }];
+      col.sync(freshServerItems);
+
+      expect(currentItems(col)).toEqual(freshServerItems);
+    });
+  });
+
+  describe("deleteCollection", () => {
+    it("optimistically clears items and calls refetch", async () => {
+      handleAction.mockResolvedValue("success");
+      const { col, refetch } = makeCollection([itemWithRemove, itemPlain]);
+
+      await col.deleteCollection();
+
+      expect(currentItems(col)).toEqual([]);
+      expect(refetch).toHaveBeenCalledTimes(1);
+    });
+
+    it("dispatches aliased action when first item contains delete_collection alias", async () => {
+      handleAction.mockResolvedValue("success");
+
+      const deleteAction = {
+        type: "sendCloudEvent",
+        options: { subject: "delete_collection" },
+      };
+
+      const itemWithDelete: MenuItem = {
+        id: "100",
+        title: "Collection Item",
+        entryActions: [
+          {
+            button: { alias: "delete_collection" },
+            actions: [deleteAction],
+          },
+        ],
+      };
+
+      const { col, refetch } = makeCollection([itemWithDelete]);
+
+      await col.deleteCollection();
+
+      expect(handleAction).toHaveBeenCalledWith(deleteAction, {
+        entry: itemWithDelete,
+      });
+
+      expect(refetch).toHaveBeenCalledTimes(1);
+      expect(currentItems(col)).toEqual([]);
+    });
+  });
+
+  describe("add", () => {
+    it("dispatches actions from dynamicCollection.events.add and refetches", async () => {
+      handleAction.mockResolvedValue("success");
+
+      const addAction = {
+        type: "sendCloudEvent",
+        options: {
+          url: "https://x/cloud-events",
+          type: "com.applicaster.collection.create.v1",
+          subject: "create_collection",
+        },
+      };
+
+      const content = {
+        items: [],
+        dynamicCollection: {
+          operations: ["add"],
+          postUrl: "https://x/cloud-events",
+          events: {
+            add: [addAction],
+          },
+        },
+      } as any;
+
+      const refetch = jest.fn().mockResolvedValue(undefined);
+      const col = new RemoteEditableCollection(content, refetch);
+
+      await col.add();
+
+      expect(handleAction).toHaveBeenCalledWith(addAction);
+      expect(refetch).toHaveBeenCalledTimes(1);
+    });
+  });
+});

package/modalState/__tests__/index.test.ts

@@ -1,4 +1,4 @@
-import { modalStore } from "../";
+import { modalStore, getMenuItemActions } from "../";
 
 describe("Modal State", () => {
   it("should have initial state", () => {
@@ -48,4 +48,33 @@ describe("Modal State", () => {
       });
     });
   });
+
+  describe("getMenuItemActions", () => {
+    it("returns actions array when actions is provided", () => {
+      const actions = [{ type: "action1" }, { type: "action2" }];
+      const item = { id: "1", title: "Item", actions };
+
+      expect(getMenuItemActions(item)).toEqual(actions);
+    });
+
+    it("returns [action] when single action is provided", () => {
+      const action = { type: "action1" };
+      const item = { id: "1", title: "Item", action };
+
+      expect(getMenuItemActions(item)).toEqual([action]);
+    });
+
+    it("returns action when action is passed as an array", () => {
+      const actions = [{ type: "action1" }];
+      const item = { id: "1", title: "Item", action: actions as any };
+
+      expect(getMenuItemActions(item)).toEqual(actions);
+    });
+
+    it("returns empty array when no action or actions are provided", () => {
+      expect(getMenuItemActions({ id: "1", title: "Item" })).toEqual([]);
+      expect(getMenuItemActions(null)).toEqual([]);
+      expect(getMenuItemActions(undefined)).toEqual([]);
+    });
+  });
 });

package/modalState/__tests__/useBottomSheetContent.test.ts

@@ -0,0 +1,349 @@
+import { renderHook, act, waitFor } from "@testing-library/react-native";
+
+import { modalOrchestrator } from "../ModalOrchestrator";
+import { MenuItem } from "../types";
+import { useBottomSheetContent } from "../useBottomSheetContent";
+import type { ContentState } from "../ContentViewModel";
+
+jest.mock("../ModalOrchestrator", () => ({
+  isPresentSubMenuAction: jest.requireActual("../types").isPresentSubMenuAction,
+  modalOrchestrator: {
+    canGoBack: false,
+    back: jest.fn(),
+    close: jest.fn(),
+  },
+}));
+
+type MockViewModel = {
+  getState: jest.Mock<ContentState, []>;
+  subscribe: jest.Mock<(listener: (state: ContentState) => void) => () => void>;
+  refetch: jest.Mock<Promise<void>, []>;
+};
+
+const createViewModel = (
+  initialState: ContentState
+): MockViewModel & {
+  emit: (nextState: ContentState) => void;
+} => {
+  let listener: ((state: ContentState) => void) | undefined;
+  const unsubscribe = jest.fn();
+
+  const viewModel: MockViewModel & { emit: (nextState: ContentState) => void } =
+    {
+      getState: jest.fn(() => initialState),
+      subscribe: jest.fn((nextListener) => {
+        listener = nextListener;
+
+        return unsubscribe;
+      }),
+      refetch: jest.fn().mockResolvedValue(undefined),
+      emit: (nextState) => {
+        listener?.(nextState);
+      },
+    };
+
+  return viewModel;
+};
+
+describe("useBottomSheetContent", () => {
+  const onPress = jest.fn().mockResolvedValue(undefined);
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    modalOrchestrator.canGoBack = false;
+  });
+
+  it("returns initial state from the view model", () => {
+    const viewModel = createViewModel({
+      items: [{ title: "Item 1" }],
+      isLoading: false,
+    });
+
+    const { result } = renderHook(() =>
+      useBottomSheetContent({ viewModel: viewModel as any, onPress })
+    );
+
+    expect(result.current.items).toEqual([{ title: "Item 1" }]);
+    expect(result.current.isLoading).toBe(false);
+    expect(result.current.error).toBeUndefined();
+    expect(result.current.showCentralLoading).toBe(false);
+    expect(result.current.canGoBack).toBe(false);
+    expect(viewModel.subscribe).toHaveBeenCalledTimes(1);
+  });
+
+  it("computes showCentralLoading when loading with no items", () => {
+    const viewModel = createViewModel({
+      items: [],
+      isLoading: true,
+    });
+
+    const { result } = renderHook(() =>
+      useBottomSheetContent({ viewModel: viewModel as any, onPress })
+    );
+
+    expect(result.current.showCentralLoading).toBe(true);
+  });
+
+  it("does not show central loading when items exist while loading", () => {
+    const viewModel = createViewModel({
+      items: [{ title: "Item 1" }],
+      isLoading: true,
+    });
+
+    const { result } = renderHook(() =>
+      useBottomSheetContent({ viewModel: viewModel as any, onPress })
+    );
+
+    expect(result.current.showCentralLoading).toBe(false);
+  });
+
+  it("updates when the view model emits new state", () => {
+    const viewModel = createViewModel({
+      items: [],
+      isLoading: true,
+    });
+
+    const { result } = renderHook(() =>
+      useBottomSheetContent({ viewModel: viewModel as any, onPress })
+    );
+
+    act(() => {
+      viewModel.emit({
+        items: [{ title: "Fetched Item" }],
+        isLoading: false,
+      });
+    });
+
+    expect(result.current.items).toEqual([{ title: "Fetched Item" }]);
+    expect(result.current.isLoading).toBe(false);
+    expect(result.current.showCentralLoading).toBe(false);
+  });
+
+  it("exposes error state from the view model", () => {
+    const viewModel = createViewModel({
+      items: [],
+      isLoading: false,
+      error: "Network Error",
+    });
+
+    const { result } = renderHook(() =>
+      useBottomSheetContent({ viewModel: viewModel as any, onPress })
+    );
+
+    expect(result.current.error).toBe("Network Error");
+  });
+
+  it("unsubscribes from the view model on unmount", () => {
+    const viewModel = createViewModel({
+      items: [],
+      isLoading: false,
+    });
+
+    const { unmount } = renderHook(() =>
+      useBottomSheetContent({ viewModel: viewModel as any, onPress })
+    );
+
+    const unsubscribeFn = viewModel.subscribe.mock.results[0]
+      .value as jest.Mock;
+
+    unmount();
+
+    expect(unsubscribeFn).toHaveBeenCalledTimes(1);
+  });
+
+  describe("handleItemPress", () => {
+    it("delegates to onPress and refetches for leaf items", async () => {
+      const viewModel = createViewModel({
+        items: [{ title: "Leaf" }],
+        isLoading: false,
+      });
+
+      const item: MenuItem = { title: "Leaf" };
+
+      const { result } = renderHook(() =>
+        useBottomSheetContent({ viewModel: viewModel as any, onPress })
+      );
+
+      await act(async () => {
+        await result.current.handleItemPress(item);
+      });
+
+      expect(onPress).toHaveBeenCalledWith(item);
+      expect(viewModel.refetch).toHaveBeenCalledTimes(1);
+    });
+
+    it("does not refetch when the item opens a present submenu action", async () => {
+      const viewModel = createViewModel({
+        items: [{ title: "Parent" }],
+        isLoading: false,
+      });
+
+      const item: MenuItem = {
+        title: "Parent",
+        action: {
+          type: "presentSubMenu",
+          menu: {
+            content: {
+              title: "Submenu",
+              items: [{ title: "Child" }],
+            },
+          },
+        },
+      };
+
+      const { result } = renderHook(() =>
+        useBottomSheetContent({ viewModel: viewModel as any, onPress })
+      );
+
+      await act(async () => {
+        await result.current.handleItemPress(item);
+      });
+
+      expect(onPress).toHaveBeenCalledWith(item);
+      expect(viewModel.refetch).not.toHaveBeenCalled();
+    });
+
+    it("awaits onPress before refetching", async () => {
+      const viewModel = createViewModel({
+        items: [{ title: "Leaf" }],
+        isLoading: false,
+      });
+
+      const item: MenuItem = { title: "Leaf" };
+      const callOrder: string[] = [];
+
+      onPress.mockImplementation(async () => {
+        callOrder.push("onPress");
+      });
+
+      viewModel.refetch.mockImplementation(async () => {
+        callOrder.push("refetch");
+      });
+
+      const { result } = renderHook(() =>
+        useBottomSheetContent({ viewModel: viewModel as any, onPress })
+      );
+
+      await act(async () => {
+        await result.current.handleItemPress(item);
+      });
+
+      expect(callOrder).toEqual(["onPress", "refetch"]);
+    });
+  });
+
+  describe("goBackOrClose", () => {
+    it("calls back when the orchestrator can go back", () => {
+      modalOrchestrator.canGoBack = true;
+
+      const viewModel = createViewModel({
+        items: [],
+        isLoading: false,
+      });
+
+      const { result } = renderHook(() =>
+        useBottomSheetContent({ viewModel: viewModel as any, onPress })
+      );
+
+      act(() => {
+        result.current.goBackOrClose();
+      });
+
+      expect(modalOrchestrator.back).toHaveBeenCalledTimes(1);
+      expect(modalOrchestrator.close).not.toHaveBeenCalled();
+    });
+
+    it("calls close when the orchestrator cannot go back", () => {
+      modalOrchestrator.canGoBack = false;
+
+      const viewModel = createViewModel({
+        items: [],
+        isLoading: false,
+      });
+
+      const { result } = renderHook(() =>
+        useBottomSheetContent({ viewModel: viewModel as any, onPress })
+      );
+
+      act(() => {
+        result.current.goBackOrClose();
+      });
+
+      expect(modalOrchestrator.close).toHaveBeenCalledTimes(1);
+      expect(modalOrchestrator.back).not.toHaveBeenCalled();
+    });
+  });
+
+  it("exposes close from the modal orchestrator", () => {
+    const viewModel = createViewModel({
+      items: [],
+      isLoading: false,
+    });
+
+    const { result } = renderHook(() =>
+      useBottomSheetContent({ viewModel: viewModel as any, onPress })
+    );
+
+    act(() => {
+      result.current.close();
+    });
+
+    expect(modalOrchestrator.close).toHaveBeenCalledTimes(1);
+  });
+
+  it("reflects canGoBack from the modal orchestrator", () => {
+    modalOrchestrator.canGoBack = true;
+
+    const viewModel = createViewModel({
+      items: [],
+      isLoading: false,
+    });
+
+    const { result } = renderHook(() =>
+      useBottomSheetContent({ viewModel: viewModel as any, onPress })
+    );
+
+    expect(result.current.canGoBack).toBe(true);
+  });
+
+  it("resubscribes when the view model instance changes", async () => {
+    const firstViewModel = createViewModel({
+      items: [{ title: "First" }],
+      isLoading: false,
+    });
+
+    const secondViewModel = createViewModel({
+      items: [{ title: "Second" }],
+      isLoading: false,
+    });
+
+    const { result, rerender } = renderHook(
+      ({ viewModel }) =>
+        useBottomSheetContent({ viewModel: viewModel as any, onPress }),
+      {
+        initialProps: { viewModel: firstViewModel },
+      }
+    );
+
+    expect(result.current.items).toEqual([{ title: "First" }]);
+
+    rerender({ viewModel: secondViewModel });
+
+    expect(
+      firstViewModel.subscribe.mock.results[0].value
+    ).toHaveBeenCalledTimes(1);
+
+    expect(secondViewModel.subscribe).toHaveBeenCalledTimes(1);
+
+    act(() => {
+      secondViewModel.emit({
+        items: [{ title: "Updated Second" }],
+        isLoading: false,
+      });
+    });
+
+    await waitFor(() => {
+      expect(result.current.items).toEqual([{ title: "Updated Second" }]);
+    });
+  });
+});