@applicaster/zapp-react-native-utils 13.0.0-alpha.7222542422 → 13.0.0-alpha.7846284820

package/appUtils/HooksManager/Hook.ts

@@ -16,7 +16,7 @@ const BASE_HOOK_PROPERTIES = ["screen_id", "identifier", "weight"];
  * @returns {number} index
  */
 const hookState: (
-  arg0: typeof HOOKS_EVENTS[keyof typeof HOOKS_EVENTS]
+  arg0: (typeof HOOKS_EVENTS)[keyof typeof HOOKS_EVENTS]
 ) => number = R.indexOf(R.__, R.values(HOOKS_EVENTS));
 
 /**
@@ -62,7 +62,7 @@ export class Hook implements HookInterface {
    * @param {Array<Any>} args variadic arguments to invoke the handler with
    */
   setStateAndNotify(
-    event: typeof HOOKS_EVENTS[keyof typeof HOOKS_EVENTS],
+    event: (typeof HOOKS_EVENTS)[keyof typeof HOOKS_EVENTS],
     ...args
   ) {
     this.state = hookState(event);

package/appUtils/HooksManager/types.ts

@@ -103,7 +103,7 @@ export interface Hook<T extends HookModule = HookModule> {
   identifier: string;
   configuration: T["configuration"];
   setStateAndNotify(
-    event: typeof HOOKS_EVENTS[keyof typeof HOOKS_EVENTS],
+    event: (typeof HOOKS_EVENTS)[keyof typeof HOOKS_EVENTS],
     opts: {
       error?: typeof Error;
       route?: string;
@@ -112,7 +112,7 @@ export interface Hook<T extends HookModule = HookModule> {
     }
   );
   general?: {
-    transition_type: typeof HOOKS_EVENTS[keyof typeof HOOKS_EVENTS];
+    transition_type: (typeof HOOKS_EVENTS)[keyof typeof HOOKS_EVENTS];
     allow_screen_plugin_presentation: boolean;
     is_flow_blocker: boolean;
   };

package/appUtils/contextKeysManager/contextResolver.ts

@@ -42,12 +42,16 @@ export const resolveObjectValues = async (
 
   const resolvedEntries = await Promise.all(
     entries.map(async ([key, value]) => {
-      const regex = /@{([^/]+)\/([^}]*)}/;
-
       if (typeof value !== "string") {
         return [key, value];
       }
 
+      if (!value.startsWith("@")) {
+        return [key, value];
+      }
+
+      const regex = /@{([^/]+)\/([^}]*)}/;
+
       const match = (value as string).match(regex);
 
       if (match) {

package/appUtils/focusManager/index.ts

@@ -13,6 +13,7 @@ import {
 import { subscriber } from "../../functionUtils";
 import { coreLogger } from "../../logger";
 import { ACTION } from "./utils/enums";
+
 const logger = coreLogger.addSubsystem("focusManager");
 
 const isFocusEnabled = (focusableItem): boolean => {
@@ -325,8 +326,6 @@ export const focusManager = (function () {
         },
       });
 
-      currentFocusNode = focusCandidate;
-
       focusableItem && setFocus(focusCandidate.id, null);
 
       return { success: true };
@@ -477,7 +476,7 @@ export const focusManager = (function () {
   function isCurrentFocusOnTheTopScreen() {
     const routes = R.pathOr([], ["root", "children"], focusableTree);
 
-    if (routes.length <= 1) {
+    if (currentFocusNode && routes.length <= 1) {
       // there is only one or zero routes
       return true;
     }

package/appUtils/playerManager/player.ts

@@ -154,8 +154,8 @@ export class Player {
     this.isSeeking()
       ? this.playerState.seekPosition
       : this.playerState.adState
-      ? this.playerState.adState.adPosition
-      : this.playerState.contentPosition;
+        ? this.playerState.adState.adPosition
+        : this.playerState.contentPosition;
 
   getEntry = (): ZappEntry | null => this.entry;
 

package/idleUtils/__tests__/withTimeout$.test.ts

@@ -0,0 +1,37 @@
+import { TestScheduler } from "rxjs/testing";
+
+import { withTimeout$ } from "..";
+
+describe("withTimeout$", () => {
+  let testScheduler: TestScheduler;
+
+  beforeEach(() => {
+    testScheduler = new TestScheduler((actual, expected) => {
+      expect(actual).toEqual(expected);
+    });
+  });
+
+  it("should emit undefined after the specified timeout", () => {
+    testScheduler.run(({ expectObservable }) => {
+      const timeout = 1000;
+      const expectedMarble = "1s (a|)";
+      const expectedValues = { a: undefined };
+
+      const result$ = withTimeout$(timeout);
+
+      expectObservable(result$).toBe(expectedMarble, expectedValues);
+    });
+  });
+
+  it("should complete after emitting undefined", () => {
+    testScheduler.run(({ expectObservable }) => {
+      const timeout = 500;
+      const expectedMarble = "500ms (a|)";
+      const expectedValues = { a: undefined };
+
+      const result$ = withTimeout$(timeout);
+
+      expectObservable(result$).toBe(expectedMarble, expectedValues);
+    });
+  });
+});

package/idleUtils/index.ts

@@ -1,4 +1,4 @@
-export { withTimeout } from "./withTimeout";
+export { withTimeout, withTimeout$ } from "./withTimeout";
 
 export { onIdle } from "./onIdle";
 

package/idleUtils/withTimeout.ts

@@ -1,7 +1,20 @@
-export const withTimeout = (timeout: number) => {
-  return new Promise((resolve) => {
+import { of, Observable } from "rxjs";
+import { delay } from "rxjs/operators";
+
+export const withTimeout = (timeout: number): Promise<void> => {
+  return new Promise<void>((resolve) => {
     setTimeout(() => {
       resolve(undefined);
     }, timeout);
   });
 };
+
+/**
+ * Creates an observable that emits a single value after a specified timeout.
+ *
+ * @param timeout - The delay duration in milliseconds before emitting the value.
+ * @returns An observable that emits `undefined` after the specified timeout.
+ */
+export const withTimeout$ = (timeout: number): Observable<void> => {
+  return of(undefined).pipe(delay(timeout));
+};

package/navigationUtils/index.ts

@@ -644,8 +644,8 @@ export const getScreenId = (
   fallbackRiver: ZappRiver
 ) => {
   return screenData?.targetScreen
-    ? screenData?.targetScreen?.id ?? fallbackRiver.id
+    ? (screenData?.targetScreen?.id ?? fallbackRiver.id)
     : "screen_id" in screenData
-    ? screenData.screen_id
-    : fallbackRiver.id;
+      ? screenData.screen_id
+      : fallbackRiver.id;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "13.0.0-alpha.7222542422",
+  "version": "13.0.0-alpha.7846284820",
   "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.7222542422",
+    "@applicaster/applicaster-types": "13.0.0-alpha.7846284820",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "create-react-context": "^0.2.3",

package/reactHooks/layout/useDimensions/helpers/__tests__/getInitialDimensions.test.js

@@ -5,7 +5,7 @@ const mockDimensionsGet = jest.fn(
     ({
       window: { width: 1, height: 1 },
       screen: { width: 360, height: 540 },
-    }[type])
+    })[type]
 );
 
 ReactNative.Dimensions.get = mockDimensionsGet;

package/reactHooks/usePluginConfiguration.ts

@@ -91,7 +91,7 @@ export function useLayoutConfiguration<
   S extends unknown,
   G extends unknown,
   R extends unknown,
-  L extends unknown
+  L extends unknown,
 >(layoutData, manifest, options: Options = {}) {
   const keys = options.keys || [
     "assets",

package/reactHooks/useSubscriberFor.ts

@@ -4,9 +4,10 @@ import { subscriber } from "@applicaster/zapp-react-native-utils/functionUtils";
 const subscriberObjects = Object.create({});
 
 interface UseSubscriberFor {
-  (eventName: string, handler?: (...args: unknown[]) => void): (
-    ...args: unknown[]
-  ) => ReturnType<typeof subscriber>;
+  (
+    eventName: string,
+    handler?: (...args: unknown[]) => void
+  ): (...args: unknown[]) => ReturnType<typeof subscriber>;
 }
 
 /**

package/screenState/index.ts

@@ -1,6 +1,8 @@
 import { create } from "zustand";
 import { produce } from "immer";
 import { path } from "ramda";
+import React from "react";
+import { useShallow } from "zustand/react/shallow";
 
 type ScreenState = {
   selectedEntry: {
@@ -18,6 +20,8 @@ type ScreenStore = {
   setSelectedEntry: (screenId: string, entryId: string) => void;
 };
 
+type SetSelectedEntry = (screenId: string, entryId: string) => void;
+
 const useScreenStore = create<ScreenStore>((set) => ({
   screens: screensInitialState,
   setSelectedEntry: (screenId, entryId) =>
@@ -35,17 +39,27 @@ const useScreenStore = create<ScreenStore>((set) => ({
 export function useScreenState(
   screenId: ScreenId
 ): null | { screen: ScreenState; setSelectedEntry: (entryId: string) => void } {
-  // const state = useState(screenState);
-  const screenState = useScreenStore(
-    path(["screens", screenId])
-  ) as ScreenState;
+  const screenState = useScreenStore<ScreenState>(
+    useShallow(path(["screens", screenId]))
+  );
 
-  const setSelectedEntry = useScreenStore((state) => state.setSelectedEntry);
+  const setSelectedEntry = useScreenStore<SetSelectedEntry>(
+    useShallow(path(["setSelectedEntry"]))
+  );
 
-  if (!screenId) return null;
+  const memoizedSetSelectedEntry = React.useCallback(
+    (entryId) => setSelectedEntry(screenId, entryId),
+    [screenId, setSelectedEntry]
+  );
 
-  return {
-    screen: screenState,
-    setSelectedEntry: (entryId) => setSelectedEntry(screenId, entryId),
-  };
+  return React.useMemo(
+    () =>
+      !screenId
+        ? null
+        : {
+            screen: screenState,
+            setSelectedEntry: memoizedSetSelectedEntry,
+          },
+    [screenId, screenState]
+  );
 }

package/theme/index.ts

@@ -14,7 +14,7 @@ export const ThemeContext = React.createContext({
 export function useTheme<
   T extends Record<string, any> =
     | BaseThemePropertiesTV
-    | BaseThemePropertiesMobile
+    | BaseThemePropertiesMobile,
 >(): T {
   const { themes, selectedThemeId } = React.useContext(ThemeContext);
 

package/time/Timer.ts

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

package/types.ts

@@ -8,4 +8,5 @@ export type ManifestField<T> = {
 
 export enum ENDPOINT_TAGS {
   allow_missing_keys = "allow_missing_keys",
+  observe_storage = "observe_storage",
 }

package/zappFrameworkUtils/presentPluginOneTime.ts

@@ -92,9 +92,8 @@ export const PresentHookPluginOneTime = (
       const presentOneTimeVersionName =
         await getLatestWatchedVersionNumberFromStorage(storageKey, namespace);
 
-      const applicationVersionName = await sessionStorage.getItem(
-        versionNameKey
-      );
+      const applicationVersionName =
+        await sessionStorage.getItem(versionNameKey);
 
       if (!presentOneTimeVersionName || !applicationVersionName) {
         log_info(

package/manifestUtils/sharedConfiguration/screenPicker/__tests__/utils.test.js

@@ -1,304 +0,0 @@
-// @ts-nocheck
-import utils from "../utils";
-
-describe("generateFontConfiguration", () => {
-  it("should generate default configuration for tvos", () => {
-    const expected = [
-      {
-        initial_value: 20,
-        label: "tvOS font Size",
-        key: "tvos_font_size",
-        type: "number_input",
-      },
-      {
-        initial_value: 40,
-        label: "tvOS line Height",
-        key: "tvos_line_height",
-        type: "number_input",
-      },
-      {
-        initial_value: 0.4,
-        label: "tvOS letter Spacing",
-        key: "tvos_letter_spacing",
-        type: "number_input",
-      },
-    ];
-
-    const platforms = {
-      tvos: "tvOS",
-    };
-
-    const generatedFontConfiguration =
-      utils.generateFontConfiguration(platforms);
-
-    expect(generatedFontConfiguration).toEqual(expected);
-  });
-
-  it("should generate default configuration for android_tv", () => {
-    const expected = [
-      {
-        initial_value: 20,
-        label: "Android TV font Size",
-        key: "android_tv_font_size",
-        type: "number_input",
-      },
-      {
-        initial_value: 40,
-        label: "Android TV line Height",
-        key: "android_tv_line_height",
-        type: "number_input",
-      },
-      {
-        initial_value: 0.4,
-        label: "Android TV letter Spacing",
-        key: "android_tv_letter_spacing",
-        type: "number_input",
-      },
-    ];
-
-    const platforms = {
-      android_tv: "Android TV",
-    };
-
-    const generatedFontConfiguration =
-      utils.generateFontConfiguration(platforms);
-
-    expect(generatedFontConfiguration).toEqual(expected);
-  });
-
-  it("should generate default configuration for lg_tv", () => {
-    const expected = [
-      {
-        initial_value: 20,
-        label: "LG TV font Size",
-        key: "lg_tv_font_size",
-        type: "number_input",
-      },
-      {
-        initial_value: 40,
-        label: "LG TV line Height",
-        key: "lg_tv_line_height",
-        type: "number_input",
-      },
-      {
-        initial_value: 0.4,
-        label: "LG TV letter Spacing",
-        key: "lg_tv_letter_spacing",
-        type: "number_input",
-      },
-    ];
-
-    const platforms = {
-      lg_tv: "LG TV",
-    };
-
-    const generatedFontConfiguration =
-      utils.generateFontConfiguration(platforms);
-
-    expect(generatedFontConfiguration).toEqual(expected);
-  });
-
-  it("should generate default configuration for samsung_tv", () => {
-    const expected = [
-      {
-        initial_value: 20,
-        label: "Samsung TV font Size",
-        key: "samsung_tv_font_size",
-        type: "number_input",
-      },
-      {
-        initial_value: 40,
-        label: "Samsung TV line Height",
-        key: "samsung_tv_line_height",
-        type: "number_input",
-      },
-      {
-        initial_value: 0.4,
-        label: "Samsung TV letter Spacing",
-        key: "samsung_tv_letter_spacing",
-        type: "number_input",
-      },
-    ];
-
-    const platforms = {
-      samsung_tv: "Samsung TV",
-    };
-
-    const generatedFontConfiguration =
-      utils.generateFontConfiguration(platforms);
-
-    expect(generatedFontConfiguration).toEqual(expected);
-  });
-});
-
-test("conditional_rule helper should return correct object", () => {
-  expect(utils.conditional_rule("a", "b")).toMatchObject({
-    key: "a",
-    condition_value: "b",
-  });
-});
-
-test("createConditionalConfig helper should return correct object", () => {
-  expect(
-    utils.createConditionalConfig([
-      ["a", "b"],
-      ["c", "d"],
-    ])
-  ).toEqual({
-    rules: "conditional",
-    conditional_fields: [
-      {
-        key: "a",
-        condition_value: "b",
-      },
-      {
-        key: "c",
-        condition_value: "d",
-      },
-    ],
-  });
-});
-
-test("conditional_horizontal_type should contain correct parameters", () => {
-  expect(
-    utils.conditional_horizontal_type_item_fixed.conditional_fields[0]
-  ).toMatchObject({
-    key: "styles/screen_picker_type",
-    condition_value: "horizontal",
-  });
-});
-
-test("conditional_vertical_type should contain correct parameters", () => {
-  expect(utils.conditional_vertical_type.conditional_fields[0]).toMatchObject({
-    key: "styles/screen_picker_type",
-    condition_value: "vertical",
-  });
-});
-
-test("conditional_horizontal_type_item_fixed should contain correct parameters", () => {
-  expect(
-    utils.conditional_horizontal_type_item_fixed.conditional_fields[0]
-  ).toMatchObject({
-    key: "styles/screen_picker_type",
-    condition_value: "horizontal",
-  });
-
-  expect(
-    utils.conditional_horizontal_type_item_fixed.conditional_fields[1]
-  ).toMatchObject({
-    key: "styles/screen_picker_item_size",
-    condition_value: "fixed",
-  });
-});
-
-test("conditional_horizontal_display_type_fixed should contain correct parameters", () => {
-  expect(
-    utils.conditional_horizontal_display_type_fixed.conditional_fields[0]
-  ).toMatchObject({
-    key: "styles/screen_picker_type",
-    condition_value: "horizontal",
-  });
-
-  expect(
-    utils.conditional_horizontal_display_type_fixed.conditional_fields[1]
-  ).toMatchObject({
-    key: "styles/screen_picker_horizontal_display_type",
-    condition_value: "fixed",
-  });
-});
-
-test("conditional_horizontal_display_type_fixed should contain correct parameters", () => {
-  expect(
-    utils.conditional_horizontal_asset_on.conditional_fields[0]
-  ).toMatchObject({
-    key: "styles/screen_picker_type",
-    condition_value: "horizontal",
-  });
-
-  expect(
-    utils.conditional_horizontal_asset_on.conditional_fields[1]
-  ).toMatchObject({
-    key: "styles/screen_picker_asset_switch",
-    condition_value: true,
-  });
-});
-
-describe("createVariationFields", () => {
-  const defaultInput = {
-    key: "somekey",
-    label: "default somekey label",
-    variants: [
-      {
-        initial_value: "a",
-      },
-      {
-        initial_value: "b",
-        label: "custom label",
-      },
-    ],
-  };
-
-  const config = utils.createVariationFields(defaultInput);
-
-  it("should return array containing object for conditional_vertical_type", () => {
-    expect(config[0].rules).toBe("conditional");
-
-    expect(config[0].conditional_fields).toEqual([
-      {
-        key: "styles/screen_picker_type",
-        condition_value: "vertical",
-      },
-    ]);
-
-    expect(config[0].type).toBe("number_input");
-    expect(config[0].key).toBe("screen_picker_vertical_somekey");
-    expect(config[0].label).toBe("default somekey label");
-    expect(config[0].initial_value).toBe("a");
-  });
-
-  it("should return array containing object for conditional_horizontal_type", () => {
-    expect(config[1].rules).toBe("conditional");
-
-    expect(config[1].conditional_fields).toEqual([
-      {
-        key: "styles/screen_picker_type",
-        condition_value: "horizontal",
-      },
-    ]);
-
-    expect(config[1].type).toBe("number_input");
-    expect(config[1].key).toBe("screen_picker_horizontal_somekey");
-    expect(config[1].label).toBe("custom label");
-    expect(config[1].initial_value).toBe("b");
-  });
-
-  it("should accept custom prefix (empty)", () => {
-    const config = utils.createVariationFields({
-      ...defaultInput,
-      prefix: "",
-    });
-
-    expect(config[0].key).toBe("vertical_somekey");
-    expect(config[1].key).toBe("horizontal_somekey");
-  });
-
-  it("should accept custom prefix (string)", () => {
-    const config = utils.createVariationFields({
-      ...defaultInput,
-      prefix: "string",
-    });
-
-    expect(config[0].key).toBe("string_vertical_somekey");
-    expect(config[1].key).toBe("string_horizontal_somekey");
-  });
-
-  it("should accept custom type (string)", () => {
-    const config = utils.createVariationFields({
-      ...defaultInput,
-      type: "text_input",
-    });
-
-    expect(config[0].type).toBe("text_input");
-    expect(config[1].type).toBe("text_input");
-  });
-});