@applicaster/zapp-react-native-utils 14.0.0-alpha.1216545755 → 14.0.0-alpha.1384310723

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,19 +25,15 @@ import {
   resolveObjectValues,
 } from "../appUtils/contextKeysManager/contextResolver";
 import { useNavigation } from "../reactHooks";
+import { get } from "../utils";
 
 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 { screenSetVariable, screenToggleFlag } from "./ScreenActions";
 
 export const { log_error, log_info, log_debug } = createLogger({
   subsystem: "ActionExecutorContext",
@@ -85,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;
@@ -168,15 +178,10 @@ const prepareDefaultActions = (actionExecutor) => {
 
       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,
-            })
+          ? await resolveObjectValues(options.data, { entry: entryResolver })
           : options?.data || entry;
 
       const cloudEvent = await createCloudEvent({
@@ -210,57 +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;
-      const screenStateStore = context?.screenStateStore;
-
-      await screenToggleFlag(
-        screenRoute,
-        screenStateStore,
-        { entry: context?.entry, options: action.options },
-        action
-      );
+      if (!entry) {
+        log_error(
+          "handleAction: localStorageToggleFlag action missing entry. Entry is required to get the tag."
+        );
+
+        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/appUtils/accessibilityManager/index.ts

@@ -3,7 +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";
+import { toString } from "../../utils";
 
 export class AccessibilityManager {
   private static _instance: AccessibilityManager | null = null;
@@ -137,7 +137,7 @@ export class AccessibilityManager {
   }
 
   public getButtonAccessibilityProps(name: string): AccessibilityProps {
-    const buttonName = _.toString(name);
+    const buttonName = toString(name);
 
     const buttonConfig = BUTTON_ACCESSIBILITY_KEYS[buttonName];
 

package/appUtils/contextKeysManager/contextResolver.ts

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

package/manifestUtils/defaultManifestConfigurations/player.js

@@ -2985,6 +2985,14 @@ function getPlayerConfiguration({ platform, version }) {
             type: "uploader",
             default: "",
           },
+          {
+            key: "audio_player_background_image_overlay",
+            label: "Background Image Overlay",
+            label_tooltip:
+              "Add a semi-transparent color overlay to improve text readability over the background image.",
+            type: "color_picker_rgba",
+            initial_value: "rgba(17, 17, 17, 0.5)",
+          },
           {
             type: "text_input",
             label: "Item Image Key",

package/manifestUtils/keys.js

@@ -485,6 +485,18 @@ const TV_MENU_LABEL_FIELDS = [
     type: ZAPPIFEST_FIELDS.number_input,
     suffix: "LG letter spacing",
   },
+  {
+    type: ZAPPIFEST_FIELDS.font_selector.roku,
+    suffix: "Roku font family",
+  },
+  {
+    type: ZAPPIFEST_FIELDS.number_input,
+    suffix: "Roku font size",
+  },
+  {
+    type: ZAPPIFEST_FIELDS.number_input,
+    suffix: "Roku line height",
+  },
   {
     type: ZAPPIFEST_FIELDS.select,
     suffix: "text transform",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "14.0.0-alpha.1216545755",
+  "version": "14.0.0-alpha.1384310723",
   "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": "14.0.0-alpha.1216545755",
+    "@applicaster/applicaster-types": "14.0.0-alpha.1384310723",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "dayjs": "^1.11.10",

package/playerUtils/getPlayerActionButtons.ts

@@ -1,4 +1,4 @@
-import { take, map, trim } from "lodash";
+import { map, take, trim } from "../utils";
 import { selectActionButtons } from "../conf/player/selectors";
 
 /**

package/reactHooks/cell-click/index.ts

@@ -16,8 +16,7 @@ import { ActionExecutorContext } from "@applicaster/zapp-react-native-utils/acti
 import { isFunction, noop } from "../../functionUtils";
 import { useSendAnalyticsOnPress } from "../analytics";
 import { logOnPress, warnEmptyContentType } from "./helpers";
-import { useCurrentScreenData, useScreenContext } from "../screen";
-import { useScreenStateStore } from "../navigation/useScreenStateStore";
+import { useCurrentScreenData } from "../screen";
 
 /**
  * If onCellTap is defined execute the function and
@@ -43,12 +42,10 @@ export const useCellClick = ({
 }: Props): onPressReturnFn => {
   const { push, currentRoute } = useNavigation();
   const { pathname } = useRoute();
-  const screenStateStore = useScreenStateStore();
 
   const onCellTap: Option<Function> = React.useContext(CellTapContext);
   const actionExecutor = React.useContext(ActionExecutorContext);
   const screenData = useCurrentScreenData();
-  const screenState = useScreenContext()?.options;
 
   const cellSelectable = toBooleanWithDefaultTrue(
     component?.rules?.component_cells_selectable
@@ -86,9 +83,6 @@ export const useCellClick = ({
         await actionExecutor?.handleEntryActions(selectedItem, {
           component,
           screenData,
-          screenState,
-          screenRoute: pathname,
-          screenStateStore,
         });
       }
 
@@ -123,7 +117,6 @@ export const useCellClick = ({
       push,
       sendAnalyticsOnPress,
       screenData,
-      screenState,
     ]
   );
 

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

@@ -138,11 +138,6 @@ describe("useFeedLoader", () => {
       expect(loadPipesDataSpy).toBeCalledWith(feedUrl, {
         clearCache: true,
         riverId: undefined,
-        resolvers: {
-          screen: {
-            screenStateStore: undefined,
-          },
-        },
       });
 
       const store2 = mockStore({
@@ -184,11 +179,6 @@ describe("useFeedLoader", () => {
       expect(loadPipesDataSpy).toBeCalledWith(feedUrl, {
         clearCache: true,
         riverId: undefined,
-        resolvers: {
-          screen: {
-            screenStateStore: undefined,
-          },
-        },
       });
 
       const store2 = mockStore({
@@ -238,11 +228,6 @@ describe("useFeedLoader", () => {
         expect(loadPipesDataSpy).toBeCalledWith(feedUrl, {
           clearCache: true,
           silentRefresh: true,
-          resolvers: {
-            screen: {
-              screenStateStore: undefined,
-            },
-          },
         });
 
         loadPipesDataSpy.mockRestore();
@@ -282,11 +267,6 @@ describe("useFeedLoader", () => {
         expect(loadPipesDataSpy).toBeCalledWith(nextUrl, {
           parentFeed: feedUrlWithNext,
           silentRefresh: true,
-          resolvers: {
-            screen: {
-              screenStateStore: undefined,
-            },
-          },
         });
 
         loadPipesDataSpy.mockRestore();

package/reactHooks/feed/useFeedLoader.tsx

@@ -8,7 +8,6 @@ import { reactHooksLogger } from "../logger";
 import { shouldDispatchData, useIsInitialRender } from "../utils";
 import { useInflatedUrl } from "./useInflatedUrl";
 import { useRoute } from "../navigation";
-import { useScreenResolvers } from "@applicaster/zapp-react-native-utils/actionsExecutor/screenResolver";
 
 const logger = reactHooksLogger.addSubsystem("useFeedLoader");
 
@@ -52,7 +51,6 @@ export const useFeedLoader = ({
   const isInitialRender = useIsInitialRender();
   const dispatch = useDispatch();
   const { screenData } = useRoute();
-  const resolvers = useScreenResolvers();
 
   const callableFeedUrl = useInflatedUrl({ feedUrl, mapping });
 
@@ -71,12 +69,11 @@ export const useFeedLoader = ({
             silentRefresh,
             callback,
             riverId,
-            resolvers,
           })
         );
       }
     },
-    [callableFeedUrl, resolvers]
+    [callableFeedUrl]
   );
 
   const loadNext: FeedLoaderResponse["loadNext"] = React.useCallback(() => {
@@ -89,12 +86,11 @@ export const useFeedLoader = ({
             silentRefresh: true,
             parentFeed: callableFeedUrl,
             riverId,
-            resolvers,
           })
         );
       }
     }
-  }, [callableFeedUrl, currentFeed?.data?.next, resolvers]);
+  }, [callableFeedUrl, currentFeed?.data?.next]);
 
   useEffect(() => {
     if (
@@ -106,7 +102,6 @@ export const useFeedLoader = ({
             ...pipesOptions,
             clearCache: true,
             riverId,
-            resolvers,
           })
         );
       } else if (!callableFeedUrl) {
@@ -131,16 +126,14 @@ export const useFeedLoader = ({
         jsOnly: true,
       });
     }
-  }, [resolvers]);
+  }, []);
 
   // Reload feed when feedUrl changes, unless skipLoading is true
   useEffect(() => {
     if (!isInitialRender && callableFeedUrl && !pipesOptions.skipLoading) {
-      dispatch(
-        loadPipesData(callableFeedUrl, { ...pipesOptions, riverId, resolvers })
-      );
+      dispatch(loadPipesData(callableFeedUrl, { ...pipesOptions, riverId }));
     }
-  }, [callableFeedUrl, resolvers]);
+  }, [callableFeedUrl]);
 
   return React.useMemo(() => {
     if (!callableFeedUrl || !feedUrl) {

package/reactHooks/navigation/useRoute.ts

@@ -28,19 +28,14 @@ const isHookPathname = (pathname: string) => /^\/hooks\//.test(pathname);
 
 type VariousScreenData = LegacyNavigationScreenData | ZappRiver | ZappEntry;
 
-export const useRoute = (
-  useLegacy = true
-): {
+export const useRoute = (): {
   screenData: VariousScreenData;
   pathname: string;
 } => {
   const pathname = usePathname() || "";
   const navigator = useNavigation();
-  const screenContext = useContext(ScreenDataContext);
 
-  const screenDataContext = useLegacy
-    ? legacyScreenData(screenContext)
-    : screenContext;
+  const screenDataContext = legacyScreenData(useContext(ScreenDataContext));
 
   const { plugins, contentTypes, rivers } = usePickFromState([
     "plugins",

package/time/BackgroundTimer.ts

@@ -13,13 +13,15 @@ class BackgroundTimer {
 
     const EventEmitter = platformSelect({
       android: DeviceEventEmitter,
-      ios: undefined,
+      android_tv: DeviceEventEmitter,
+      amazon: DeviceEventEmitter, // probably does not exist and uses android_tv
       default: undefined,
     });
 
     EventEmitter?.addListener("BackgroundTimer.timer.fired", (id: number) => {
-      if (this.callbacks[id]) {
-        const callback = this.callbacks[id];
+      const callback = this.callbacks[id];
+
+      if (callback) {
         delete this.callbacks[id];
         callback();
       }

package/utils/index.ts

@@ -13,4 +13,8 @@ export {
   has,
   flatMap,
   difference,
+  take,
+  map,
+  trim,
+  toString,
 } from "lodash";

package/actionsExecutor/ScreenActions.ts

@@ -1,92 +0,0 @@
-// import { localStorage } from "@applicaster/zapp-react-native-bridge/ZappStorage/LocalStorage";
-
-import { log_error, log_info } from "./ActionExecutorContext";
-import { ActionResult } from "./ActionExecutor";
-import { get } from "lodash";
-
-import { onMaxTagsReached } from "./StorageActions";
-import { ScreenMultiSelectProvider } from "../storage/ScreenStateMultiSelectProvider";
-
-export const screenSetVariable = (
-  _screenRoute: string,
-  _key: string,
-  _value: string
-) => {};
-
-export const screenToggleFlag = async (
-  screenRoute: string,
-  screenStateStore: ScreenStateStore,
-  context: Record<string, any>,
-  action: ActionType
-) => {
-  if (!context) {
-    log_error("handleAction: screenToggleFlag action missing context");
-
-    return ActionResult.Error;
-  }
-
-  const entry = context?.entry as ZappEntry;
-
-  if (!entry) {
-    log_error(
-      "handleAction: screenToggleFlag action missing entry. Entry is required to get the tag."
-    );
-
-    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 = ScreenMultiSelectProvider.getProvider(
-      keyNamespace,
-      screenRoute,
-      screenStateStore
-    );
-
-    const selectedItems = await multiSelectProvider.getSelectedAsync();
-    const isTagInSelectedItems = selectedItems.includes(tag);
-
-    log_info(
-      `handleAction: screenToggleFlag event will ${
-        isTagInSelectedItems ? "remove" : "add"
-      } tag: ${tag} for keyNamespace: ${keyNamespace}, current selectedItems: ${selectedItems}`
-    );
-
-    if (selectedItems.includes(tag)) {
-      await multiSelectProvider.removeItem(tag);
-    } else {
-      const maxItems = action.options?.max_items;
-
-      if (maxItems && selectedItems.length >= maxItems) {
-        log_info(
-          `handleAction: screenToggleFlag 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: screenToggleFlag event missing keyNamespace or tag",
-      { keyNamespace, tag }
-    );
-
-    return ActionResult.Error;
-  }
-
-  return ActionResult.Success;
-};