@applicaster/zapp-react-native-utils 15.0.0-rc.97 → 15.0.0-rc.99

package/manifestUtils/platformIsTV.js

@@ -0,0 +1,13 @@
+function platformIsTV(platform) {
+  return [
+    "tvos_for_quickbrick",
+    "android_tv_for_quickbrick",
+    "amazon_fire_tv_for_quickbrick",
+    "lg_tv",
+    "samsung_tv",
+    "web",
+    "vizio",
+  ].includes(platform);
+}
+
+module.exports = { platformIsTV };

package/package.json

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

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,
+        })
+      );
+    });
+  });
+});