@applicaster/zapp-react-native-utils 16.0.0-rc.125 → 16.0.0-rc.126

package/actionsExecutor/__tests__/StorageActions.test.ts

@@ -0,0 +1,98 @@
+import { ActionResult } from "../ActionExecutor";
+import { localStorageToggleFlag } from "../StorageActions";
+import { TOGGLE_FLAG_MAX_ITEMS_REACHED_EVENT } from "../consts";
+import { postEvent } from "../../reactHooks/useSubscriberFor";
+
+jest.mock("../ActionExecutorContext", () => ({
+  log_error: jest.fn(),
+  log_info: jest.fn(),
+}));
+
+jest.mock("../../reactHooks/useSubscriberFor", () => ({
+  postEvent: jest.fn(),
+}));
+
+// In-memory stand-in for the storage-backed provider; the limit check under
+// test lives in storageToggleFlag, not in the provider.
+const mockStore: Record<string, string[]> = {};
+
+jest.mock("../../storage/StorageMultiSelectProvider", () => ({
+  StorageMultiSelectProvider: {
+    getProvider: (keyNamespace: string) => ({
+      getSelectedAsync: async () => [...(mockStore[keyNamespace] ?? [])],
+      addItem: async (item: string) => {
+        mockStore[keyNamespace] = [...(mockStore[keyNamespace] ?? []), item];
+      },
+      removeItem: async (item: string) => {
+        mockStore[keyNamespace] = (mockStore[keyNamespace] ?? []).filter(
+          (it) => it !== item
+        );
+      },
+    }),
+  },
+}));
+
+const KEY = "user_preferences.teams";
+
+// Entries of a team selection feed with explicit tap actions
+// (localStorageToggleFlag with key and selector).
+const teamEntry = (n: number) =>
+  ({
+    id: `team-${n}`,
+    title: `Team ${n}`,
+    type: { value: "action" },
+    extensions: { tag: `TEAM ${n}` },
+  }) as unknown as ZappEntry;
+
+const tapAction = (extraOptions = {}) =>
+  ({
+    type: "localStorageToggleFlag",
+    options: { key: KEY, selector: "extensions.tag", ...extraOptions },
+  }) as unknown as ActionType;
+
+const tapTeams = async (count: number, extraOptions = {}) => {
+  const results: ActionResult[] = [];
+
+  for (let n = 1; n <= count; n++) {
+    results.push(
+      await localStorageToggleFlag(
+        { entry: teamEntry(n) },
+        tapAction(extraOptions)
+      )
+    );
+  }
+
+  return results;
+};
+
+describe("localStorageToggleFlag max_items", () => {
+  beforeEach(() => {
+    delete mockStore[KEY];
+    jest.clearAllMocks();
+  });
+
+  it("blocks the 11th team when max_items is in the action options", async () => {
+    const results = await tapTeams(11, { max_items: "10" });
+
+    expect(results.slice(0, 10)).toEqual(Array(10).fill(ActionResult.Success));
+    expect(results[10]).toBe(ActionResult.Cancel);
+    expect(mockStore[KEY]).toHaveLength(10);
+
+    expect(postEvent).toHaveBeenCalledWith(
+      TOGGLE_FLAG_MAX_ITEMS_REACHED_EVENT,
+      [expect.objectContaining({ maxItems: "10", tag: "TEAM 11" })]
+    );
+  });
+
+  it("still lets a selected team be removed at the limit", async () => {
+    await tapTeams(10, { max_items: "10" });
+
+    const result = await localStorageToggleFlag(
+      { entry: teamEntry(1) },
+      tapAction({ max_items: "10" })
+    );
+
+    expect(result).toBe(ActionResult.Success);
+    expect(mockStore[KEY]).toHaveLength(9);
+  });
+});

package/actionsExecutor/__tests__/feedDecorator.test.ts

@@ -59,3 +59,33 @@ describe("decorateFeed", () => {
     expect(decorated.entry[0].extensions.tap_actions).toBeUndefined();
   });
 });
+
+describe("decorateFeed max_items", () => {
+  const toggleAction = (feed: ZappFeed) =>
+    decorateFeed(feed).entry[0].extensions.tap_actions.actions[0];
+
+  it.each([
+    ["screen", "screenToggleFlag"],
+    ["session", "sessionStorageToggleFlag"],
+    ["ctx", "localStorageToggleFlag"],
+  ])("passes max_items to the %s toggle action", (scope, type) => {
+    const feed = preferenceFeed("multi");
+    feed.extensions.preference_editor_options.scope = scope;
+    feed.extensions.preference_editor_options.max_items = "10";
+
+    const toggle = toggleAction(feed);
+
+    expect(toggle.type).toBe(type);
+    expect(toggle.options).toEqual({ key: "agree", max_items: 10 });
+  });
+
+  it.each([undefined, 0, "0", "ten", -1])(
+    "does not set a limit for max_items %p",
+    (maxItems) => {
+      const feed = preferenceFeed("multi");
+      feed.extensions.preference_editor_options.max_items = maxItems;
+
+      expect(toggleAction(feed).options).toEqual({ key: "agree" });
+    }
+  );
+});

package/actionsExecutor/__tests__/screenToggleFlag.test.ts

@@ -0,0 +1,90 @@
+import { ActionExecutor, ActionResult } from "../ActionExecutor";
+import { screenToggleFlagAction } from "../actions/screenToggleFlag";
+
+jest.mock("../ActionExecutorContext", () => ({
+  log_error: jest.fn(),
+  log_info: jest.fn(),
+}));
+
+jest.mock("../StorageActions", () => ({
+  onMaxTagsReached: jest.fn(),
+}));
+
+// not used here, but it pulls the native bridge logger in at import time
+jest.mock("../../storage/ScreenSingleValueProvider", () => ({}));
+
+jest.mock("../../logger", () => ({
+  createLogger: () => ({
+    log_error: jest.fn(),
+    log_debug: jest.fn(),
+    log_info: jest.fn(),
+  }),
+}));
+
+const mockSelected: string[] = [];
+
+jest.mock("../../storage/ScreenStateMultiSelectProvider", () => ({
+  ScreenMultiSelectProvider: {
+    getProvider: () => ({
+      getSelectedAsync: async () => [...mockSelected],
+      addItem: async (item: string) => {
+        mockSelected.push(item);
+      },
+      removeItem: async (item: string) => {
+        mockSelected.splice(mockSelected.indexOf(item), 1);
+      },
+    }),
+  },
+}));
+
+const toggleAction = (options = {}) =>
+  ({
+    type: "screenToggleFlag",
+    options: { key: "teams", selector: "extensions.tag", ...options },
+  }) as unknown as ActionType;
+
+const context = (tag: string) => ({
+  screenRoute: "/screen",
+  screenStateStore: {},
+  entry: { id: tag, extensions: { tag } },
+});
+
+describe("screenToggleFlagAction at the max_items limit", () => {
+  beforeEach(() => {
+    mockSelected.length = 0;
+  });
+
+  it("returns the cancellation so the chained actions do not run", async () => {
+    const afterToggle = jest.fn();
+    const executor = new ActionExecutor();
+
+    executor.registerAction("screenToggleFlag", screenToggleFlagAction);
+
+    executor.registerAction("sendCloudEvent", async () => {
+      afterToggle();
+
+      return ActionResult.Success;
+    });
+
+    mockSelected.push("A", "B");
+
+    const result = await executor.handleActions(
+      [toggleAction({ max_items: 2 }), { type: "sendCloudEvent" }],
+      context("C") as never
+    );
+
+    expect(result).toBe(ActionResult.Cancel);
+    expect(afterToggle).not.toHaveBeenCalled();
+    expect(mockSelected).toEqual(["A", "B"]);
+  });
+
+  it("lets the chain continue below the limit", async () => {
+    const result = await screenToggleFlagAction(
+      toggleAction({ max_items: 2 }),
+      context("A") as never
+    );
+
+    expect(result).toBe(ActionResult.Success);
+    expect(mockSelected).toEqual(["A"]);
+  });
+});

package/actionsExecutor/actions/screenToggleFlag.ts

@@ -27,12 +27,10 @@ export const screenToggleFlagAction: ActionHandler<
   const screenRoute = context?.screenRoute;
   const screenStateStore = context?.screenStateStore;
 
-  await screenToggleFlag(
+  return await screenToggleFlag(
     screenRoute,
     screenStateStore,
     { entry: context?.entry, options: action.options },
     action
   );
-
-  return ActionResult.Success;
 };

package/actionsExecutor/feedDecorator.ts

@@ -47,6 +47,11 @@ function makeMultiSelect(feed: ZappFeed, key, decoratedFeed) {
         ? "sessionStorageToggleFlag"
         : "localStorageToggleFlag";
 
+  // the toggle actions read their limit from their own options
+  const maxItems = Number(
+    decoratedFeed.extensions?.preference_editor_options?.max_items
+  );
+
   decoratedFeed.entry?.forEach((entry: ZappEntry) => {
     entry.type.value = "action";
     entry.id = entry.extensions?.tag || entry.id;
@@ -59,6 +64,7 @@ function makeMultiSelect(feed: ZappFeed, key, decoratedFeed) {
             type: actionType,
             options: {
               key,
+              ...(maxItems > 0 && { max_items: maxItems }),
             },
           },
         ],

package/analyticsUtils/__tests__/playerAnalyticsSafeguard.test.ts

@@ -0,0 +1,62 @@
+import { PlayerAnalyticsTracker } from "../playerAnalyticsTracker";
+import { PLAYBACK_EVENT } from "../events";
+
+const mockPostAnalyticEvent = jest.fn();
+
+jest.mock("../manager", () => ({
+  postAnalyticEvent: (...args) => mockPostAnalyticEvent(...args),
+}));
+
+describe("Player Analytics Safeguards against nativeEvent leakage", () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  const mockEntry = {
+    id: "vod_123",
+    title: "Test Video",
+    type: { value: "video" },
+    content: { type: "video/mp4" },
+    extensions: { duration: 120 },
+  };
+
+  const mockPlayer = {
+    playerPluginId: "quick_brick_player",
+    getEntry: () => mockEntry,
+    getState: () => ({ isPaused: false, contentPosition: 0.63 }),
+  };
+
+  it("omits nativeEvent from analytics payload if present in eventData", () => {
+    const tracker = new PlayerAnalyticsTracker();
+    tracker.setPlayer(mockPlayer as any);
+
+    const payload = tracker.prepareAnalyticPayload(PLAYBACK_EVENT.play, {
+      nativeEvent: { currentTime: 0.63, reason: "video_ready" },
+      player_type: "quick_brick_player",
+    } as any);
+
+    expect(payload.nativeEvent).toBeUndefined();
+    expect(payload.media_id).toBe("vod_123");
+    expect(payload.name).toBe("Test Video");
+    expect(payload.player_type).toBe("quick_brick_player");
+  });
+
+  it("properly prepares payload when eventData is unwrapped", () => {
+    const tracker = new PlayerAnalyticsTracker();
+    tracker.setPlayer(mockPlayer as any);
+
+    const payload = tracker.prepareAnalyticPayload(PLAYBACK_EVENT.play, {
+      currentTime: 0.63,
+      reason: "video_ready",
+      player_type: "quick_brick_player",
+    } as any);
+
+    expect(payload.nativeEvent).toBeUndefined();
+    expect(payload.currentTime).toBeUndefined();
+    expect(payload.current_position).toBe(0.63);
+    expect(payload.reason).toBe("video_ready");
+    expect(payload.media_id).toBe("vod_123");
+    expect(payload.name).toBe("Test Video");
+    expect(payload.player_type).toBe("quick_brick_player");
+  });
+});

package/analyticsUtils/playerAnalyticsTracker.ts

@@ -214,6 +214,7 @@ export class PlayerAnalyticsTracker implements PlayerAnalyticsTrackerI {
         "isLive",
         "event",
         "entry",
+        "nativeEvent",
       ],
       eventData
     );

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "16.0.0-rc.125",
+  "version": "16.0.0-rc.126",
   "description": "Applicaster Zapp React Native utilities package",
   "main": "index.js",
   "types": "index.d.ts",
@@ -27,7 +27,7 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "16.0.0-rc.125",
+    "@applicaster/applicaster-types": "16.0.0-rc.126",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "dayjs": "^1.11.10",

package/reactHooks/feed/__tests__/feedInvalidation.test.tsx

@@ -0,0 +1,338 @@
+import React from "react";
+import { Provider } from "react-redux";
+import { configureStore } from "@reduxjs/toolkit";
+import { act, renderHook } from "@testing-library/react-native";
+import reducer, {
+  loadPipesData,
+  unsubscribeFromDataSource,
+  zappPipesClear,
+} from "@applicaster/zapp-react-native-redux/ZappPipes";
+import { zappPipesMiddleware } from "../../../../zapp-react-native-redux/ZappPipes/middleware";
+import { useFeedLoader } from "../useFeedLoader";
+
+const mockGet = jest.fn();
+const mockPost = jest.fn();
+const mockSubscribe = jest.fn();
+const mockRelease = jest.fn();
+let mockChange: () => void;
+let mockLoad: ReturnType<typeof jest.fn>;
+
+jest.mock("@applicaster/zapp-pipes-v2-client", () => ({
+  __esModule: true,
+  default: jest.fn(() => ({
+    get: (...args) => mockGet(...args),
+    post: (...args) => mockPost(...args),
+  })),
+  RequestBuilder: jest.fn(() => ({
+    setResolvers() {
+      return this;
+    },
+    build: async () => ({}),
+  })),
+  subscribeForUrlContextKeyChanges: (...args) => mockSubscribe(...args),
+}));
+
+jest.mock("../useInflatedUrl", () => ({
+  useInflatedUrl: ({ feedUrl }) => feedUrl,
+}));
+
+jest.mock("../useLoadPipesDataDispatch", () => ({
+  useLoadPipesDataDispatch: () => mockLoad,
+}));
+
+const url = "https://example.test/feed";
+const data = { id: "feed", type: { value: "feed" }, entry: [] };
+
+const settle = async () => {
+  for (let index = 0; index < 30; index++) await Promise.resolve();
+};
+
+const createHarness = (plugins: QuickBrickPlugin[] = []) => {
+  const store = configureStore({
+    reducer: {
+      zappPipes: reducer,
+      appData: () => ({ layoutVersion: "v2" }),
+      plugins: () => plugins,
+    },
+    middleware: (defaults) =>
+      defaults({ serializableCheck: false }).concat(zappPipesMiddleware),
+  });
+
+  mockLoad = jest.fn((feedUrl, options) =>
+    store.dispatch(loadPipesData(feedUrl, options))
+  );
+
+  const wrapper = ({ children }) => (
+    <Provider store={store}>{children}</Provider>
+  );
+
+  return { store, wrapper };
+};
+
+describe("dependency-driven feed invalidation", () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockGet.mockResolvedValue({ response: data, code: 200 });
+    mockPost.mockResolvedValue({ response: data, code: 200 });
+
+    mockSubscribe.mockImplementation((_url, _options, onChange) => {
+      mockChange = onChange;
+
+      return mockRelease;
+    });
+  });
+
+  afterEach(() => unsubscribeFromDataSource());
+
+  it("silently revalidates a shared mounted feed once and keeps its content", async () => {
+    const { store, wrapper } = createHarness();
+
+    const first = renderHook(() => useFeedLoader({ feedUrl: url }), {
+      wrapper,
+    });
+
+    const second = renderHook(() => useFeedLoader({ feedUrl: url }), {
+      wrapper,
+    });
+
+    await act(settle);
+
+    expect(mockGet).toHaveBeenCalledTimes(1);
+    expect(mockSubscribe).toHaveBeenCalledTimes(1);
+    let finish;
+
+    mockGet.mockImplementationOnce(
+      () =>
+        new Promise((resolve) => {
+          finish = resolve;
+        })
+    );
+
+    await act(async () => {
+      mockChange();
+      await settle();
+    });
+
+    expect(mockGet).toHaveBeenCalledTimes(2);
+    expect(first.result.current.data).toEqual(data);
+    expect(first.result.current.loading).toBe(false);
+    expect(store.getState().zappPipes[url].refreshing).toBe(true);
+
+    await act(async () => {
+      finish({ response: data, code: 200 });
+      await settle();
+    });
+
+    expect(store.getState().zappPipes[url].stale).toBeUndefined();
+    first.unmount();
+    second.unmount();
+    expect(mockRelease).not.toHaveBeenCalled();
+  });
+
+  it("invalidates an unmounted cache without fetching and revalidates on remount", async () => {
+    const { store, wrapper } = createHarness();
+
+    const first = renderHook(() => useFeedLoader({ feedUrl: url }), {
+      wrapper,
+    });
+
+    await act(settle);
+    first.unmount();
+
+    mockChange();
+    mockChange();
+    await settle();
+
+    expect(mockGet).toHaveBeenCalledTimes(1);
+
+    expect(store.getState().zappPipes[url]).toMatchObject({
+      stale: true,
+      invalidationVersion: 2,
+      data,
+    });
+
+    const second = renderHook(() => useFeedLoader({ feedUrl: url }), {
+      wrapper,
+    });
+
+    await act(settle);
+
+    expect(mockGet).toHaveBeenCalledTimes(2);
+    expect(store.getState().zappPipes[url].stale).toBeUndefined();
+    second.unmount();
+  });
+
+  it("runs one follow-up when invalidated repeatedly during a request", async () => {
+    const { store, wrapper } = createHarness();
+    let finish;
+
+    mockGet.mockImplementationOnce(
+      () =>
+        new Promise((resolve) => {
+          finish = resolve;
+        })
+    );
+
+    const hook = renderHook(() => useFeedLoader({ feedUrl: url }), { wrapper });
+    await act(settle);
+
+    await act(async () => {
+      mockChange();
+      mockChange();
+      await settle();
+    });
+
+    expect(mockGet).toHaveBeenCalledTimes(1);
+
+    await act(async () => {
+      finish({ response: data, code: 200 });
+      await settle();
+    });
+
+    expect(mockGet).toHaveBeenCalledTimes(2);
+    expect(store.getState().zappPipes[url].stale).toBeUndefined();
+    hook.unmount();
+  });
+
+  it("stops a failed revalidation until another dependency change", async () => {
+    const { wrapper } = createHarness();
+    const hook = renderHook(() => useFeedLoader({ feedUrl: url }), { wrapper });
+    await act(settle);
+    mockGet.mockRejectedValueOnce(new Error("network unavailable"));
+
+    await act(async () => {
+      mockChange();
+      await settle();
+    });
+
+    expect(mockGet).toHaveBeenCalledTimes(2);
+    expect(hook.result.current.error).toBeDefined();
+
+    await act(async () => {
+      mockChange();
+      await settle();
+    });
+
+    expect(mockGet).toHaveBeenCalledTimes(3);
+    expect(hook.result.current.error).toBeUndefined();
+    hook.unmount();
+  });
+
+  it("releases cache subscriptions for direct clear actions", async () => {
+    const { store } = createHarness();
+    await store.dispatch(loadPipesData(url));
+    await store.dispatch(loadPipesData(`${url}/two`));
+    store.dispatch(zappPipesClear(url));
+    expect(mockRelease).toHaveBeenCalledTimes(1);
+    store.dispatch(zappPipesClear());
+    expect(mockRelease).toHaveBeenCalledTimes(2);
+  });
+
+  it("preserves POST method and body when revalidating", async () => {
+    const { wrapper } = createHarness();
+    const bodyParams = { filter: "recent" };
+
+    const hook = renderHook(
+      () =>
+        useFeedLoader({
+          feedUrl: url,
+          pipesOptions: { method: "post", bodyParams },
+        }),
+      { wrapper }
+    );
+
+    await act(settle);
+
+    await act(async () => {
+      mockChange();
+      await settle();
+    });
+
+    expect(mockSubscribe).toHaveBeenCalledWith(
+      url,
+      { method: "post" },
+      expect.any(Function)
+    );
+
+    expect(mockPost).toHaveBeenCalledTimes(2);
+    expect(mockPost).toHaveBeenLastCalledWith(url, bodyParams);
+    expect(mockGet).not.toHaveBeenCalled();
+    hook.unmount();
+  });
+
+  it("does not revalidate a skipped mounted feed until loading is enabled", async () => {
+    const { store, wrapper } = createHarness();
+    await store.dispatch(loadPipesData(url));
+
+    const hook = renderHook(
+      ({ skipLoading }) =>
+        useFeedLoader({
+          feedUrl: url,
+          pipesOptions: { skipLoading },
+        }),
+      { wrapper, initialProps: { skipLoading: true } }
+    );
+
+    await act(async () => {
+      mockChange();
+      await settle();
+    });
+
+    expect(mockGet).toHaveBeenCalledTimes(1);
+    expect(store.getState().zappPipes[url].stale).toBe(true);
+
+    hook.rerender({ skipLoading: false });
+    await act(settle);
+    expect(mockGet).toHaveBeenCalledTimes(2);
+    expect(store.getState().zappPipes[url].stale).toBeUndefined();
+    hook.unmount();
+  });
+
+  it("shares GET revalidation with an omitted or empty unused request body", async () => {
+    const { store } = createHarness();
+    await store.dispatch(loadPipesData(url));
+    mockChange();
+    mockGet.mockClear();
+
+    await Promise.all([
+      store.dispatch(loadPipesData(url)),
+      store.dispatch(loadPipesData(url, { method: "get", bodyParams: {} })),
+    ]);
+
+    expect(mockGet).toHaveBeenCalledTimes(1);
+  });
+
+  it("keeps plugin observation until its cache is cleared", async () => {
+    const release = jest.fn();
+    let changed;
+
+    const addDataSourceListener = jest.fn((callback) => {
+      changed = callback;
+
+      return release;
+    });
+
+    const { store, wrapper } = createHarness([
+      {
+        identifier: "generic-provider",
+        module: { addDataSourceListener },
+      } as QuickBrickPlugin,
+    ]);
+
+    const pluginUrl = "pipesv2://generic-provider/feed";
+
+    const hook = renderHook(() => useFeedLoader({ feedUrl: pluginUrl }), {
+      wrapper,
+    });
+
+    await act(settle);
+    hook.unmount();
+    changed();
+    await settle();
+    expect(mockGet).toHaveBeenCalledTimes(1);
+    expect(store.getState().zappPipes[pluginUrl].stale).toBe(true);
+    expect(release).not.toHaveBeenCalled();
+    store.dispatch(zappPipesClear(pluginUrl));
+    expect(release).toHaveBeenCalledTimes(1);
+  });
+});

package/reactHooks/feed/__tests__/useBatchLoading.test.tsx

@@ -2,6 +2,7 @@ import { renderHook, waitFor } from "@testing-library/react-native";
 import { allFeedsIsReady, useBatchLoading } from "../useBatchLoading";
 import { WrappedWithProviders } from "@applicaster/zapp-react-native-utils/testUtils";
 import { appStore } from "@applicaster/zapp-react-native-redux/AppStore";
+import * as ZappPipes from "@applicaster/zapp-react-native-redux/ZappPipes";
 
 jest.mock("../../navigation");
 
@@ -32,11 +33,16 @@ describe("useBatchLoading", () => {
     // ... more items
   ];
 
-  beforeAll(() => {
-    jest.useFakeTimers();
+  beforeEach(() => {
+    jest
+      .spyOn(ZappPipes, "loadPipesData")
+      .mockImplementation((url, options) => async (dispatch) => {
+        dispatch(ZappPipes.zappPipesRequestStart(url, options));
+      });
   });
 
   afterEach(() => {
+    jest.restoreAllMocks();
     jest.clearAllMocks();
   });
 

package/reactHooks/feed/useFeedLoader.tsx

@@ -15,6 +15,7 @@ type Props = {
   pipesOptions?: {
     clearCache?: boolean;
     loadLocalFavourites?: boolean;
+    loadLocalFavorites?: boolean;
     silentRefresh?: boolean;
     method?: "get" | "post";
     bodyParams?: Record<string, unknown>;
@@ -45,11 +46,36 @@ export const useFeedLoader = ({
 
   const loadPipesDataDispatcher = useLoadPipesDataDispatch();
 
+  useEffect(() => {
+    if (
+      currentFeed?.stale &&
+      !currentFeed.refreshing &&
+      (!currentFeed.error || isInitialRender) &&
+      !pipesOptions.skipLoading
+    ) {
+      loadPipesDataDispatcher(
+        callableFeedUrl,
+        { ...pipesOptions, clearCache: false, silentRefresh: true },
+        { withResolvers: true }
+      );
+    }
+  }, [
+    callableFeedUrl,
+    currentFeed?.stale,
+    currentFeed?.invalidationVersion,
+    currentFeed?.refreshing,
+    currentFeed?.error,
+    pipesOptions,
+    loadPipesDataDispatcher,
+    isInitialRender,
+  ]);
+
   const reloadData = React.useCallback<ReloadDataFunction>(
     (silentRefresh = true, callback) => {
       loadPipesDataDispatcher(
         callableFeedUrl,
         {
+          ...pipesOptions,
           clearCache: true,
           silentRefresh,
           callback,
@@ -59,7 +85,7 @@ export const useFeedLoader = ({
         }
       );
     },
-    [callableFeedUrl]
+    [callableFeedUrl, pipesOptions, loadPipesDataDispatcher]
   );
 
   const loadNext: FeedLoaderResponse["loadNext"] = React.useCallback(() => {
@@ -81,6 +107,7 @@ export const useFeedLoader = ({
 
   useEffect(() => {
     if (
+      !currentFeed?.stale &&
       shouldDispatchData(callableFeedUrl, currentFeed, pipesOptions.clearCache)
     ) {
       if (callableFeedUrl && !pipesOptions.skipLoading) {

package/reactHooks/feed/useLoadPipesDataDispatch.ts

@@ -19,14 +19,6 @@ export const useLoadPipesDataDispatch = () => {
     (screenData as LegacyNavigationScreenData)?.targetScreen?.id ??
     screenData?.id;
 
-  const onLoadCB = (options) => (data, _err) => {
-    options?.callback?.();
-
-    if (data) {
-      applyScreenRouteDefaults(data, screenStateStore, pathname);
-    }
-  };
-
   return React.useCallback(
     (
       url: string,
@@ -36,6 +28,9 @@ export const useLoadPipesDataDispatch = () => {
         clearCache?: boolean;
         silentRefresh?: boolean;
         parentFeed?: string;
+        method?: "get" | "post";
+        bodyParams?: Record<string, unknown>;
+        loadLocalFavorites?: boolean;
       } = {},
       {
         withResolvers = false,
@@ -46,18 +41,24 @@ export const useLoadPipesDataDispatch = () => {
       } = {}
     ) => {
       if (url) {
-        dispatch(
+        return dispatch(
           ZappPipes.loadPipesData(url, {
             riverId,
             resolvers: withResolvers ? resolvers : undefined,
             ...options,
             callback: withScreenRouteMapping
-              ? onLoadCB(options)
+              ? (data, error) => {
+                  options.callback?.(data, error);
+
+                  if (data) {
+                    applyScreenRouteDefaults(data, screenStateStore, pathname);
+                  }
+                }
               : options?.callback,
           })
         );
       }
     },
-    []
+    [dispatch, riverId, resolvers, screenStateStore, pathname]
   );
 };