@applicaster/zapp-react-native-utils 16.0.0-alpha.5222020837 → 16.0.0-alpha.5305005033

package/actionsExecutor/ActionExecutor.ts

@@ -1,4 +1,5 @@
 import { createLogger } from "../logger";
+import type { ActionExecutionContext, ActionHandler } from "./types";
 
 export enum ActionResult {
   Success = "success",
@@ -12,12 +13,12 @@ const { log_error, log_debug, log_info } = createLogger({
 });
 
 class ActionExecutor {
-  private registeredActions: Record<string, any> = {};
-  // TODO: Remove context
+  private registeredActions: Record<string, ActionHandler> = {};
 
+  // TODO: Remove context
   handleAction = async (
     action: ActionType,
-    context?: Record<string, any>
+    context?: ActionExecutionContext
   ): Promise<ActionResult> => {
     const handler = this.registeredActions[action.type];
     const entry = context?.entry as ZappEntry;
@@ -52,7 +53,7 @@ class ActionExecutor {
 
   handleActions = async (
     actionTypes: ActionType[],
-    context?: Record<string, any>
+    context?: ActionExecutionContext
   ): Promise<ActionResult> => {
     for (const action of actionTypes) {
       // TODO: Handle action result error
@@ -70,7 +71,7 @@ class ActionExecutor {
 
   handleEntryActions = async (
     entry: ZappEntry,
-    context?: Record<string, any>
+    context?: ActionExecutionContext
   ): Promise<ActionResult> => {
     const tapActions = entry.extensions?.tap_actions?.actions;
 
@@ -98,12 +99,9 @@ class ActionExecutor {
     delete this.registeredActions[actionType];
   };
 
-  registerAction = (
+  registerAction = <TOptions = Record<string, any>>(
     type: string,
-    handler: (
-      action: ActionType,
-      context?: Record<string, any>
-    ) => Promise<ActionResult>
+    handler: ActionHandler<TOptions>
   ) => {
     if (this.registeredActions[type]) {
       log_error(`registerAction: action type: ${type} already registered`);

package/actionsExecutor/ActionExecutorContext.tsx

@@ -5,300 +5,96 @@ import {
   actionExecutor as _actionExecutor,
   ActionResult,
 } from "./ActionExecutor";
-import {
-  batchRemoveAllFromNamespaceForStorage,
-  batchSave,
-} from "../zappFrameworkUtils/localStorageHelper";
+import { ActionExecutionContext, ActionHandler } from "./types";
+import { batchRemoveAllFromNamespaceForStorage } from "../zappFrameworkUtils/localStorageHelper";
 import { sessionStorage } from "@applicaster/zapp-react-native-bridge/ZappStorage/SessionStorage";
 
-import * as QuickBrickManager from "@applicaster/zapp-react-native-bridge/QuickBrick";
-import { QUICK_BRICK_EVENTS } from "@applicaster/zapp-react-native-bridge/QuickBrick";
-import { showConfirmationDialog } from "../alertUtils";
-import { createCloudEvent, sendCloudEvent } from "../cloudEventsUtils";
-import { createLogger } from "../logger";
-import { ACTIVE_LAYOUT_ID_STORAGE_KEY } from "@applicaster/quick-brick-core/App/remoteContextReloader/consts";
-import { appStore } from "@applicaster/zapp-react-native-redux/AppStore";
-import { loadPipesData } from "@applicaster/zapp-react-native-redux/ZappPipes";
-import {
-  EntryResolver,
-  resolveObjectValues,
-} from "../appUtils/contextKeysManager/contextResolver";
 import { useNavigation, useRivers } from "../reactHooks";
-import {
-  getInflatedDataSourceUrl,
-  getSearchContext,
-} from "../reactHooks/feed/useInflatedUrl";
-
 import { useContentTypes } from "@applicaster/zapp-react-native-redux/hooks";
 import { useSubscriberFor } from "../reactHooks/useSubscriberFor";
 import { APP_EVENTS } from "../appUtils/events";
-import {
-  localStorageToggleFlag,
-  sessionStorageToggleFlag,
-} from "./StorageActions";
+import { createLogger } from "../logger";
 
-import { screenSetVariable, screenToggleFlag } from "./ScreenActions";
+import {
+  appRestartAction,
+  confirmDialogAction,
+  createNavigateToScreenAction,
+  dismissBottomSheetAction,
+  localStorageRemoveAction,
+  localStorageSetAction,
+  localStorageToggleFlagAction,
+  openBottomSheetAction,
+  refreshComponentAction,
+  screenSetVariableAction,
+  screenToggleFlagAction,
+  sendCloudEventAction,
+  sessionStorageRemoveAction,
+  sessionStorageSetAction,
+  sessionStorageToggleFlagAction,
+  switchLayoutAction,
+  showToastAction,
+} from "./actions";
 
 export const { log_error, log_info, log_debug } = createLogger({
   subsystem: "ActionExecutorContext",
   category: "General",
 });
 
-type ActionExecutorContextType = {
-  registerAction: (
+export type ActionExecutorContextType = {
+  registerAction: <TOptions = Record<string, any>>(
     type: string,
-    handler: (
-      action: ActionType,
-      context?: Record<string, any>
-    ) => Promise<ActionResult>
+    handler: ActionHandler<TOptions>
   ) => void;
   unregisterAction: (type: string) => void;
   handleAction: (
     action: ActionType,
-    context?: Record<string, any>
+    context?: ActionExecutionContext
   ) => Promise<ActionResult>;
   handleActions: (
     actions: ActionType[],
-    context: Record<string, any>
+    context?: ActionExecutionContext
   ) => Promise<ActionResult>;
   handleEntryActions: (
     entry: ZappEntry,
-    context?: Record<string, any>
+    context?: ActionExecutionContext
   ) => Promise<ActionResult>;
 };
+
 type Props = {
   children: React.ReactNode;
 };
 
-function findParentComponent(
-  childId: string,
-  parent: ZappRiver | ZappUIComponent
-): ZappRiver | ZappUIComponent | null {
-  for (const child of parent.ui_components) {
-    if (child.id === childId) return parent;
-
-    if (child.ui_components) {
-      const found = findParentComponent(childId, child);
-      if (found) return found;
-    }
-  }
-
-  return null;
-}
-
 const prepareDefaultActions = (actionExecutor) => {
-  actionExecutor.registerAction("localStorageSet", async (action) => {
-    const namespaces = action.options.content;
-    await batchSave(namespaces, localStorage);
-    // TODO: Add support for ownershipKey and ownershipNamespace
-
-    return ActionResult.Success;
-  });
-
-  actionExecutor.registerAction("sessionStorageSet", async (action) => {
-    const namespaces = action.options.content;
-    await batchSave(namespaces, sessionStorage);
-    // TODO: Add support for ownershipKey and ownershipNamespace
-
-    return ActionResult.Success;
-  });
+  actionExecutor.registerAction("localStorageSet", localStorageSetAction);
+  actionExecutor.registerAction("sessionStorageSet", sessionStorageSetAction);
+  actionExecutor.registerAction("localStorageRemove", localStorageRemoveAction);
 
   actionExecutor.registerAction(
-    "refreshComponent",
-    async (_action, context) => {
-      const dispatch = appStore.getDispatch();
-
-      const parentComponent = findParentComponent(
-        context?.component?.id,
-        context?.screenData
-      );
-
-      const componentSource = context?.component?.data?.source;
-
-      const componentData = componentSource
-        ? context.component.data
-        : parentComponent?.data;
-
-      const source = componentData?.source;
-      const mapping = componentData?.mapping;
-
-      let dataSource = source;
-
-      if (source && mapping) {
-        dataSource =
-          getInflatedDataSourceUrl({
-            source,
-            contexts: {
-              entry: context?.entryContext,
-              screen: context?.screenData,
-              search: getSearchContext(null, mapping),
-            },
-            mapping,
-          }) || source;
-      }
-
-      log_info(`handleAction: refreshComponent for dataSource:${dataSource}`, {
-        source,
-        inflatedUrl: dataSource,
-        mapping,
-        entryContextId: context?.entryContext?.id,
-        entryId: context?.entry?.id,
-      });
-
-      // TODO: In theory we should wait callback to complete, before completing the action, but now it's not needed
-      // TODO: handle focused item removal
-      dispatch(
-        loadPipesData(dataSource, {
-          silentRefresh: false,
-          clearCache: true,
-          riverId: context?.screenData?.id,
-        })
-      );
-
-      return ActionResult.Success;
-    }
+    "sessionStorageRemove",
+    sessionStorageRemoveAction
   );
 
-  actionExecutor.registerAction("switchLayout", async (action) => {
-    log_info("handleAction: switchLayout event");
-
-    await localStorage.setItem(
-      ACTIVE_LAYOUT_ID_STORAGE_KEY,
-      action.options.layoutId
-    );
-
-    QuickBrickManager.sendQuickBrickEvent(QUICK_BRICK_EVENTS.FORCE_APP_RELOAD);
-
-    return ActionResult.Success;
-  });
-
-  actionExecutor.registerAction("appRestart", async () => {
-    log_info(`handleAction: ${QUICK_BRICK_EVENTS.FORCE_APP_RELOAD} event`);
-
-    QuickBrickManager.sendQuickBrickEvent(QUICK_BRICK_EVENTS.FORCE_APP_RELOAD);
-
-    return ActionResult.Success;
-  });
-
-  actionExecutor.registerAction("confirmDialog", async (action) => {
-    log_info("handleAction: confirmDialog event");
-
-    return new Promise<ActionResult>((resolve) => {
-      showConfirmationDialog({
-        ...action.options,
-        confirmCompletion: () => resolve(ActionResult.Success),
-        cancelCompletion: () => resolve(ActionResult.Cancel),
-      });
-    });
-  });
-
-  actionExecutor.registerAction("sendCloudEvent", async (action, context) => {
-    try {
-      const options = action.options;
-
-      const entry = context?.entry || {};
-      const entryResolver = new EntryResolver(entry);
-      const screenData = context?.screenStateStore.getState().data || {};
-      const screenResolver = new EntryResolver(screenData || {});
-
-      const data =
-        options?.data && options.inflateData
-          ? await resolveObjectValues(options.data, {
-              entry: entryResolver,
-              screen: screenResolver,
-            })
-          : options?.data || entry;
-
-      const cloudEvent = await createCloudEvent({
-        type: options.type || "com.applicaster.selector.action.v1",
-        data,
-        subject: options.subject || entry?.id,
-      });
-
-      log_info("handleAction: sendCloudEvent event", { cloudEvent });
-
-      const { error, code } = await sendCloudEvent(cloudEvent, options.url);
-
-      if (error) {
-        log_error("sendCloudEvent: error sending cloud event", { error });
-
-        return ActionResult.Error;
-      }
-
-      if (code && code >= 200 && code < 300 && !error) {
-        log_info("sendCloudEvent: cloud event sent successfully");
-
-        return ActionResult.Success;
-      }
-    } catch (error) {
-      log_error("sendCloudEvent: error sending cloud event", {
-        action,
-        error,
-      });
-    }
-
-    return ActionResult.Error;
-  });
+  actionExecutor.registerAction("refreshComponent", refreshComponentAction);
+  actionExecutor.registerAction("switchLayout", switchLayoutAction);
+  actionExecutor.registerAction("appRestart", appRestartAction);
+  actionExecutor.registerAction("confirmDialog", confirmDialogAction);
+  actionExecutor.registerAction("sendCloudEvent", sendCloudEventAction);
 
   actionExecutor.registerAction(
     "sessionStorageToggleFlag",
-    async (
-      action: ActionType,
-      context?: Record<string, any>
-    ): Promise<ActionResult> => {
-      return await sessionStorageToggleFlag(context, action);
-    }
+    sessionStorageToggleFlagAction
   );
 
   actionExecutor.registerAction(
     "localStorageToggleFlag",
-    async (
-      action: ActionType,
-      context?: Record<string, any>
-    ): Promise<ActionResult> => {
-      return await localStorageToggleFlag(context, action);
-    }
-  );
-
-  actionExecutor.registerAction(
-    "screenSetVariable",
-    async (
-      action: ActionType,
-      context?: Record<string, any>
-    ): Promise<ActionResult> => {
-      const route = context?.screenRoute;
-      const screenStateStore = context?.screenStateStore;
-
-      await screenSetVariable(
-        route,
-        screenStateStore,
-        { entry: context?.entry, options: action.options },
-        action
-      );
-
-      return Promise.resolve(ActionResult.Success);
-    }
+    localStorageToggleFlagAction
   );
 
-  actionExecutor.registerAction(
-    "screenToggleFlag",
-    async (
-      action: ActionType,
-      context?: Record<string, any>
-    ): Promise<ActionResult> => {
-      const screenRoute = context?.screenRoute;
-      const screenStateStore = context?.screenStateStore;
-
-      await screenToggleFlag(
-        screenRoute,
-        screenStateStore,
-        { entry: context?.entry, options: action.options },
-        action
-      );
-
-      return Promise.resolve(ActionResult.Success);
-    }
-  );
+  actionExecutor.registerAction("screenSetVariable", screenSetVariableAction);
+  actionExecutor.registerAction("screenToggleFlag", screenToggleFlagAction);
+  actionExecutor.registerAction("openBottomSheet", openBottomSheetAction);
+  actionExecutor.registerAction("dismissBottomSheet", dismissBottomSheetAction);
+  actionExecutor.registerAction("showToast", showToastAction);
 };
 
 export const ActionExecutorContext =
@@ -339,82 +135,7 @@ export function withActionExecutor(Component) {
     useEffect(() => {
       return _actionExecutor.registerAction(
         "navigateToScreen",
-
-        async (action: ActionType, context?: Record<string, any>) => {
-          const screenType = action.options?.typeMapping;
-
-          if (!screenType) {
-            log_error("navigateToScreen: typeMapping option is missing");
-
-            return ActionResult.Error;
-          }
-
-          const navigationAction = action.options?.navigationAction;
-          const entrySource = action.options?.entry;
-
-          const entry = entrySource
-            ? entrySource === "@{entry/}"
-              ? context?.entry
-              : entrySource
-            : null;
-
-          if (entry) {
-            if (typeof entry !== "object") {
-              log_error(
-                `navigateToScreen: entry option is not an object, entry: ${entry}`
-              );
-
-              return ActionResult.Error;
-            }
-
-            log_info(
-              `navigateToScreen: navigating to screen type: ${screenType} with entry id: ${entry.id}`
-            );
-
-            const overriddenEntry = {
-              ...entry,
-              type: {
-                value: screenType,
-              },
-            };
-
-            if (navigationAction === "push") {
-              navigator.push(overriddenEntry);
-            } else {
-              navigator.replace(overriddenEntry);
-            }
-
-            return ActionResult.Success;
-          }
-
-          const screenId = contentTypes?.[screenType]?.screen_id || null;
-
-          if (!screenId) {
-            log_error(
-              `navigateToScreen: can not resolve screen type mapping: ${screenType}`
-            );
-
-            return ActionResult.Error;
-          }
-
-          const river = rivers[screenId];
-
-          if (!river) {
-            log_error("navigateToScreen: can not resolve river");
-
-            return ActionResult.Error;
-          }
-
-          context?.callback?.({ success: false, error: null, abort: true });
-
-          if (navigationAction === "push") {
-            navigator.push(river);
-          } else {
-            navigator.replace(river);
-          }
-
-          return ActionResult.Success;
-        }
+        createNavigateToScreenAction(navigator, rivers, contentTypes)
       );
     }, [navigator, rivers, contentTypes]);
 

package/actionsExecutor/actions/__tests__/dismissBottomSheet.test.ts

@@ -0,0 +1,22 @@
+import { dismissBottomSheetAction } from "../dismissBottomSheet";
+import { dismissModal } from "../../../modalState";
+import { ActionResult } from "../../ActionExecutor";
+
+jest.mock("../../../modalState", () => ({
+  dismissModal: jest.fn(),
+}));
+
+describe("dismissBottomSheetAction", () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it("calls dismissModal and returns ActionResult.Success", async () => {
+    const result = await dismissBottomSheetAction({
+      type: "dismissBottomSheet",
+    });
+
+    expect(dismissModal).toHaveBeenCalledTimes(1);
+    expect(result).toBe(ActionResult.Success);
+  });
+});

package/actionsExecutor/actions/__tests__/loadItemsFromSource.test.ts

@@ -0,0 +1,88 @@
+import { loadItemsFromSource } from "../openBottomSheet";
+
+const mockCall = jest.fn();
+
+jest.mock("@applicaster/zapp-pipes-v2-client", () => ({
+  RequestBuilder: jest.fn().mockImplementation(() => ({
+    setEntryContext: jest.fn().mockReturnThis(),
+    setScreenContext: jest.fn().mockReturnThis(),
+    setUrl: jest.fn().mockReturnThis(),
+    buildAxiosRequest: jest.fn().mockResolvedValue(undefined),
+    call: (...args: any[]) => mockCall(...args),
+  })),
+  PipesClientResponseHelper: jest.fn().mockImplementation(() => ({
+    error: null,
+  })),
+}));
+
+describe("loadItemsFromSource", () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it("returns items plus role and behavior from feed.extensions", async () => {
+    mockCall.mockResolvedValueOnce({
+      response: {
+        entry: [{ id: "a", title: "Playlist A", media_group: [] }],
+        extensions: {
+          role: "collection_selector",
+          behavior: {
+            select_mode: "multi",
+            current_selection: ["a"],
+            selector: "extensions.tag",
+          },
+        },
+      },
+    });
+
+    const result = await loadItemsFromSource("https://example.com/feed");
+
+    expect(result.role).toBe("collection_selector");
+
+    expect(result.behavior).toEqual({
+      selectMode: "multi",
+      currentSelection: ["a"],
+      selector: "extensions.tag",
+    });
+
+    expect(result.items).toHaveLength(1);
+    expect(result.items[0].isSelected).toBe(true);
+    expect(result.items[0].title).toBe("Playlist A");
+  });
+
+  it("returns undefined role/behavior when feed has no extensions", async () => {
+    mockCall.mockResolvedValueOnce({
+      response: {
+        entry: [{ id: "1", title: "Plain", media_group: [] }],
+      },
+    });
+
+    const result = await loadItemsFromSource("https://example.com/plain");
+
+    expect(result.role).toBeUndefined();
+    expect(result.behavior).toBeUndefined();
+    expect(result.items).toHaveLength(1);
+  });
+
+  it("preserves events in dynamic_collection_options", async () => {
+    mockCall.mockResolvedValueOnce({
+      response: {
+        entry: [],
+        extensions: {
+          dynamic_collection_options: {
+            operations: "add,remove",
+            events: {
+              add: [{ type: "showTextInput", options: {} }],
+            },
+          },
+        },
+      },
+    });
+
+    const result = await loadItemsFromSource("https://example.com/feed");
+
+    expect(result.dynamicCollection?.events).toEqual({
+      add: [{ type: "showTextInput", options: {} }],
+    });
+  });
+});

package/actionsExecutor/actions/__tests__/openBottomSheet.customContent.test.ts

@@ -0,0 +1,76 @@
+import { openBottomSheetAction } from "../openBottomSheet";
+import { ActionResult } from "../../ActionExecutor";
+import { openBottomSheetModal } from "../../../modalState/store";
+import { modalOrchestrator } from "../../../modalState/ModalOrchestrator";
+
+jest.mock("../../../modalState/store", () => ({
+  openBottomSheetModal: jest.fn(),
+}));
+
+jest.mock("../../../modalState/ModalOrchestrator", () => ({
+  modalOrchestrator: {
+    open: jest.fn(),
+  },
+  isPresentSubMenuAction: jest.requireActual("../../../modalState/types")
+    .isPresentSubMenuAction,
+}));
+
+describe("openBottomSheetAction custom content", () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it("opens default sheet with contentComponent body props", async () => {
+    const CustomContent = function CustomContent() {
+      return null;
+    };
+
+    const result = await openBottomSheetAction({
+      type: "openBottomSheet",
+      options: {
+        header: { title: "Create Playlist" },
+        content: {
+          component: CustomContent,
+          props: {
+            inputLabel: "Name your playlist",
+            buttonLabel: "Create",
+            defaultValue: "",
+            submitAction: { type: "sendCloudEvent", options: {} },
+          },
+        },
+      },
+    } as any);
+
+    expect(result).toBe(ActionResult.Success);
+    expect(openBottomSheetModal).toHaveBeenCalledTimes(1);
+    expect(modalOrchestrator.open).not.toHaveBeenCalled();
+
+    const args = (openBottomSheetModal as jest.Mock).mock.calls[0][0];
+    // Default ModalComponent provides the standard header
+    expect(args.ModalBottomSheetContent).toBeUndefined();
+
+    expect(args.modalBottomSheetContentProps).toMatchObject({
+      title: "Create Playlist",
+      contentComponent: CustomContent,
+      contentComponentProps: {
+        inputLabel: "Name your playlist",
+        buttonLabel: "Create",
+        defaultValue: "",
+      },
+    });
+  });
+
+  it("returns Error when neither list data nor content.component is provided", async () => {
+    const result = await openBottomSheetAction({
+      type: "openBottomSheet",
+      options: {
+        header: { title: "Empty" },
+        content: {},
+      },
+    } as any);
+
+    expect(result).toBe(ActionResult.Error);
+    expect(openBottomSheetModal).not.toHaveBeenCalled();
+    expect(modalOrchestrator.open).not.toHaveBeenCalled();
+  });
+});