@applicaster/zapp-react-native-utils 13.0.0-alpha.5428512514 → 13.0.0-alpha.5855333506

package/actionsExecutor/ActionExecutor.ts

@@ -17,9 +17,10 @@ class ActionExecutor {
 
   handleAction = async (
     action: ActionType,
-    entry: ZappEntry = null
+    context?: Record<string, any>
   ): Promise<ActionResult> => {
     const handler = this.registeredActions[action.type];
+    const entry = context?.entry as ZappEntry;
 
     if (!handler) {
       log_error(
@@ -32,17 +33,17 @@ class ActionExecutor {
 
     log_debug(
       `handleAction: ${action.type}${
-        entry ? `, entry id ${entry.id}, title: ${entry.title}` : ""
+        entry ? `, entry id ${entry?.id}, title: ${entry?.title}` : ""
       }`,
       { action, entry }
     );
 
     try {
-      return handler(action, entry);
+      return handler(action, context);
     } catch (error) {
       log_error(
         `handleAction: error handling action type: ${action.type}, message: ${error.message}`,
-        { action, entry, error }
+        { action, context, error }
       );
 
       throw error;
@@ -51,11 +52,11 @@ class ActionExecutor {
 
   handleActions = async (
     actionTypes: ActionType[],
-    entry: ZappEntry = null
+    context?: Record<string, any>
   ): Promise<ActionResult> => {
     for (const action of actionTypes) {
       // TODO: Handle action result error
-      const result = await this.handleAction(action, entry);
+      const result = await this.handleAction(action, context);
 
       if (result === ActionResult.Cancel) {
         log_info(`handleActions: action: ${action.type} canceled`);
@@ -67,7 +68,10 @@ class ActionExecutor {
     return ActionResult.Success;
   };
 
-  handleEntryActions = async (entry: ZappEntry): Promise<ActionResult> => {
+  handleEntryActions = async (
+    entry: ZappEntry,
+    context?: Record<string, any>
+  ): Promise<ActionResult> => {
     const tapActions = entry.extensions?.tap_actions?.actions;
 
     if (!tapActions) {
@@ -77,7 +81,7 @@ class ActionExecutor {
     if (!Array.isArray(tapActions)) {
       log_error(
         `handleEntryActions: tapActions is not an array for id: ${entry.id} title: ${entry.title}`,
-        { entry }
+        { context, entry }
       );
 
       return;
@@ -87,7 +91,7 @@ class ActionExecutor {
       return;
     }
 
-    await this.handleActions(tapActions, entry);
+    await this.handleActions(tapActions, { ...context, entry });
   };
 
   unregisterAction = (actionType: string) => {

package/actionsExecutor/ActionExecutorContext.tsx

@@ -13,6 +13,8 @@ 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";
 import {
   EntryResolver,
   resolveObjectValues,
@@ -23,18 +25,28 @@ const { log_error, log_info } = createLogger({
   category: "General",
 });
 
+// TODO: move entry inside options and rename options to context
 type ActionExecutorContextType = {
   registerAction: (
     type: string,
-    handler: (action: ActionType, entry: ZappEntry) => Promise<ActionResult>
+    handler: (
+      action: ActionType,
+      context?: Record<string, any>
+    ) => Promise<ActionResult>
   ) => void;
   unregisterAction: (type: string) => void;
-  handleAction: (action: ActionType, entry: ZappEntry) => Promise<ActionResult>;
+  handleAction: (
+    action: ActionType,
+    context?: Record<string, any>
+  ) => Promise<ActionResult>;
   handleActions: (
     actions: ActionType[],
-    entry: ZappEntry
+    context: Record<string, any>
+  ) => Promise<ActionResult>;
+  handleEntryActions: (
+    entry: ZappEntry,
+    context?: Record<string, any>
   ) => Promise<ActionResult>;
-  handleEntryActions: (entry: ZappEntry) => Promise<ActionResult>;
 };
 type Props = {
   children: React.ReactNode;
@@ -49,6 +61,31 @@ const prepareDefaultActions = (actionExecutor) => {
     return ActionResult.Success;
   });
 
+  actionExecutor.registerAction(
+    "refreshComponent",
+    async (_action, context) => {
+      const dispatch = appStore.getDispatch();
+
+      log_info("handleAction: refreshComponent event");
+
+      const dataSource = context?.component?.data?.source;
+
+      // TODO: Later we can pass component ids to do refresh instead of current one
+      // 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,
+          callback: (_data) => {},
+          riverId: context?.screenData?.id,
+        })
+      );
+
+      return ActionResult.Success;
+    }
+  );
+
   actionExecutor.registerAction("switchLayout", async (action) => {
     log_info("handleAction: switchLayout event");
 
@@ -84,10 +121,11 @@ const prepareDefaultActions = (actionExecutor) => {
     return confirmationPromise;
   });
 
-  actionExecutor.registerAction("sendCloudEvent", async (action, entry) => {
+  actionExecutor.registerAction("sendCloudEvent", async (action, context) => {
     try {
       const options = action.options;
 
+      const entry = context?.entry || {};
       const entryResolver = new EntryResolver(entry);
 
       const data =

package/appUtils/HooksManager/types.ts

@@ -4,6 +4,8 @@ import { HOOKS_EVENTS } from "./constants";
 export interface HookConfiguration {}
 
 /* existing Hook Plugn props: sample */
+
+/*
 interface _HookModulePlugin {
   Component:
     | React.FC<HookPluginProps>
@@ -23,6 +25,7 @@ interface _HookModulePlugin {
     presentUI: (payload?: HookPluginProps["payload"]) => void
   ) => any;
 }
+*/
 
 //* Derived from usage */
 export interface HookModule {

package/appUtils/accessibilityManager/index.ts

@@ -6,6 +6,9 @@ import { AccessibilityRole } from "react-native";
 
 export class AccessibilityManager {
   private static _instance: AccessibilityManager | null = null;
+  private headingTimeout: NodeJS.Timeout | null = null;
+  private WORDS_PER_MINUTE = 160;
+  private MINIMUM_PAUSE = 500;
   private state$ = new BehaviorSubject<AccessibilityState>({
     screenReaderEnabled: false,
     reduceMotionEnabled: false,
@@ -20,6 +23,7 @@ export class AccessibilityManager {
 
   private ttsManager = TTSManager.getInstance();
   private localizations: { [key: string]: string } = {};
+  private headingQueue: string[] = [];
 
   private constructor() {}
 
@@ -52,6 +56,28 @@ export class AccessibilityManager {
     return this.state$.asObservable();
   }
 
+  /** Calculates the reading time for a given text
+   * This method is a bit of a hack because we don't have a callback, or promise from VIZIO API
+   * @param text - The text to calculate the reading time for
+   * @returns The reading time in milliseconds
+   */
+  private calculateReadingTime(text: string): number {
+    const words = text.trim().split(/\s+/).length;
+
+    return Math.max(
+      this.MINIMUM_PAUSE,
+      (words / this.WORDS_PER_MINUTE) * 60 * 1000
+    );
+  }
+
+  /**
+   * Adds a heading to the queue, headings will be read before the next text
+   * Each heading will be read once and removed from the queue
+   */
+  public addHeading(heading: string) {
+    this.headingQueue.push(heading);
+  }
+
   /**
    * text you want to be read, if you want to use localized text pass keyOfLocalizedText instead
    * keyOfLocalizedText is the key to the localized text
@@ -85,7 +111,22 @@ export class AccessibilityManager {
       textToRead = localizedMessage;
     }
 
-    this.ttsManager && this.ttsManager.readText(textToRead);
+    if (this.headingQueue.length > 0) {
+      const heading = this.headingQueue.shift()!;
+      this.ttsManager?.readText(heading);
+
+      if (this.headingTimeout) {
+        clearTimeout(this.headingTimeout);
+      }
+
+      const pauseTime = this.calculateReadingTime(heading);
+
+      this.headingTimeout = setTimeout(() => {
+        this.ttsManager?.readText(textToRead);
+      }, pauseTime);
+    } else {
+      this.ttsManager?.readText(textToRead);
+    }
 
     this.announcements$.next({
       message: textToRead,

package/appUtils/focusManagerAux/utils/index.ts

@@ -1,8 +1,8 @@
 import { isNotNil } from "@applicaster/zapp-react-native-utils/reactUtils/helpers";
-import { find, last, startsWith, pathOr } from "ramda";
+import { find, last, pathOr, startsWith } from "ramda";
 import {
-  QUICK_BRICK_NAVBAR,
   QUICK_BRICK_CONTENT,
+  QUICK_BRICK_NAVBAR,
 } from "@applicaster/quick-brick-core/const";
 
 // run check each 300 ms
@@ -66,7 +66,8 @@ export const getContentNode = (focusableTree) => {
   const content = find(
     (child) =>
       startsWith(QUICK_BRICK_CONTENT, child.id) ||
-      startsWith("player", child.id),
+      startsWith("player", child.id) ||
+      startsWith("/hooks", child?.parent?.id), // For startup hooks case
     getActiveScreenChildren(focusableTree)
   );
 

package/appUtils/platform/const.ts

@@ -23,3 +23,17 @@ export const PLATFORMS = {
 export const PLATFORM_KEYS = {
   deviceClosedCaptioningEnabled: "device_closed_captioning_enabled",
 };
+
+export enum ZappPlatform {
+  Android = "android",
+  AndroidTV = "android_tv",
+  AmazonFireTV = "amazon",
+  iOS = "ios",
+  tvOS = "tvos",
+  Roku = "roku",
+  Tizen = "tizen",
+  Web = "web",
+  WebOS = "webos",
+  Vizio = "vizio",
+  Unknown = "unknown",
+}

package/appUtils/platform/platformUtils.ts

@@ -6,8 +6,10 @@ import {
   isSamsungPlatform,
 } from "@applicaster/zapp-react-dom-app/App/Loader/utils/platform";
 
-import { PLATFORM_KEYS, PLATFORMS } from "./const";
+import { PLATFORM_KEYS, PLATFORMS, ZappPlatform } from "./const";
 import { createLogger, utilsLogger } from "../../logger";
+import { getPlatform } from "../../reactUtils";
+import { appStore } from "@applicaster/zapp-react-native-redux/AppStore";
 
 const { log_debug } = createLogger({
   category: "General",
@@ -15,6 +17,20 @@ const { log_debug } = createLogger({
   parent: utilsLogger,
 });
 
+export const getZappPlatform = (): ZappPlatform => {
+  const platform = appStore.get("appData")?.platform;
+
+  switch (platform) {
+    case "amazon_fire_tv":
+      return ZappPlatform.AmazonFireTV;
+    case ZappPlatform.Vizio:
+      return ZappPlatform.Vizio;
+    default:
+      // TODO: Use only ZappPlatform enum
+      return getPlatform() as ZappPlatform;
+  }
+};
+
 export const getUserAgent = () => window?.navigator?.userAgent;
 
 /** VIZIO UTILS */

package/logger/const.ts

@@ -1,6 +1,3 @@
-/* eslint-disable unused-imports/no-unused-vars */
-import * as R from "ramda";
-
 enum XRayLogLevel {
   verbose = 0,
   debug = 1,
@@ -11,51 +8,9 @@ enum XRayLogLevel {
   off = 100,
 }
 
-enum ToastLogLevel {
-  off = "off",
-  verbose = "verbose",
-  debug = "debug",
-  info = "info",
-  warning = "warning",
-  error = "error",
-}
-
-const toastLevelToLogLevel = (toastLogLevel: ToastLogLevel): XRayLogLevel => {
-  if (R.isNil(toastLogLevel)) {
-    return XRayLogLevel.off;
-  }
-
-  switch (toastLogLevel) {
-    case ToastLogLevel.verbose:
-      return XRayLogLevel.verbose;
-    case ToastLogLevel.debug:
-      return XRayLogLevel.debug;
-    case ToastLogLevel.info:
-      return XRayLogLevel.info;
-    case ToastLogLevel.error:
-      return XRayLogLevel.error;
-    default:
-      return XRayLogLevel.off;
-  }
-};
-
-const PLUGIN_IDENTIFIER = "xray_logging_plugin";
-
-const wrapInObject = (obj, name) => {};
-
-const applyConditions = (wrappedObj) => {};
-
-const sanitizeEventPayload = () => {};
+const wrapInObject = (_ctx: unknown, _key: string) => {};
 
-const __isRunningRepoTests = () => {};
-
-const isWeb = () => {};
-
-const isDOMApp = () => {};
-
-const isBrowser = () => {};
-
-const eventAllowed = () => {};
+const applyConditions = (_fn: unknown) => {};
 
 /**
  * This is the mocked version of XRayLogger
@@ -90,34 +45,21 @@ export default class XRayLogger {
     );
   };
 
-  log = (event: string | XRayEventData) => {
-    const logEvent = typeof event === "string" ? { message: event } : event;
-  };
+  log = (_event) => {};
 
-  debug = (event: string | XRayEventData) => {
-    const logEvent = typeof event === "string" ? { message: event } : event;
-  };
+  debug = (_event) => {};
 
-  info = (event: string | XRayEventData) => {
-    const logEvent = typeof event === "string" ? { message: event } : event;
-  };
+  info = (_event) => {};
 
-  warning = (event: string | XRayEventData) => {
-    const logEvent = typeof event === "string" ? { message: event } : event;
-  };
+  warning = (_event) => {};
 
-  warn = (event: string | XRayEventData) => {
+  warn = (_event) => {
     this.warning(event);
   };
 
-  error = (event: Error | XRayEventData) => {
-    const logEvent: XRayEventData =
-      event instanceof Error
-        ? { exception: event as Error, message: event.message }
-        : (event as XRayEventData);
-  };
+  error = (_event) => {};
 
-  sendEvent = (event, eventData) => {};
+  sendEvent = (_event, _eventData) => {};
 
   // To be used by QuickBrick Hook events
   sendAudienceEvent = (event, eventData = null) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "13.0.0-alpha.5428512514",
+  "version": "13.0.0-alpha.5855333506",
   "description": "Applicaster Zapp React Native utilities package",
   "main": "index.js",
   "types": "index.d.ts",
@@ -28,7 +28,7 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "13.0.0-alpha.5428512514",
+    "@applicaster/applicaster-types": "13.0.0-alpha.5855333506",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "create-react-context": "^0.2.3",

package/reactHooks/cell-click/__tests__/index.test.js

@@ -25,6 +25,11 @@ jest.mock("@applicaster/zapp-react-native-utils/analyticsUtils/", () => ({
   }),
 }));
 
+jest.mock("@applicaster/zapp-react-native-utils/reactHooks/screen", () => ({
+  useTargetScreenData: jest.fn(() => ({})),
+  useCurrentScreenData: jest.fn(() => ({})),
+}));
+
 jest.mock("@applicaster/zapp-react-native-ui-components/Contexts", () => ({
   ...jest.requireActual(
     "@applicaster/zapp-react-native-ui-components/Contexts"

package/reactHooks/cell-click/index.ts

@@ -16,6 +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 } from "../screen";
 
 /**
  * If onCellTap is defined execute the function and
@@ -44,6 +45,7 @@ export const useCellClick = ({
 
   const onCellTap: Option<Function> = React.useContext(CellTapContext);
   const actionExecutor = React.useContext(ActionExecutorContext);
+  const screenData = useCurrentScreenData();
 
   const cellSelectable = toBooleanWithDefaultTrue(
     component?.rules?.component_cells_selectable
@@ -78,7 +80,10 @@ export const useCellClick = ({
       logOnPress(selectedItem, pathname, component, onCellTap);
 
       if (selectedItem) {
-        await actionExecutor?.handleEntryActions(selectedItem);
+        await actionExecutor?.handleEntryActions(selectedItem, {
+          component,
+          screenData,
+        });
       }
 
       if (selectedItem?.type?.value === "action") {
@@ -111,6 +116,7 @@ export const useCellClick = ({
       pathname,
       push,
       sendAnalyticsOnPress,
+      screenData,
     ]
   );
 

package/reactHooks/feed/useFeedLoader.tsx

@@ -87,7 +87,7 @@ export const useFeedLoader = ({
         );
       }
     }
-  }, [callableFeedUrl, currentFeed?.data]);
+  }, [callableFeedUrl, currentFeed?.data?.next]);
 
   useEffect(() => {
     if (

package/time/Timer.ts

@@ -4,7 +4,7 @@ export class Timer {
   private timeoutId: NodeJS.Timeout | null;
 
   constructor(private callback: () => void, private duration: number) {
-    this.remaining = duration;
+    this.remaining = this.duration;
     this.timeoutId = null;
   }