@applicaster/zapp-react-native-utils 14.0.0-alpha.1661204539 → 14.0.0-alpha.2247415563

package/actionsExecutor/ActionExecutorContext.tsx

@@ -16,6 +16,7 @@ import { QUICK_BRICK_EVENTS } from "@applicaster/zapp-react-native-bridge/QuickB
 import { showConfirmationDialog } from "../alertUtils";
 import { createCloudEvent, sendCloudEvent } from "../cloudEventsUtils";
 import { createLogger } from "../logger";
+import { StorageMultiSelectProvider } from "@applicaster/zapp-react-native-bridge/ZappStorage/StorageMultiSelectProvider";
 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";
@@ -24,20 +25,15 @@ import {
   resolveObjectValues,
 } from "../appUtils/contextKeysManager/contextResolver";
 import { useNavigation } from "../reactHooks";
+import { get } from "lodash";
 
 import {
   useContentTypes,
   usePickFromState,
 } from "@applicaster/zapp-react-native-redux/hooks";
-import { useSubscriberFor } from "../reactHooks/useSubscriberFor";
+import { TOGGLE_FLAG_MAX_ITEMS_REACHED_EVENT } from "./consts";
+import { postEvent, useSubscriberFor } from "../reactHooks/useSubscriberFor";
 import { APP_EVENTS } from "../appUtils/events";
-import {
-  localStorageToggleFlag,
-  sessionStorageToggleFlag,
-} from "./StorageActions";
-
-import { ScreenSingleValueProvider } from "@applicaster/zapp-react-native-utils/storage/ScreenSingleValueProvider";
-import { screenSetVariable, screenToggleFlag } from "./ScreenActions";
 
 export const { log_error, log_info, log_debug } = createLogger({
   subsystem: "ActionExecutorContext",
@@ -86,6 +82,19 @@ function findParentComponent(
   return null;
 }
 
+// send all data just in case (like for message string formatting)
+// Type is not exported for now
+type MaxTagsReachedEvent = {
+  selectedItems: string[];
+  maxItems: number;
+  tag: string;
+  keyNamespace: string;
+};
+
+async function onMaxTagsReached(data: MaxTagsReachedEvent) {
+  postEvent(TOGGLE_FLAG_MAX_ITEMS_REACHED_EVENT, [data]);
+}
+
 const prepareDefaultActions = (actionExecutor) => {
   actionExecutor.registerAction("localStorageSet", async (action) => {
     const namespaces = action.options.content;
@@ -169,16 +178,10 @@ const prepareDefaultActions = (actionExecutor) => {
 
       const entry = context?.entry || {};
       const entryResolver = new EntryResolver(entry);
-      const route = context.screenRoute;
-      const screenData = ScreenSingleValueProvider.getState(route) as any;
-      const screenResolver = new EntryResolver(screenData || {});
 
       const data =
         options?.data && options.inflateData
-          ? await resolveObjectValues(options.data, {
-              entry: entryResolver,
-              screen: screenResolver,
-            })
+          ? await resolveObjectValues(options.data, { entry: entryResolver })
           : options?.data || entry;
 
       const cloudEvent = await createCloudEvent({
@@ -212,55 +215,81 @@ const prepareDefaultActions = (actionExecutor) => {
     return ActionResult.Error;
   });
 
-  actionExecutor.registerAction(
-    "sessionStorageToggleFlag",
-    async (
-      action: ActionType,
-      context?: Record<string, any>
-    ): Promise<ActionResult> => {
-      return await sessionStorageToggleFlag(context, action);
-    }
-  );
-
   actionExecutor.registerAction(
     "localStorageToggleFlag",
     async (
       action: ActionType,
       context?: Record<string, any>
     ): Promise<ActionResult> => {
-      return await localStorageToggleFlag(context, action);
-    }
-  );
+      if (!context) {
+        log_error(
+          "handleAction: localStorageToggleFlag action missing context"
+        );
 
-  actionExecutor.registerAction(
-    "screenSetVariable",
-    async (
-      action: ActionType,
-      context?: Record<string, any>
-    ): Promise<ActionResult> => {
-      const route = context?.screenRoute;
-      const { key, value } = action.options;
-      screenSetVariable(route, key, value);
+        return ActionResult.Error;
+      }
 
-      return Promise.resolve(ActionResult.Success);
-    }
-  );
+      const entry = context?.entry as ZappEntry;
 
-  actionExecutor.registerAction(
-    "screenToggleFlag",
-    async (
-      action: ActionType,
-      context?: Record<string, any>
-    ): Promise<ActionResult> => {
-      const screenRoute = context?.screenRoute;
+      if (!entry) {
+        log_error(
+          "handleAction: localStorageToggleFlag action missing entry. Entry is required to get the tag."
+        );
 
-      await screenToggleFlag(
-        screenRoute,
-        { entry: context?.entry, options: action.options },
-        action
-      );
+        return ActionResult.Error;
+      }
+
+      const tag = action.options?.selector
+        ? get(entry, action.options.selector)
+        : (entry.extensions?.tag ?? entry.id);
+
+      const keyNamespace = action.options?.key;
+
+      if (keyNamespace && tag) {
+        const multiSelectProvider =
+          StorageMultiSelectProvider.getProvider(keyNamespace);
+
+        const selectedItems = await multiSelectProvider.getSelectedAsync();
+        const isTagInSelectedItems = selectedItems.includes(tag);
+
+        log_info(
+          `handleAction: localStorageToggleFlag event will ${
+            isTagInSelectedItems ? "remove" : "add"
+          } tag: ${tag} for keyNamespace: ${keyNamespace}, current selectedItems: ${selectedItems}`
+        );
 
-      return Promise.resolve(ActionResult.Success);
+        if (selectedItems.includes(tag)) {
+          await multiSelectProvider.removeItem(tag);
+        } else {
+          const maxItems = action.options?.max_items;
+
+          if (maxItems && selectedItems.length >= maxItems) {
+            log_info(
+              `handleAction: localStorageToggleFlag event reached max items limit: ${maxItems}, cannot add tag: ${tag}`
+            );
+
+            await onMaxTagsReached({
+              selectedItems,
+              maxItems,
+              tag,
+              keyNamespace,
+            });
+
+            return ActionResult.Cancel;
+          }
+
+          await multiSelectProvider.addItem(tag);
+        }
+      } else {
+        log_error(
+          "handleAction: localStorageToggleFlag event missing keyNamespace or tag",
+          { keyNamespace, tag }
+        );
+
+        return ActionResult.Error;
+      }
+
+      return ActionResult.Success;
     }
   );
 };

package/analyticsUtils/AnalyticsEvents/sendHeaderClickEvent.ts

@@ -4,7 +4,7 @@ import { postAnalyticEvent } from "../manager";
 import { ANALYTICS_CORE_EVENTS } from "../events";
 
 type SendHeaderClickEventProps = {
-  extraProps: ExtraProps;
+  extraProps: Record<string, any>;
   component?: ZappUIComponent;
   zappPipesData?: ZappPipesData;
   item?: ZappEntry;

package/analyticsUtils/AnalyticsEvents/sendMenuClickEvent.ts

@@ -1,10 +1,11 @@
+/// <reference types="../../" />
 import { log_error, log_debug } from "../logger";
 import { replaceAnalyticsPropsNils } from "./helper";
 import { postAnalyticEvent } from "../manager";
 
 import { ANALYTICS_CORE_EVENTS } from "../events";
 
-declare type AnalyticsDefaultHelperProperties = {
+type AnalyticsDefaultHelperProperties = {
   analyticsScreenData: AnalyticsScreenProperties;
   extraProps: any;
   props;

package/analyticsUtils/index.tsx

@@ -1,4 +1,3 @@
-/// <reference types="@applicaster/zapp-react-native-utils" />
 import * as R from "ramda";
 import * as React from "react";
 import { isWeb } from "@applicaster/zapp-react-native-utils/reactUtils";
@@ -31,7 +30,7 @@ import { ANALYTICS_CORE_EVENTS } from "./events";
 import { noop } from "../functionUtils";
 
 type ComponentWithChildrenProps = {
-  children: React.ReactChildren;
+  children: React.ReactElement;
 };
 
 export function sendSelectCellEvent(item, component, headerTitle, itemIndex) {
@@ -120,11 +119,11 @@ export function getAnalyticsFunctions({
 export const AnalyticsContext =
   React.createContext<GetAnalyticsFunctions>(noop);
 
-export function AnalyticsProvider(props: ComponentWithChildrenProps) {
+export function AnalyticsProvider({ children }: ComponentWithChildrenProps) {
   return (
     // @ts-ignore - this is a valid context provider
     <AnalyticsContext.Provider value={getAnalyticsFunctions}>
-      {props?.children}
+      {children}
     </AnalyticsContext.Provider>
   );
 }

package/analyticsUtils/manager.ts

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-use-before-define */
 import * as R from "ramda";
 import { NativeModules } from "react-native";
-import { ANALYTICS_CORE_EVENTS } from "@applicaster/zapp-react-native-utils/analyticsUtils/events";
+import { ANALYTICS_CORE_EVENTS } from "./events";
 
 import { analyticsUtilsLogger } from "./logger";
 

package/appUtils/accessibilityManager/index.ts

@@ -3,6 +3,7 @@ import { accessibilityManagerLogger as logger } from "./logger";
 import { TTSManager } from "../platform/platformUtils";
 import { BUTTON_ACCESSIBILITY_KEYS } from "./const";
 import { AccessibilityRole } from "react-native";
+import _ from "lodash";
 
 export class AccessibilityManager {
   private static _instance: AccessibilityManager | null = null;
@@ -135,7 +136,9 @@ export class AccessibilityManager {
     });
   }
 
-  public getButtonAccessibilityProps(buttonName: string): AccessibilityProps {
+  public getButtonAccessibilityProps(name: string): AccessibilityProps {
+    const buttonName = _.toString(name);
+
     const buttonConfig = BUTTON_ACCESSIBILITY_KEYS[buttonName];
 
     if (!buttonConfig) {

package/appUtils/contextKeysManager/contextResolver.ts

@@ -1,12 +1,10 @@
 import { ContextKeysManager } from "./index";
 import * as R from "ramda";
-import { screenStates } from "@applicaster/zapp-react-native-utils/storage/ScreenSingleValueProvider";
 
-export interface IResolver {
+interface IResolver {
   resolve: (string) => Promise<string | number | object>;
 }
 
-// TODO: Rename to ObjectKeyResolver or similar
 export class EntryResolver implements IResolver {
   entry: ZappEntry;
 
@@ -23,18 +21,6 @@ export class EntryResolver implements IResolver {
   }
 }
 
-// TODO: Move to proper place
-
-export class ScreenStateResolver implements IResolver {
-  constructor(private route: string) {}
-
-  async resolve(key: string) {
-    const screenState = screenStates[this.route];
-
-    return screenState?.[key];
-  }
-}
-
 export class ContextResolver implements IResolver {
   resolve = async (compositeKey: string) =>
     ContextKeysManager.instance.getKey(compositeKey);

package/arrayUtils/__tests__/isEmptyArray.test.ts

@@ -0,0 +1,63 @@
+import { isEmptyArray } from "..";
+
+describe("isEmptyArray", () => {
+  it("non-empty array is not empty", () => {
+    const value = [1, 2, 3];
+
+    expect(isEmptyArray(value)).toBe(false);
+  });
+
+  it("empty array is empty", () => {
+    const value = [];
+
+    expect(isEmptyArray(value)).toBe(true);
+  });
+
+  it("number is not array", () => {
+    const value = 123;
+
+    expect(isEmptyArray(value)).toBe(false);
+  });
+
+  it("string is not array", () => {
+    const value = "vfnjdk";
+
+    expect(isEmptyArray(value)).toBe(false);
+  });
+
+  it("empty string is not array", () => {
+    const value = "";
+
+    expect(isEmptyArray(value)).toBe(false);
+  });
+
+  it("NaN is not array", () => {
+    const value = NaN;
+
+    expect(isEmptyArray(value)).toBe(false);
+  });
+
+  it("object is not array", () => {
+    const value = { test: 1 };
+
+    expect(isEmptyArray(value)).toBe(false);
+  });
+
+  it("empty object is not array", () => {
+    const value = {};
+
+    expect(isEmptyArray(value)).toBe(false);
+  });
+
+  it("undefined is not array", () => {
+    const value = undefined;
+
+    expect(isEmptyArray(value)).toBe(false);
+  });
+
+  it("null is not array", () => {
+    const value = null;
+
+    expect(isEmptyArray(value)).toBe(false);
+  });
+});

package/arrayUtils/__tests__/isFilledArray.test.ts

@@ -32,7 +32,7 @@ describe("isFilledArray", () => {
   });
 
   it("NaN is not array", () => {
-    const value = "";
+    const value = NaN;
 
     expect(isFilledArray(value)).toBe(false);
   });

package/arrayUtils/index.ts

@@ -99,12 +99,17 @@ export const makeListOf = (value: unknown, size: number): number[] => {
 
 /** Checks if a value is a non-empty array */
 export function isFilledArray(value: unknown): boolean {
-  return R.is(Array, value) && R.length(value) > 0;
+  return Array.isArray(value) && value.length > 0;
+}
+
+/** Checks if a value is a empty array */
+export function isEmptyArray(value: unknown): boolean {
+  return Array.isArray(value) && value.length === 0;
 }
 
 // get random item from the list
 export const sample = (xs: unknown[]): unknown => {
-  invariant(R.is(Array, xs), `input value is not a array: ${xs}`);
+  invariant(Array.isArray(xs), `input value is not an array: ${xs}`);
   invariant(isFilledArray(xs), `input array is empty: ${xs}`);
 
   const index = Math.floor(Math.random() * xs.length);

package/audioPlayerUtils/__tests__/getArtworkImage.test.ts

@@ -0,0 +1,144 @@
+import { getArtworkImage } from "..";
+import { DEFAULT_IMAGE } from "../assets";
+
+describe("getArtworkImage", () => {
+  const entryWithImage = {
+    media_group: [
+      {
+        type: "image",
+        media_item: [
+          { key: "artwork_key", src: "image_from_entry" },
+          { key: "other_key", src: "other_image" },
+        ],
+      },
+    ],
+    extensions: {
+      artwork_key: "artwork_key",
+    },
+  };
+
+  const entryWithoutImage = {
+    media_group: [
+      {
+        type: "image",
+        media_item: [{ key: "other_key", src: "other_image" }],
+      },
+    ],
+    extensions: {
+      artwork_key: "artwork_key",
+    },
+  };
+
+  const pluginConfigWithImage = {
+    artwork_key: "plugin_artwork_key",
+  };
+
+  it("returns image from entry extensions key", () => {
+    const result = getArtworkImage({
+      key: "artwork_key",
+      entry: entryWithImage,
+      plugin_configuration: {},
+    });
+
+    expect(result).toBe("image_from_entry");
+  });
+
+  it("returns image from plugin configuration key if not in entry", () => {
+    const entryNoMatch = {
+      ...entryWithoutImage,
+      extensions: { artwork_key: "not_found_key" },
+    };
+
+    const pluginConfig = {
+      artwork_key: "plugin_artwork_key",
+    };
+
+    const entryWithPluginImage = {
+      ...entryNoMatch,
+      media_group: [
+        {
+          type: "image",
+          media_item: [{ key: "plugin_artwork_key", src: "image_from_plugin" }],
+        },
+      ],
+    };
+
+    const result = getArtworkImage({
+      key: "artwork_key",
+      entry: entryWithPluginImage,
+      plugin_configuration: pluginConfig,
+    });
+
+    expect(result).toBe("image_from_plugin");
+  });
+
+  it("returns DEFAULT_IMAGE if neither entry nor plugin configuration has image", () => {
+    const entryNoImage = {
+      media_group: [
+        {
+          type: "image",
+          media_item: [{ key: "other_key", src: "other_image" }],
+        },
+      ],
+      extensions: { artwork_key: "not_found_key" },
+    };
+
+    const pluginConfig = { artwork_key: "not_found_key" };
+
+    const result = getArtworkImage({
+      key: "artwork_key",
+      entry: entryNoImage,
+      plugin_configuration: pluginConfig,
+    });
+
+    expect(result).toBe(DEFAULT_IMAGE);
+  });
+
+  it("handles undefined key gracefully", () => {
+    const result = getArtworkImage({
+      key: undefined,
+      entry: entryWithImage,
+      plugin_configuration: pluginConfigWithImage,
+    });
+
+    expect(result).toBe(DEFAULT_IMAGE);
+  });
+
+  it("handles missing entry or plugin_configuration gracefully", () => {
+    const result = getArtworkImage({
+      key: "artwork_key",
+      entry: undefined,
+      plugin_configuration: undefined,
+    });
+
+    expect(result).toBe(DEFAULT_IMAGE);
+  });
+
+  it("handles empty media_group", () => {
+    const entryEmptyMedia = {
+      media_group: [],
+      extensions: { artwork_key: "artwork_key" },
+    };
+
+    const result = getArtworkImage({
+      key: "artwork_key",
+      entry: entryEmptyMedia,
+      plugin_configuration: pluginConfigWithImage,
+    });
+
+    expect(result).toBe(DEFAULT_IMAGE);
+  });
+
+  it("handles missing extensions/config keys", () => {
+    const entryNoExt = { media_group: [], extensions: {} };
+    const pluginConfig = {};
+
+    const result = getArtworkImage({
+      key: "artwork_key",
+      entry: entryNoExt,
+      plugin_configuration: pluginConfig,
+    });
+
+    expect(result).toBe(DEFAULT_IMAGE);
+  });
+});

package/audioPlayerUtils/__tests__/getBackgroundImage.test.ts

@@ -0,0 +1,72 @@
+import { getBackgroundImage } from "..";
+import { DEFAULT_IMAGE } from "../assets";
+
+describe("getBackgroundImage", () => {
+  const entryBase = {
+    media_group: [
+      {
+        media_item: [
+          { key: "image_key_1", src: "image_src_1" },
+          { key: "image_key_2", src: "image_src_2" },
+        ],
+        type: "image",
+      },
+    ],
+    extensions: {},
+  };
+
+  const pluginConfigBase = {};
+
+  it("returns image from entry.extensions.image_key if present", () => {
+    const entry = {
+      ...entryBase,
+      extensions: { image_key: "image_key_2" },
+    };
+
+    const result = getBackgroundImage({
+      entry,
+      plugin_configuration: pluginConfigBase,
+    });
+
+    expect(result).toBe("image_src_2");
+  });
+
+  it("returns audio_player_background_image from entry.extensions if present and no image_key image", () => {
+    const entry = {
+      ...entryBase,
+      extensions: { audio_player_background_image: "audio_img_ext" },
+    };
+
+    const result = getBackgroundImage({
+      entry,
+      plugin_configuration: pluginConfigBase,
+    });
+
+    expect(result).toBe("audio_img_ext");
+  });
+
+  it("returns image from plugin_configuration.audio_player_image_key if present and not found in entry.extensions", () => {
+    const entry = { ...entryBase };
+    const plugin_configuration = { audio_player_image_key: "image_key_1" };
+    const result = getBackgroundImage({ entry, plugin_configuration });
+    expect(result).toBe("image_src_1");
+  });
+
+  it("returns audio_player_background_image from plugin_configuration if present and not found in entry/extensions", () => {
+    const entry = { ...entryBase };
+
+    const plugin_configuration = {
+      audio_player_background_image: "audio_img_conf",
+    };
+
+    const result = getBackgroundImage({ entry, plugin_configuration });
+    expect(result).toBe("audio_img_conf");
+  });
+
+  it("returns DEFAULT_IMAGE if nothing is found", () => {
+    const entry = { media_group: [], extensions: {} };
+    const plugin_configuration = {};
+    const result = getBackgroundImage({ entry, plugin_configuration });
+    expect(result).toBe(DEFAULT_IMAGE);
+  });
+});