@applicaster/zapp-react-native-utils 15.0.0-alpha.3642255793 → 15.0.0-alpha.3842304615

package/numberUtils/__tests__/toPositiveNumber.test.ts

@@ -156,10 +156,38 @@ describe("toPositiveNumber", () => {
     it("handles Symbol values", () => {
       expect(toPositiveNumber(Symbol("test"))).toBeUndefined();
     });
+  });
 
-    it("converts BigInt values", () => {
-      expect(toPositiveNumber(5n)).toBe(5);
-      expect(toPositiveNumber(-5n)).toBeUndefined();
-    });
+  describe("BigInt support", () => {
+    // Conditional test based on BigInt availability
+    const isBigIntSupported = typeof BigInt !== "undefined";
+
+    if (isBigIntSupported) {
+      it("converts positive BigInt values to numbers when BigInt is supported", () => {
+        expect(toPositiveNumber(BigInt(5))).toBe(5);
+        expect(toPositiveNumber(BigInt(100))).toBe(100);
+        expect(toPositiveNumber(BigInt(1000))).toBe(1000);
+      });
+
+      it("returns undefined for zero BigInt", () => {
+        expect(toPositiveNumber(BigInt(0))).toBeUndefined();
+      });
+
+      it("returns undefined for negative BigInt values", () => {
+        expect(toPositiveNumber(BigInt(-5))).toBeUndefined();
+        expect(toPositiveNumber(BigInt(-100))).toBeUndefined();
+      });
+
+      it("handles large positive BigInt values", () => {
+        const largeBigInt = BigInt(Number.MAX_SAFE_INTEGER);
+        const result = toPositiveNumber(largeBigInt);
+        expect(result).toBe(Number(largeBigInt));
+      });
+    } else {
+      it("skips BigInt tests when BigInt is not supported", () => {
+        // Placeholder test to indicate BigInt is not available
+        expect(typeof BigInt).toBe("undefined");
+      });
+    }
   });
 });

package/numberUtils/index.ts

@@ -8,7 +8,11 @@ export const toNumber = (value: unknown): number | undefined => {
     return undefined;
   }
 
-  if (R.is(Number, value) || R.is(BigInt, value) || R.is(String, value)) {
+  // Feature-detect BigInt support to avoid ReferenceError on older runtimes
+  const isBigIntSupported = typeof BigInt !== "undefined";
+  const isBigIntValue = isBigIntSupported && R.is(BigInt, value);
+
+  if (R.is(Number, value) || isBigIntValue || R.is(String, value)) {
     const numberOrNan = Number(value);
 
     return Number.isNaN(numberOrNan) ? undefined : numberOrNan;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "15.0.0-alpha.3642255793",
+  "version": "15.0.0-alpha.3842304615",
   "description": "Applicaster Zapp React Native utilities package",
   "main": "index.js",
   "types": "index.d.ts",
@@ -27,11 +27,11 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "15.0.0-alpha.3642255793",
+    "@applicaster/applicaster-types": "15.0.0-alpha.3842304615",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "dayjs": "^1.11.10",
-    "handlebars": "4.7.8",
+    "handlebars": "4.7.9",
     "memoizee": "0.4.15",
     "prop-types": "^15.0.0"
   },

package/pluginUtils/index.ts

@@ -30,10 +30,7 @@ export function getComponentModule({
   components: ComponentsMap;
   plugins: Plugin[] | QuickBrickPlugin[];
 }) {
-  const component = R.compose(
-    R.prop(R.__, components),
-    toPascalCase
-  )(componentType);
+  const component = components[toPascalCase(componentType)];
 
   if (component) {
     return component;
@@ -60,7 +57,9 @@ export function findComponentByType({
     ? R.compose(...R.reverse(decorators))
     : decorators;
 
-  const component = getComponentModule({ componentType, components, plugins });
+  const module = getComponentModule({ componentType, components, plugins });
+
+  const component = module?.Component || module;
 
   return R.unless(R.isNil, applyDecorators)(component);
 }

package/reactHooks/analytics/__tests__/useSendAnalyticsOnPress.test.ts

@@ -0,0 +1,537 @@
+import { renderHook, act } from "@testing-library/react-native";
+import { useSendAnalyticsOnPress } from "../index";
+
+// Mock dependencies
+jest.mock("../../../analyticsUtils", () => ({
+  useAnalytics: jest.fn(),
+}));
+
+jest.mock(
+  "@applicaster/zapp-react-native-utils/analyticsUtils/helpers/hooks",
+  () => ({
+    useSendAnalyticsEventWithFunction: jest.fn(),
+  })
+);
+
+import { useAnalytics } from "../../../analyticsUtils";
+import { useSendAnalyticsEventWithFunction } from "@applicaster/zapp-react-native-utils/analyticsUtils/helpers/hooks";
+
+describe("useSendAnalyticsOnPress", () => {
+  const mockUseAnalytics = useAnalytics as jest.MockedFunction<
+    typeof useAnalytics
+  >;
+
+  const mockUseSendAnalyticsEventWithFunction =
+    useSendAnalyticsEventWithFunction as jest.MockedFunction<
+      typeof useSendAnalyticsEventWithFunction
+    >;
+
+  let mockSendOnClickEvent: jest.Mock;
+  let mockCallbackSendAnalyticsEvent: jest.Mock;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+
+    mockSendOnClickEvent = jest.fn();
+    mockCallbackSendAnalyticsEvent = jest.fn();
+
+    mockUseAnalytics.mockReturnValue({
+      sendOnClickEvent: mockSendOnClickEvent,
+    } as any);
+
+    mockUseSendAnalyticsEventWithFunction.mockReturnValue(
+      mockCallbackSendAnalyticsEvent
+    );
+  });
+
+  describe("initialization", () => {
+    it("should return a callback function", () => {
+      const item = { id: "item-1" };
+      const component = { type: "button" };
+      const zappPipesData = { key: "value" };
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, zappPipesData)
+      );
+
+      expect(typeof result.current).toBe("function");
+    });
+
+    it("should call useAnalytics with correct parameters", () => {
+      const item = { id: "item-1", title: "Item 1" };
+      const component = { type: "cell", name: "MasterCell" };
+      const zappPipesData = { feeds: [], screens: [] };
+
+      renderHook(() => useSendAnalyticsOnPress(item, component, zappPipesData));
+
+      expect(mockUseAnalytics).toHaveBeenCalledWith({
+        item,
+        component,
+        zappPipesData,
+      });
+    });
+
+    it("should call useSendAnalyticsEventWithFunction", () => {
+      const item = { id: "item-2" };
+      const component = { type: "list" };
+      const zappPipesData = {};
+
+      renderHook(() => useSendAnalyticsOnPress(item, component, zappPipesData));
+
+      expect(mockUseSendAnalyticsEventWithFunction).toHaveBeenCalled();
+    });
+  });
+
+  describe("callback execution", () => {
+    it("should call analytics event when callback is invoked", () => {
+      const item = { id: "item-1" };
+      const component = { type: "button" };
+      const zappPipesData = { key: "value" };
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, zappPipesData)
+      );
+
+      const pressedItem = { id: "pressed-item" };
+      const index = 5;
+
+      act(() => {
+        result.current(pressedItem, index);
+      });
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenCalledWith({
+        sendAnalyticsFunction: mockSendOnClickEvent,
+        extraProps: {
+          item: pressedItem,
+          index,
+          component,
+          zappPipesData,
+        },
+      });
+    });
+
+    it("should handle different items on each press", () => {
+      const item = { id: "item-1" };
+      const component = { type: "list" };
+      const zappPipesData = {};
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, zappPipesData)
+      );
+
+      const item1 = { id: "item-a", title: "Item A" };
+      const item2 = { id: "item-b", title: "Item B" };
+
+      act(() => {
+        result.current(item1, 0);
+      });
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenLastCalledWith(
+        expect.objectContaining({
+          extraProps: expect.objectContaining({
+            item: item1,
+            index: 0,
+          }),
+        })
+      );
+
+      act(() => {
+        result.current(item2, 1);
+      });
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenLastCalledWith(
+        expect.objectContaining({
+          extraProps: expect.objectContaining({
+            item: item2,
+            index: 1,
+          }),
+        })
+      );
+    });
+
+    it("should handle different indices", () => {
+      const item = { id: "item-1" };
+      const component = { type: "grid" };
+      const zappPipesData = {};
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, zappPipesData)
+      );
+
+      const pressedItem = { id: "pressed" };
+
+      for (let i = 0; i < 5; i++) {
+        act(() => {
+          result.current(pressedItem, i);
+        });
+
+        expect(mockCallbackSendAnalyticsEvent).toHaveBeenLastCalledWith(
+          expect.objectContaining({
+            extraProps: expect.objectContaining({
+              index: i,
+            }),
+          })
+        );
+      }
+    });
+
+    it("should always use the current component from closure", () => {
+      const item = { id: "item-1" };
+      const component = { type: "carousel", name: "MainCarousel" };
+      const zappPipesData = { feeds: [] };
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, zappPipesData)
+      );
+
+      act(() => {
+        result.current({ id: "test" }, 0);
+      });
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          extraProps: expect.objectContaining({
+            component,
+          }),
+        })
+      );
+    });
+
+    it("should always use the current zappPipesData from closure", () => {
+      const item = { id: "item-1" };
+      const component = { type: "button" };
+      const zappPipesData = { feeds: ["feed1"], screens: ["screen1"] };
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, zappPipesData)
+      );
+
+      act(() => {
+        result.current({ id: "test" }, 0);
+      });
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          extraProps: expect.objectContaining({
+            zappPipesData,
+          }),
+        })
+      );
+    });
+  });
+
+  describe("memoization", () => {
+    it("should memoize callback based on dependencies", () => {
+      const item = { id: "item-1" };
+      const component = { type: "button" };
+      const zappPipesData = { key: "value" };
+
+      const { result, rerender } = renderHook(
+        ({ comp, data }) => useSendAnalyticsOnPress(item, comp, data),
+        {
+          initialProps: {
+            comp: component,
+            data: zappPipesData,
+          },
+        }
+      );
+
+      const firstCallback = result.current;
+
+      // Rerender without changing dependencies
+      rerender({
+        comp: component,
+        data: zappPipesData,
+      });
+
+      const secondCallback = result.current;
+
+      // Callback should be memoized
+      expect(firstCallback).toBe(secondCallback);
+    });
+
+    it("should create new callback when component changes", () => {
+      const item = { id: "item-1" };
+      const component1 = { type: "button" };
+      const component2 = { type: "list" };
+      const zappPipesData = {};
+
+      const { result, rerender } = renderHook(
+        ({ comp }) => useSendAnalyticsOnPress(item, comp, zappPipesData),
+        {
+          initialProps: { comp: component1 },
+        }
+      );
+
+      const firstCallback = result.current;
+
+      rerender({ comp: component2 });
+
+      const secondCallback = result.current;
+
+      // Callback should be different when component changes
+      expect(firstCallback).not.toBe(secondCallback);
+    });
+
+    it("should create new callback when zappPipesData changes", () => {
+      const item = { id: "item-1" };
+      const component = { type: "button" };
+      const zappPipesData1 = { feeds: [] as string[] };
+      const zappPipesData2 = { feeds: ["feed1"] };
+
+      const { result, rerender } = renderHook(
+        ({ data }) => useSendAnalyticsOnPress(item, component, data),
+        {
+          initialProps: { data: zappPipesData1 },
+        }
+      );
+
+      const firstCallback = result.current;
+
+      rerender({ data: zappPipesData2 });
+
+      const secondCallback = result.current;
+
+      expect(firstCallback).not.toBe(secondCallback);
+    });
+
+    it("should create new callback when callbackSendAnalyticsEvent changes", () => {
+      const item = { id: "item-1" };
+      const component = { type: "button" };
+      const zappPipesData = {};
+
+      const callback1 = jest.fn();
+      const callback2 = jest.fn();
+
+      mockUseSendAnalyticsEventWithFunction
+        .mockReturnValueOnce(callback1)
+        .mockReturnValueOnce(callback2);
+
+      const { result, rerender } = renderHook(
+        ({ item, component, zappPipesData }) =>
+          useSendAnalyticsOnPress(item, component, zappPipesData),
+        {
+          initialProps: {
+            item,
+            component,
+            zappPipesData,
+          },
+        }
+      );
+
+      const firstCallback = result.current;
+
+      rerender({ item, component, zappPipesData });
+
+      const secondCallback = result.current;
+
+      // Even though we didn't change inputs, if the underlying callback changes,
+      // our callback should change too
+      expect(firstCallback).not.toBe(secondCallback);
+    });
+  });
+
+  describe("edge cases", () => {
+    it("should handle null item", () => {
+      const component = { type: "button" };
+      const zappPipesData = {};
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(null, component, zappPipesData)
+      );
+
+      expect(() => {
+        act(() => {
+          result.current({ id: "test" }, 0);
+        });
+      }).not.toThrow();
+    });
+
+    it("should handle undefined item", () => {
+      const component = { type: "button" };
+      const zappPipesData = {};
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(undefined, component, zappPipesData)
+      );
+
+      expect(() => {
+        act(() => {
+          result.current({ id: "test" }, 0);
+        });
+      }).not.toThrow();
+    });
+
+    it("should handle null component", () => {
+      const item = { id: "item-1" };
+      const zappPipesData = {};
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, null, zappPipesData)
+      );
+
+      act(() => {
+        result.current({ id: "test" }, 0);
+      });
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          extraProps: expect.objectContaining({
+            component: null,
+          }),
+        })
+      );
+    });
+
+    it("should handle null zappPipesData", () => {
+      const item = { id: "item-1" };
+      const component = { type: "button" };
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, null)
+      );
+
+      act(() => {
+        result.current({ id: "test" }, 0);
+      });
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          extraProps: expect.objectContaining({
+            zappPipesData: null,
+          }),
+        })
+      );
+    });
+
+    it("should handle zero index", () => {
+      const item = { id: "item-1" };
+      const component = { type: "list" };
+      const zappPipesData = {};
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, zappPipesData)
+      );
+
+      act(() => {
+        result.current({ id: "test" }, 0);
+      });
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          extraProps: expect.objectContaining({
+            index: 0,
+          }),
+        })
+      );
+    });
+
+    it("should handle negative index", () => {
+      const item = { id: "item-1" };
+      const component = { type: "list" };
+      const zappPipesData = {};
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, zappPipesData)
+      );
+
+      act(() => {
+        result.current({ id: "test" }, -1);
+      });
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          extraProps: expect.objectContaining({
+            index: -1,
+          }),
+        })
+      );
+    });
+
+    it("should handle complex item structures", () => {
+      const item = { id: "item-1" };
+      const component = { type: "cell" };
+      const zappPipesData = {};
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, zappPipesData)
+      );
+
+      const complexItem = {
+        id: "complex",
+        nested: {
+          deep: {
+            structure: true,
+          },
+        },
+        array: [1, 2, 3],
+      };
+
+      act(() => {
+        result.current(complexItem, 5);
+      });
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          extraProps: expect.objectContaining({
+            item: complexItem,
+          }),
+        })
+      );
+    });
+  });
+
+  describe("sendOnClickEvent integration", () => {
+    it("should pass sendOnClickEvent from useAnalytics", () => {
+      const item = { id: "item-1" };
+      const component = { type: "button" };
+      const zappPipesData = {};
+
+      const customSendOnClickEvent = jest.fn();
+
+      mockUseAnalytics.mockReturnValue({
+        sendOnClickEvent: customSendOnClickEvent,
+      } as any);
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, zappPipesData)
+      );
+
+      act(() => {
+        result.current({ id: "test" }, 0);
+      });
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          sendAnalyticsFunction: customSendOnClickEvent,
+        })
+      );
+    });
+
+    it("should handle missing sendOnClickEvent gracefully", () => {
+      const item = { id: "item-1" };
+      const component = { type: "button" };
+      const zappPipesData = {};
+
+      mockUseAnalytics.mockReturnValue({
+        sendOnClickEvent: undefined,
+      } as any);
+
+      const { result } = renderHook(() =>
+        useSendAnalyticsOnPress(item, component, zappPipesData)
+      );
+
+      expect(() => {
+        act(() => {
+          result.current({ id: "test" }, 0);
+        });
+      }).not.toThrow();
+
+      expect(mockCallbackSendAnalyticsEvent).toHaveBeenCalledWith(
+        expect.objectContaining({
+          sendAnalyticsFunction: undefined,
+        })
+      );
+    });
+  });
+});

package/reactHooks/casting/index.ts

@@ -0,0 +1 @@
+export { useIsCasting } from "./useIsCasting";

package/reactHooks/casting/useIsCasting.tsx

@@ -0,0 +1,57 @@
+import React from "react";
+import { useActions } from "@applicaster/zapp-react-native-utils/reactHooks/actions";
+import { useAppState } from "@applicaster/zapp-react-native-utils/reactHooks/app";
+import { isApplePlatform } from "@applicaster/zapp-react-native-utils/reactUtils";
+
+const CHROMECAST_IDENTIFIER = "quick-brick-chromecast-action";
+
+const fakeEntry: any = {
+  title: "Chromecast use is casting fake entry",
+  id: "quick-brick-use-is-casting-fake-entry",
+};
+
+/**
+ * Returns the cast action state connection status, does not update when app is in background on Apple platforms
+ * On other platforms, it continues to check the cast action state even when the app is in background
+ */
+export const useIsCasting = () => {
+  const actionContext = useActions(CHROMECAST_IDENTIFIER);
+  const appState = useAppState();
+  const isAppInForeground = appState === "active";
+  const shouldOnlyUpdateInForeground = isApplePlatform();
+
+  const [castActionState, setCastActionState] = React.useState(
+    !actionContext ? null : actionContext.initialEntryState(fakeEntry)
+  );
+
+  React.useEffect(() => {
+    if (!shouldOnlyUpdateInForeground || isAppInForeground) {
+      if (actionContext && castActionState === null) {
+        setCastActionState(actionContext.initialEntryState(fakeEntry));
+      }
+    }
+  }, [
+    actionContext,
+    setCastActionState,
+    isAppInForeground,
+    shouldOnlyUpdateInForeground,
+  ]);
+
+  React.useEffect(() => {
+    if (typeof actionContext?.addListener === "function") {
+      return actionContext?.addListener(String(fakeEntry.id), (state) => {
+        // Only check foreground state on Apple platforms
+        if (!shouldOnlyUpdateInForeground || isAppInForeground) {
+          setCastActionState(state);
+        }
+      });
+    }
+  }, [
+    setCastActionState,
+    actionContext,
+    isAppInForeground,
+    shouldOnlyUpdateInForeground,
+  ]);
+
+  return !!castActionState?.connected;
+};