@applicaster/zapp-react-native-utils 15.0.0-rc.53 → 15.0.0-rc.55

package/appUtils/accessibilityManager/__tests__/utils.test.ts

@@ -0,0 +1,360 @@
+jest.mock("../../../logger", () => {
+  const mockLogError = jest.fn();
+
+  return {
+    createLogger: jest.fn(() => ({
+      log_error: mockLogError,
+    })),
+    __mockLogError: mockLogError, // Export for test access
+  };
+});
+
+import { calculateReadingTime } from "../utils";
+// @ts-ignore - Access the mock
+import { __mockLogError } from "../../../logger";
+
+describe("calculateReadingTime", () => {
+  // Default parameters for reference
+  const DEFAULT_WPM = 140;
+  const DEFAULT_MIN_PAUSE = 500;
+  const DEFAULT_DELAY = 700;
+
+  beforeEach(() => {
+    (__mockLogError as jest.Mock).mockClear();
+  });
+
+  describe("Type Safety", () => {
+    it("should accept and process string input", () => {
+      const result = calculateReadingTime("Hello world");
+      expect(result).toBeGreaterThan(0);
+      expect(__mockLogError).not.toHaveBeenCalled();
+    });
+
+    it("should accept and process number input", () => {
+      const result = calculateReadingTime(12345);
+      expect(result).toBeGreaterThan(0);
+      expect(__mockLogError).not.toHaveBeenCalled();
+    });
+
+    it("should return 0 and log error for null", () => {
+      expect(calculateReadingTime(null as any)).toBe(0);
+
+      expect(__mockLogError).toHaveBeenCalledWith(
+        "Invalid text input for reading time calculation got: null"
+      );
+    });
+
+    it("should return 0 and log error for undefined", () => {
+      expect(calculateReadingTime(undefined as any)).toBe(0);
+
+      expect(__mockLogError).toHaveBeenCalledWith(
+        "Invalid text input for reading time calculation got: undefined"
+      );
+    });
+
+    it("should return 0 and log error for boolean", () => {
+      calculateReadingTime(true as any);
+
+      expect(__mockLogError).toHaveBeenCalledWith(
+        "Invalid text input for reading time calculation got: true"
+      );
+
+      (__mockLogError as jest.Mock).mockClear();
+
+      calculateReadingTime(false as any);
+
+      expect(__mockLogError).toHaveBeenCalledWith(
+        "Invalid text input for reading time calculation got: false"
+      );
+    });
+
+    it("should return 0 and log error for object", () => {
+      const obj = { text: "hello" };
+      calculateReadingTime(obj as any);
+
+      expect(__mockLogError).toHaveBeenCalledWith(
+        `Invalid text input for reading time calculation got: ${obj}`
+      );
+    });
+
+    it("should return 0 and log error for array", () => {
+      const arr = [1, 2, 3];
+      calculateReadingTime(arr as any);
+
+      expect(__mockLogError).toHaveBeenCalledWith(
+        `Invalid text input for reading time calculation got: ${arr}`
+      );
+    });
+
+    it("should return 0 and log error for function", () => {
+      const fn = () => "text";
+      calculateReadingTime(fn as any);
+      expect(__mockLogError).toHaveBeenCalled();
+
+      expect((__mockLogError as jest.Mock).mock.calls[0][0]).toContain(
+        "Invalid text input for reading time calculation got:"
+      );
+    });
+
+    it("should return 0 and log error for symbol", () => {
+      const sym = Symbol("test");
+      calculateReadingTime(sym as any);
+      expect(__mockLogError).toHaveBeenCalled();
+
+      expect((__mockLogError as jest.Mock).mock.calls[0][0]).toBe(
+        `Invalid text input for reading time calculation got: ${String(sym)}`
+      );
+    });
+  });
+
+  describe("Empty and Whitespace Handling", () => {
+    it("should return 0 for empty string", () => {
+      expect(calculateReadingTime("")).toBe(0);
+    });
+
+    it("should return 0 for whitespace-only string", () => {
+      expect(calculateReadingTime("   ")).toBe(0);
+      expect(calculateReadingTime("\n")).toBe(0);
+      expect(calculateReadingTime("\t")).toBe(0);
+      expect(calculateReadingTime("  \n\t  ")).toBe(0);
+    });
+
+    it("should handle leading and trailing whitespace", () => {
+      const withWhitespace = calculateReadingTime("  hello  ");
+      const withoutWhitespace = calculateReadingTime("hello");
+      expect(withWhitespace).toBe(withoutWhitespace);
+    });
+  });
+
+  describe("Number Input Handling", () => {
+    it("should convert number 0 to string and process", () => {
+      const result = calculateReadingTime(0);
+      // "0" is one word
+      expect(result).toBeGreaterThan(0);
+    });
+
+    it("should convert positive numbers to string", () => {
+      const result = calculateReadingTime(123);
+      // "123" is one word
+      expect(result).toBeGreaterThan(0);
+    });
+
+    it("should convert negative numbers to string", () => {
+      const result = calculateReadingTime(-456);
+      // "-456" is processed as words
+      expect(result).toBeGreaterThan(0);
+    });
+
+    it("should convert decimal numbers to string", () => {
+      const result = calculateReadingTime(3.14);
+      // "3.14" is processed as words
+      expect(result).toBeGreaterThan(0);
+    });
+
+    it("should handle NaN", () => {
+      const result = calculateReadingTime(NaN);
+      // NaN is typeof "number", so it converts to "NaN" string
+      expect(result).toBeGreaterThan(0);
+    });
+
+    it("should handle Infinity", () => {
+      const result = calculateReadingTime(Infinity);
+      // Infinity is typeof "number", converts to "Infinity" string
+      expect(result).toBeGreaterThan(0);
+    });
+  });
+
+  describe("Word Counting", () => {
+    it("should count single word", () => {
+      const result = calculateReadingTime("Hello");
+
+      const expectedTime = Math.max(
+        DEFAULT_MIN_PAUSE,
+        (1 / DEFAULT_WPM) * 60 * 1000
+      );
+
+      expect(result).toBe(expectedTime + DEFAULT_DELAY);
+    });
+
+    it("should count multiple words separated by spaces", () => {
+      const result = calculateReadingTime("Hello world test");
+
+      // 3 words
+      const expectedTime = Math.max(
+        DEFAULT_MIN_PAUSE,
+        (3 / DEFAULT_WPM) * 60 * 1000
+      );
+
+      expect(result).toBe(expectedTime + DEFAULT_DELAY);
+    });
+
+    it("should handle words with punctuation", () => {
+      const result = calculateReadingTime("Hello, world! How are you?");
+      // Should split on punctuation and count words
+      expect(result).toBeGreaterThan(DEFAULT_MIN_PAUSE + DEFAULT_DELAY);
+    });
+
+    it("should handle alphanumeric boundaries", () => {
+      const result = calculateReadingTime("test123abc");
+      // Should split on alphanumeric boundaries
+      expect(result).toBeGreaterThan(DEFAULT_MIN_PAUSE + DEFAULT_DELAY);
+    });
+
+    it("should handle long text", () => {
+      const longText = "word ".repeat(200); // 200 words
+      const result = calculateReadingTime(longText);
+      const expectedTime = (200 / DEFAULT_WPM) * 60 * 1000 + DEFAULT_DELAY;
+      expect(result).toBeCloseTo(expectedTime, -1); // Within 10ms
+    });
+  });
+
+  describe("Minimum Pause", () => {
+    it("should return minimum pause + delay for very short text", () => {
+      const result = calculateReadingTime("Hi");
+      // 1 word, calculation would be less than minimum pause
+      expect(result).toBe(DEFAULT_MIN_PAUSE + DEFAULT_DELAY);
+    });
+
+    it("should respect custom minimum pause", () => {
+      const customMinPause = 1000;
+      const result = calculateReadingTime("Hi", DEFAULT_WPM, customMinPause);
+      expect(result).toBeGreaterThanOrEqual(customMinPause);
+    });
+
+    it("should exceed minimum pause for longer text", () => {
+      const longText = "word ".repeat(50); // 50 words
+      const result = calculateReadingTime(longText);
+      const calculatedTime = (50 / DEFAULT_WPM) * 60 * 1000;
+      expect(result).toBe(calculatedTime + DEFAULT_DELAY);
+      expect(result).toBeGreaterThan(DEFAULT_MIN_PAUSE + DEFAULT_DELAY);
+    });
+  });
+
+  describe("Custom Parameters", () => {
+    it("should respect custom words per minute", () => {
+      const text = "word ".repeat(140); // 140 words
+      const fastReading = calculateReadingTime(text, 280); // 2x speed
+      const normalReading = calculateReadingTime(text, 140); // normal speed
+
+      // Faster reading should take less time
+      expect(fastReading).toBeLessThan(normalReading);
+    });
+
+    it("should respect custom announcement delay", () => {
+      const text = "Hello world";
+
+      const shortDelay = calculateReadingTime(
+        text,
+        DEFAULT_WPM,
+        DEFAULT_MIN_PAUSE,
+        100
+      );
+
+      const longDelay = calculateReadingTime(
+        text,
+        DEFAULT_WPM,
+        DEFAULT_MIN_PAUSE,
+        1000
+      );
+
+      expect(longDelay - shortDelay).toBe(900);
+    });
+
+    it("should work with all custom parameters", () => {
+      const result = calculateReadingTime("test", 200, 1000, 500);
+      expect(result).toBeGreaterThanOrEqual(1500); // minimum pause + delay
+    });
+  });
+
+  describe("Real-world Use Cases", () => {
+    it("should handle accessibility announcement text", () => {
+      const announcement = "New message from John Doe";
+      const result = calculateReadingTime(announcement);
+      expect(result).toBeGreaterThan(0);
+      expect(result).toBeLessThan(10000); // Less than 10 seconds
+    });
+
+    it("should handle button labels", () => {
+      const label = "Submit";
+      const result = calculateReadingTime(label);
+      expect(result).toBe(DEFAULT_MIN_PAUSE + DEFAULT_DELAY);
+    });
+
+    it("should handle form error messages", () => {
+      const error = "Please enter a valid email address";
+      const result = calculateReadingTime(error);
+      expect(result).toBeGreaterThan(DEFAULT_MIN_PAUSE);
+    });
+
+    it("should handle article titles", () => {
+      const title = "Breaking News: Major Update Released";
+      const result = calculateReadingTime(title);
+      expect(result).toBeGreaterThan(DEFAULT_MIN_PAUSE + DEFAULT_DELAY);
+    });
+
+    it("should handle notification text", () => {
+      const notification = "You have 3 new messages";
+      const result = calculateReadingTime(notification);
+      expect(result).toBeGreaterThan(0);
+    });
+  });
+
+  describe("Edge Cases", () => {
+    it("should handle text with special characters", () => {
+      const result = calculateReadingTime("@#$%^&*()");
+      expect(result).toBeGreaterThanOrEqual(0);
+    });
+
+    it("should handle text with emojis", () => {
+      const result = calculateReadingTime("Hello 👋 World 🌍");
+      expect(result).toBeGreaterThan(0);
+    });
+
+    it("should handle text with newlines", () => {
+      const result = calculateReadingTime("Line 1\nLine 2\nLine 3");
+      expect(result).toBeGreaterThan(0);
+    });
+
+    it("should handle mixed alphanumeric text", () => {
+      const result = calculateReadingTime(
+        "Version 1.2.3 released on 2024-01-01"
+      );
+
+      expect(result).toBeGreaterThan(0);
+    });
+
+    it("should handle very large numbers", () => {
+      const result = calculateReadingTime(Number.MAX_SAFE_INTEGER);
+      expect(result).toBeGreaterThan(0);
+    });
+
+    it("should return consistent results for same input", () => {
+      const text = "Consistent test";
+      const result1 = calculateReadingTime(text);
+      const result2 = calculateReadingTime(text);
+      const result3 = calculateReadingTime(text);
+
+      expect(result1).toBe(result2);
+      expect(result2).toBe(result3);
+    });
+  });
+
+  describe("Performance Characteristics", () => {
+    it("should handle empty input efficiently", () => {
+      const start = Date.now();
+      calculateReadingTime("");
+      const duration = Date.now() - start;
+
+      expect(duration).toBeLessThan(10); // Should be nearly instant
+    });
+
+    it("should handle large text efficiently", () => {
+      const largeText = "word ".repeat(10000);
+      const start = Date.now();
+      calculateReadingTime(largeText);
+      const duration = Date.now() - start;
+
+      expect(duration).toBeLessThan(100); // Should complete in less than 100ms
+    });
+  });
+});

package/appUtils/accessibilityManager/utils.ts

@@ -1,20 +1,40 @@
+import { createLogger } from "../../logger";
+
+const { log_error } = createLogger({
+  category: "AccessibilityManager",
+  subsystem: "AppUtils",
+});
+
 /**
  * Calculates the reading time for a given text based on word count
- * @param text - The text to calculate the reading time for
- * @param wordsPerMinute - Words per minute reading speed (default: 160)
+ * @param text - The text to calculate the reading time for (string or number)
+ * @param wordsPerMinute - Words per minute reading speed (default: 140)
  * @param minimumPause - Minimum pause time in milliseconds (default: 500)
  * @param announcementDelay - Additional delay for announcement in milliseconds (default: 700)
  * @returns The reading time in milliseconds
  */
 export function calculateReadingTime(
-  text: string,
+  text: string | number,
   wordsPerMinute: number = 140,
   minimumPause: number = 500,
   announcementDelay: number = 700
 ): number {
-  const trimmed = text.trim();
+  if (typeof text !== "string" && typeof text !== "number") {
+    log_error(
+      `Invalid text input for reading time calculation got: ${
+        typeof text === "symbol" ? String(text) : text
+      }`
+    );
+
+    return 0;
+  }
+
+  const trimmed = typeof text === "number" ? String(text) : text.trim();
+
+  if (!trimmed) {
+    return 0;
+  }
 
-  // Count words (split on whitespace and punctuation, keep alnum boundaries)
   const words = trimmed
     .split(/(?<=\d)(?=[a-zA-Z])|(?<=[a-zA-Z])(?=\d)|[^\w\s]+|\s+/)
     .filter(Boolean).length;

package/appUtils/focusManager/index.ios.ts

@@ -188,9 +188,15 @@ export const focusManager = (function () {
   function register({ id, component }) {
     const { isGroup = false } = component;
 
-    emitRegistered(id);
+    if (isGroup) {
+      registerGroup(id, component);
+    } else {
+      registerItem(id, component);
+    }
+
+    const parentId = component?.props?.groupId;
 
-    return isGroup ? registerGroup(id, component) : registerItem(id, component);
+    emitRegistered({ id, parentId, isGroup });
   }
 
   function unregister(id, { group = false } = {}) {

package/appUtils/focusManagerAux/utils/utils.ios.ts

@@ -1,5 +1,5 @@
-import { ReplaySubject } from "rxjs";
-import { filter } from "rxjs/operators";
+import { ReplaySubject, Subject } from "rxjs";
+import { filter, switchMap, take } from "rxjs/operators";
 import { BUTTON_PREFIX } from "@applicaster/zapp-react-native-ui-components/Components/MasterCell/DefaultComponents/tv/TvActionButtons/const";
 import { focusManager } from "@applicaster/zapp-react-native-utils/appUtils/focusManager/index.ios";
 
@@ -9,6 +9,15 @@ type RegistrationEvent = {
   registered: boolean;
 };
 
+let focusableViewRegistrationSubject$ = new Subject<{
+  id: FocusableID;
+  parentId: FocusableID;
+}>();
+
+let focusableGroupRegistrationSubject$ = new ReplaySubject<{
+  id: FocusableID;
+}>();
+
 const isFocusableButton = (id: Option<FocusableID>): boolean =>
   id && id.includes?.(BUTTON_PREFIX);
 
@@ -22,10 +31,58 @@ export const focusableButtonsRegistration$ = (focusableGroupId: string) =>
     )
   );
 
-export const emitRegistered = (id: Option<FocusableID>): void => {
+export const resetFocusableRegistration = () => {
+  // complete the old subject so subscribers are notified and resources are freed
+  if (!focusableViewRegistrationSubject$.closed) {
+    focusableViewRegistrationSubject$.complete();
+  }
+
+  if (!focusableGroupRegistrationSubject$.closed) {
+    focusableGroupRegistrationSubject$.complete();
+  }
+
+  focusableViewRegistrationSubject$ = new Subject<{
+    id: FocusableID;
+    parentId: FocusableID;
+  }>();
+
+  focusableGroupRegistrationSubject$ = new ReplaySubject<{
+    id: FocusableID;
+  }>();
+};
+
+export const firstFocusableViewRegistrationFactory = () =>
+  focusableViewRegistrationSubject$.pipe(
+    take(1), // we care about only first FocusableView registration
+    switchMap(({ parentId }) =>
+      // start waiting registration of its parent
+      focusableGroupRegistrationSubject$.pipe(
+        filter(({ id }) => id === parentId)
+      )
+    ),
+    take(1)
+  );
+
+export const emitRegistered = ({
+  id,
+  parentId,
+  isGroup,
+}: {
+  id: Option<FocusableID>;
+  parentId: Option<FocusableID>;
+  isGroup: boolean;
+}): void => {
   if (isFocusableButton(id)) {
     registeredSubject$.next({ id, registered: true });
   }
+
+  if (isGroup && id) {
+    focusableGroupRegistrationSubject$.next({ id });
+  }
+
+  if (!isGroup && id && parentId) {
+    focusableViewRegistrationSubject$.next({ id, parentId });
+  }
 };
 
 export const emitUnregistered = (id: Option<FocusableID>): void => {

package/package.json

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

package/reactHooks/feed/__tests__/{useInflatedUrl.test.ts → useInflatedUrl.test.tsx}

@@ -1,3 +1,34 @@
+import React from "react";
+
+import { WrappedWithProviders } from "@applicaster/zapp-react-native-utils/testUtils";
+
+import {
+  getInflatedDataSourceUrl,
+  getSearchContext,
+  useGetUrlInflater,
+} from "../useInflatedUrl";
+
+import { reactHooksLogger } from "../../logger";
+
+jest.mock("../../navigation", () => ({
+  useRoute: () => ({ pathname: "/mock/path" }),
+}));
+
+// mock contexts hooks
+jest.mock("@applicaster/zapp-react-native-ui-components/Contexts", () => ({
+  ZappPipesEntryContext: {
+    useZappPipesContext: () => [
+      { id: "entry-1", extensions: { showId: "A123" } },
+    ],
+  },
+  ZappPipesSearchContext: {
+    useZappPipesContext: () => ["user%20query"],
+  },
+  ZappPipesScreenContext: {
+    useZappPipesContext: () => [{ id: "screen-1" }],
+  },
+}));
+
 jest.mock("../../logger", () => ({
   reactHooksLogger: {
     warning: jest.fn(),
@@ -5,13 +36,6 @@ jest.mock("../../logger", () => ({
   },
 }));
 
-const {
-  getInflatedDataSourceUrl,
-  getSearchContext,
-} = require("../useInflatedUrl");
-
-const { reactHooksLogger } = require("../../logger");
-
 let mockStore;
 
 describe("getInflatedDataSourceUrl", () => {
@@ -188,3 +212,34 @@ describe("getSearchContext", () => {
     expect(result).toHaveProperty(mapping.queryParam.property, searchContext);
   });
 });
+
+describe("useGetUrlInflater", () => {
+  const { renderHook } = require("@testing-library/react-hooks");
+
+  it("returns original url when mapping is not provided", () => {
+    const { result } = renderHook(() => useGetUrlInflater(), {
+      wrapper: WrappedWithProviders,
+    });
+
+    const src = "https://foo.com/feed";
+    expect(result.current(src)).toBe(src);
+  });
+
+  it("inflates url using entry/search/screen contexts when mapping provided", () => {
+    const { result } = renderHook(() => useGetUrlInflater(), {
+      wrapper: ({ children }) => (
+        <WrappedWithProviders>{children}</WrappedWithProviders>
+      ),
+    });
+
+    const source = "https://foo.com/shows/{{showId}}?q={{q}}";
+
+    const mapping = {
+      showId: { source: "entry", property: "extensions.showId" },
+      q: { source: "search", property: "q" },
+    };
+
+    const url = result.current(source, mapping);
+    expect(url).toBe("https://foo.com/shows/A123?q=user%20query");
+  });
+});

package/reactHooks/feed/useInflatedUrl.ts

@@ -1,4 +1,4 @@
-import { useMemo } from "react";
+import { useCallback, useMemo, useRef } from "react";
 import * as R from "ramda";
 
 import {
@@ -169,7 +169,7 @@ const encodeIfNeeded: (string) => string = R.tryCatch(
 
 export function getSearchContext(
   searchContext: string,
-  mapping: ZappTypeMapping
+  mapping: Nullable<ZappTypeMapping>
 ) {
   if (!mapping) {
     return {};
@@ -183,31 +183,57 @@ export function getSearchContext(
   return { [property]: encodeIfNeeded(searchContext) };
 }
 
-export function useInflatedUrl({
-  feedUrl,
-  mapping,
-}: {
-  feedUrl?: string;
-  mapping?: ZappTypeMapping;
-}) {
+/**
+ * Hook returns a function that replace placeholders with context values
+ * @returns function that inflates urls based on contexts
+ */
+export const useGetUrlInflater = () => {
   const { pathname } = useRoute();
 
   const [entryContext] = ZappPipesEntryContext.useZappPipesContext(pathname);
   const [searchContext] = ZappPipesSearchContext.useZappPipesContext();
   const [screenContext] = ZappPipesScreenContext.useZappPipesContext();
 
-  const url = useMemo(
-    () =>
-      getInflatedDataSourceUrl({
+  const entryContextRef = useRef(entryContext);
+  entryContextRef.current = entryContext;
+
+  const screenContextRef = useRef(screenContext);
+  screenContextRef.current = screenContext;
+
+  const searchContextRef = useRef(searchContext);
+  searchContextRef.current = searchContext;
+
+  return useCallback(
+    (
+      feedUrl: Nullable<string>,
+      mapping?: Nullable<ZappTypeMapping>
+    ): Nullable<string> => {
+      return getInflatedDataSourceUrl({
         source: feedUrl,
         contexts: {
-          entry: entryContext,
-          screen: screenContext,
-          search: getSearchContext(searchContext, mapping),
+          entry: entryContextRef.current,
+          screen: screenContextRef.current,
+          search: getSearchContext(searchContextRef.current, mapping),
         },
         mapping,
-      }),
-    [entryContext, feedUrl, mapping, screenContext, searchContext]
+      });
+    },
+    []
+  );
+};
+
+export function useInflatedUrl({
+  feedUrl,
+  mapping,
+}: {
+  feedUrl?: string;
+  mapping?: ZappTypeMapping;
+}) {
+  const urlInflater = useGetUrlInflater();
+
+  const url = useMemo(
+    () => urlInflater(feedUrl, mapping),
+    [urlInflater, feedUrl, mapping]
   );
 
   return url;