@applicaster/zapp-react-native-utils 16.0.0-rc.8 → 16.0.0-rc.80

package/actionsExecutor/ActionExecutor.ts

@@ -1,4 +1,5 @@
 import { createLogger } from "../logger";
+import type { ActionExecutionContext, ActionHandler } from "./types";
 
 export enum ActionResult {
   Success = "success",
@@ -11,13 +12,13 @@ const { log_error, log_debug, log_info } = createLogger({
   category: "General",
 });
 
-class ActionExecutor {
-  private registeredActions: Record<string, any> = {};
-  // TODO: Remove context
+export class ActionExecutor {
+  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,10 @@ 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>,
+    stateResolver?: (entry?: ZappEntry) => any
   ) => {
     if (this.registeredActions[type]) {
       log_error(`registerAction: action type: ${type} already registered`);
@@ -114,11 +113,48 @@ class ActionExecutor {
     this.registeredActions[type] = handler;
     log_debug(`registerAction: action type: ${type} registered`);
 
+    let unregisterState = () => {};
+
+    if (stateResolver) {
+      unregisterState = this.registerActionState(type, stateResolver);
+    }
+
     return () => {
       this.unregisterAction(type);
+      unregisterState();
       log_debug(`registerAction: action type: ${type} un-registered`);
     };
   };
+
+  private actionStates: Record<string, (entry?: ZappEntry) => any> = {};
+
+  registerActionState = (
+    type: string,
+    stateResolver: (entry?: ZappEntry) => any
+  ) => {
+    if (this.actionStates[type]) {
+      log_error(
+        `registerActionState: action type state: ${type} already registered`
+      );
+
+      return () => {};
+    }
+
+    this.actionStates[type] = stateResolver;
+    log_debug(`registerActionState: action type state: ${type} registered`);
+
+    return () => {
+      delete this.actionStates[type];
+
+      log_debug(
+        `registerActionState: action type state: ${type} un-registered`
+      );
+    };
+  };
+
+  getActionState = (type: string, entry?: ZappEntry) => {
+    return this.actionStates[type]?.(entry);
+  };
 }
 
 export const actionExecutor = new ActionExecutor();

package/actionsExecutor/ActionExecutorContext.tsx

@@ -5,300 +5,146 @@ 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,
+  createGoBackAction,
+  createGoHomeAction,
+  createNavigateToScreenAction,
+  dismissBottomSheetAction,
+  localStorageRemoveAction,
+  localStorageSetAction,
+  localStorageToggleFlagAction,
+  openBottomSheetAction,
+  refreshComponentAction,
+  screenSetVariableAction,
+  screenToggleFlagAction,
+  sendCloudEventAction,
+  sessionStorageRemoveAction,
+  sessionStorageSetAction,
+  sessionStorageToggleFlagAction,
+  switchLayoutAction,
+  showToastAction,
+} from "./actions";
+
+import { ACTION_TYPES } from "./consts";
 
 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>,
+    stateResolver?: (entry?: ZappEntry) => any
   ) => void;
   unregisterAction: (type: string) => void;
+  registerActionState: (
+    type: string,
+    stateResolver: (entry?: ZappEntry) => any
+  ) => () => void;
+  getActionState: (type: string, entry?: ZappEntry) => any;
   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(
-    "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;
-    }
+    ACTION_TYPES.LOCAL_STORAGE_SET,
+    localStorageSetAction
   );
 
-  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,
-      });
+  actionExecutor.registerAction(
+    ACTION_TYPES.SESSION_STORAGE_SET,
+    sessionStorageSetAction
+  );
 
-      log_info("handleAction: sendCloudEvent event", { cloudEvent });
+  actionExecutor.registerAction(
+    ACTION_TYPES.LOCAL_STORAGE_REMOVE,
+    localStorageRemoveAction
+  );
 
-      const { error, code } = await sendCloudEvent(cloudEvent, options.url);
+  actionExecutor.registerAction(
+    ACTION_TYPES.SESSION_STORAGE_REMOVE,
+    sessionStorageRemoveAction
+  );
 
-      if (error) {
-        log_error("sendCloudEvent: error sending cloud event", { error });
+  actionExecutor.registerAction(
+    ACTION_TYPES.REFRESH_COMPONENT,
+    refreshComponentAction
+  );
 
-        return ActionResult.Error;
-      }
+  actionExecutor.registerAction(ACTION_TYPES.SWITCH_LAYOUT, switchLayoutAction);
 
-      if (code && code >= 200 && code < 300 && !error) {
-        log_info("sendCloudEvent: cloud event sent successfully");
+  actionExecutor.registerAction(ACTION_TYPES.APP_RESTART, appRestartAction);
 
-        return ActionResult.Success;
-      }
-    } catch (error) {
-      log_error("sendCloudEvent: error sending cloud event", {
-        action,
-        error,
-      });
-    }
+  actionExecutor.registerAction(
+    ACTION_TYPES.CONFIRM_DIALOG,
+    confirmDialogAction
+  );
 
-    return ActionResult.Error;
-  });
+  actionExecutor.registerAction(
+    ACTION_TYPES.SEND_CLOUD_EVENT,
+    sendCloudEventAction
+  );
 
   actionExecutor.registerAction(
-    "sessionStorageToggleFlag",
-    async (
-      action: ActionType,
-      context?: Record<string, any>
-    ): Promise<ActionResult> => {
-      return await sessionStorageToggleFlag(context, action);
-    }
+    ACTION_TYPES.SESSION_STORAGE_TOGGLE_FLAG,
+    sessionStorageToggleFlagAction
   );
 
   actionExecutor.registerAction(
-    "localStorageToggleFlag",
-    async (
-      action: ActionType,
-      context?: Record<string, any>
-    ): Promise<ActionResult> => {
-      return await localStorageToggleFlag(context, action);
-    }
+    ACTION_TYPES.LOCAL_STORAGE_TOGGLE_FLAG,
+    localStorageToggleFlagAction
   );
 
   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
-      );
+    ACTION_TYPES.SCREEN_SET_VARIABLE,
+    screenSetVariableAction
+  );
 
-      return Promise.resolve(ActionResult.Success);
-    }
+  actionExecutor.registerAction(
+    ACTION_TYPES.SCREEN_TOGGLE_FLAG,
+    screenToggleFlagAction
   );
 
   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
-      );
+    ACTION_TYPES.OPEN_BOTTOM_SHEET,
+    openBottomSheetAction
+  );
 
-      return Promise.resolve(ActionResult.Success);
-    }
+  actionExecutor.registerAction(
+    ACTION_TYPES.DISMISS_BOTTOM_SHEET,
+    dismissBottomSheetAction
   );
+
+  actionExecutor.registerAction(ACTION_TYPES.SHOW_TOAST, showToastAction);
 };
 
 export const ActionExecutorContext =
@@ -316,6 +162,8 @@ export function withActionExecutor(Component) {
       return {
         unregisterAction: _actionExecutor.unregisterAction,
         registerAction: _actionExecutor.registerAction,
+        registerActionState: _actionExecutor.registerActionState,
+        getActionState: _actionExecutor.getActionState,
         handleAction: _actionExecutor.handleAction,
         handleActions: _actionExecutor.handleActions,
         handleEntryActions: _actionExecutor.handleEntryActions,
@@ -338,85 +186,24 @@ 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 });
+        ACTION_TYPES.NAVIGATE_TO_SCREEN,
+        createNavigateToScreenAction(navigator, rivers, contentTypes)
+      );
+    }, [navigator, rivers, contentTypes]);
 
-          if (navigationAction === "push") {
-            navigator.push(river);
-          } else {
-            navigator.replace(river);
-          }
+    useEffect(() => {
+      return _actionExecutor.registerAction(
+        ACTION_TYPES.GO_BACK,
+        createGoBackAction(navigator)
+      );
+    }, [navigator]);
 
-          return ActionResult.Success;
-        }
+    useEffect(() => {
+      return _actionExecutor.registerAction(
+        ACTION_TYPES.GO_HOME,
+        createGoHomeAction(navigator)
       );
-    }, [navigator, rivers, contentTypes]);
+    }, [navigator]);
 
     return (
       <ActionExecutorContext.Provider value={handlers}>

package/actionsExecutor/__tests__/feedDecorator.test.ts

@@ -0,0 +1,61 @@
+import { decorateFeed } from "../feedDecorator";
+
+const preferenceFeed = (selectMode: string) =>
+  ({
+    id: "agree-component",
+    title: "I agree to the terms",
+    type: { value: "feed" },
+    extensions: {
+      role: "preference_editor",
+      preference_editor_options: {
+        key: "agree",
+        scope: "screen",
+        select_mode: selectMode,
+      },
+    },
+    entry: [
+      {
+        id: "I agree to the terms-agree",
+        title: "I agree to the terms",
+        type: { value: "action" },
+        extensions: { tag: "true" },
+      },
+    ],
+  }) as unknown as ZappFeed;
+
+describe("decorateFeed", () => {
+  it("decorates single select feeds with screenSetVariable", () => {
+    const decorated = decorateFeed(preferenceFeed("single"));
+
+    expect(decorated.extensions.behavior).toEqual(
+      expect.objectContaining({
+        select_mode: "single",
+        current_selection: "@{screen/agree}",
+      })
+    );
+
+    expect(decorated.entry[0].extensions.tap_actions.actions[0].type).toBe(
+      "screenSetVariable"
+    );
+  });
+
+  it("decorates multi select feeds with screenToggleFlag", () => {
+    const decorated = decorateFeed(preferenceFeed("multi"));
+
+    expect(decorated.extensions.behavior.select_mode).toBe("multi");
+
+    expect(decorated.entry[0].extensions.tap_actions.actions[0].type).toBe(
+      "screenToggleFlag"
+    );
+  });
+
+  it("leaves a feed without the preference_editor role untouched", () => {
+    const feed = preferenceFeed("single");
+    feed.extensions.role = undefined;
+
+    const decorated = decorateFeed(feed);
+
+    expect(decorated.extensions.behavior).toBeUndefined();
+    expect(decorated.entry[0].extensions.tap_actions).toBeUndefined();
+  });
+});

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

@@ -0,0 +1,25 @@
+import { dismissBottomSheetAction } from "../dismissBottomSheet";
+import { dismissModal } from "../../../modalState";
+import { ActionResult } from "../../ActionExecutor";
+
+jest.mock("../../../modalState", () => ({
+  dismissModal: jest.fn(),
+  modalOrchestrator: {
+    close: 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);
+  });
+});