@applicaster/zapp-react-native-utils 15.0.0-rc.98 → 15.1.0-alpha.2915689988

package/rectUtils/index.ts

@@ -9,7 +9,7 @@
  */
 export function measureDimensionalIntersection(direction, current, target) {
   if (direction.isHorizontal) {
-    return measureVerticalIntersection(current, target);
+    return measureVerticalIntersectiont(current, target);
   } else {
     return measureHorizontalIntersection(current, target);
   }
@@ -25,7 +25,7 @@ export function measureDimensionalIntersection(direction, current, target) {
  * @param {Object} target rect object {right, left, top, bottom, x, y, width. height}
  * @returns {Int} Returns vertical intersection of current and target object
  */
-export function measureVerticalIntersection(current, target) {
+export function measureVerticalIntersectiont(current, target) {
   if (target.top >= current.bottom || target.bottom <= current.top) {
     return 0;
   }

package/screenPickerUtils/index.ts

@@ -1,3 +1,5 @@
+import { endsWith } from "@applicaster/zapp-react-native-utils/utils";
+
 export const getFocusableId = (id) => `PickerItem.${id}`;
 
 export const getPickerSelectorId = (id) => `PickerSelector.${id}`;
@@ -11,3 +13,6 @@ export const getScreenPickerSelectorContainerId = (id) =>
 
 export const getScreenPickerContentContainerId = (id) =>
   `${getScreenPickerId(id)}-screen-container`;
+
+export const isTabsScreenContentContainerId = (id) =>
+  endsWith("-screen-container", id);

package/screenState/__tests__/index.test.ts

@@ -1,4 +1,4 @@
-import { act, renderHook } from "@testing-library/react-native";
+import { act, renderHook } from "@testing-library/react-hooks";
 import { useScreenState } from "../index";
 
 describe("useScreenState", () => {

package/stringUtils/index.ts

@@ -4,7 +4,7 @@ declare const global;
 import * as R from "ramda";
 import camelize from "camelize";
 // @ts-ignore
-import Handlebars from "handlebars";
+import Handlebars from "react-native-handlebars";
 
 global.Buffer = global.Buffer || require("buffer").Buffer;
 

package/testUtils/index.tsx

@@ -4,7 +4,7 @@ import React, { PropsWithChildren } from "react";
 import configureStore from "redux-mock-store";
 import { Provider } from "react-redux";
 import { View } from "react-native";
-import { thunk } from "redux-thunk";
+import thunk from "redux-thunk";
 import * as R from "ramda";
 
 import { appStore } from "@applicaster/zapp-react-native-redux/AppStore";
@@ -56,29 +56,9 @@ const initialState = {
   contentTypes: null,
 };
 
-const themeObjDefault = {
-  component_margin_top: 0,
-  component_margin_bottom: 0,
-  component_margin_left: 0,
-  component_margin_right: 0,
-  component_padding_top: 0,
-  component_padding_bottom: 0,
-  component_padding_left: 0,
-  component_padding_right: 0,
-  component_gutter_vertical: 0,
-  component_gutter_horizontal: 0,
-  component_corner_radius: 0,
-  app_background_color: "rgba(0,0,0,0)",
-  screen_margin_top: 0,
-  screen_margin_bottom: 0,
-  component_anchor_point_y: 0,
-  assets: "",
-};
-
 export const WrappedWithProviders = ({
   children,
   store: storeObj = {},
-  theme: themeObj = themeObjDefault,
 }: any) => {
   const _store = configureStore([thunk])(
     R.mergeDeepRight(initialState, { ...storeObj })
@@ -90,7 +70,24 @@ export const WrappedWithProviders = ({
     <ThemeContext.Provider
       value={{
         themes: {
-          light: themeObj,
+          light: {
+            component_margin_top: 0,
+            component_margin_bottom: 0,
+            component_margin_left: 0,
+            component_margin_right: 0,
+            component_padding_top: 0,
+            component_padding_bottom: 0,
+            component_padding_left: 0,
+            component_padding_right: 0,
+            component_gutter_vertical: 0,
+            component_gutter_horizontal: 0,
+            component_corner_radius: 0,
+            app_background_color: "rgba(0,0,0,0)",
+            screen_margin_top: 0,
+            screen_margin_bottom: 0,
+            component_anchor_point_y: 0,
+            assets: "",
+          },
         },
         selectedThemeId: "light",
         setSelectedThemeId: () => {},
@@ -116,17 +113,11 @@ export const WrappedWithProviders = ({
  * @param store optional store to pass to the provider
  * @returns
  */
-export const renderWithProviders = (
-  component,
-  storeObj?: unknown,
-  themeObj?: unknown
-) => {
+export const renderWithProviders = (component, storeObj?: unknown) => {
   return render(component, {
     wrapper: function TestWrapper({ children }: PropsWithChildren<any>) {
       return (
-        <WrappedWithProviders store={storeObj} theme={themeObj}>
-          {children}
-        </WrappedWithProviders>
+        <WrappedWithProviders store={storeObj}>{children}</WrappedWithProviders>
       );
     },
   });

package/typeGuards/index.ts

@@ -1,7 +1,3 @@
 export const isString = (value: unknown) => {
-  if (typeof value === "object" && value instanceof String) {
-    return true;
-  }
-
   return typeof value === "string";
 };

package/utils/__tests__/clone.test.ts

@@ -0,0 +1,158 @@
+import { clone } from "../clone";
+
+describe("clone", () => {
+  const originalStructuredClone = global.structuredClone;
+
+  afterEach(() => {
+    // Restore the original structuredClone after each test
+    global.structuredClone = originalStructuredClone;
+  });
+
+  describe("when structuredClone is available", () => {
+    beforeEach(() => {
+      // Mock structuredClone if it's not available
+      if (typeof global.structuredClone === "undefined") {
+        global.structuredClone = jest.fn((value) =>
+          JSON.parse(JSON.stringify(value))
+        );
+      }
+    });
+
+    test("clones primitive values", () => {
+      expect(clone(42)).toBe(42);
+      expect(clone("test")).toBe("test");
+      expect(clone(true)).toBe(true);
+      expect(clone(null)).toBe(null);
+    });
+
+    test("clones simple objects", () => {
+      const original = { a: 1, b: 2 };
+      const cloned = clone(original);
+
+      expect(cloned).toEqual(original);
+      expect(cloned).not.toBe(original);
+    });
+
+    test("clones nested objects", () => {
+      const original = { a: { b: { c: 1 } } };
+      const cloned = clone(original);
+
+      expect(cloned).toEqual(original);
+      expect(cloned).not.toBe(original);
+      expect(cloned.a).not.toBe(original.a);
+      expect(cloned.a.b).not.toBe(original.a.b);
+    });
+
+    test("clones arrays", () => {
+      const original = [1, 2, 3];
+      const cloned = clone(original);
+
+      expect(cloned).toEqual(original);
+      expect(cloned).not.toBe(original);
+    });
+
+    test("clones arrays with nested objects", () => {
+      const original = [{ a: 1 }, { b: 2 }];
+      const cloned = clone(original);
+
+      expect(cloned).toEqual(original);
+      expect(cloned).not.toBe(original);
+      expect(cloned[0]).not.toBe(original[0]);
+      expect(cloned[1]).not.toBe(original[1]);
+    });
+
+    test("does not mutate the original value", () => {
+      const original = { a: 1, b: { c: 2 } };
+      const cloned = clone(original);
+
+      cloned.a = 99;
+      cloned.b.c = 99;
+
+      expect(original.a).toBe(1);
+      expect(original.b.c).toBe(2);
+    });
+  });
+
+  describe("when structuredClone is not available (fallback to cloneDeep)", () => {
+    beforeEach(() => {
+      // Delete structuredClone to force fallback to cloneDeep
+      delete (global as any).structuredClone;
+    });
+
+    test("clones primitive values using cloneDeep", () => {
+      expect(clone(42)).toBe(42);
+      expect(clone("test")).toBe("test");
+      expect(clone(true)).toBe(true);
+      expect(clone(null)).toBe(null);
+    });
+
+    test("clones simple objects using cloneDeep", () => {
+      const original = { a: 1, b: 2 };
+      const cloned = clone(original);
+
+      expect(cloned).toEqual(original);
+      expect(cloned).not.toBe(original);
+    });
+
+    test("clones nested objects using cloneDeep", () => {
+      const original = { a: { b: { c: 1 } } };
+      const cloned = clone(original);
+
+      expect(cloned).toEqual(original);
+      expect(cloned).not.toBe(original);
+      expect(cloned.a).not.toBe(original.a);
+      expect(cloned.a.b).not.toBe(original.a.b);
+    });
+
+    test("clones arrays using cloneDeep", () => {
+      const original = [1, 2, 3];
+      const cloned = clone(original);
+
+      expect(cloned).toEqual(original);
+      expect(cloned).not.toBe(original);
+    });
+
+    test("clones arrays with nested objects using cloneDeep", () => {
+      const original = [{ a: 1 }, { b: 2 }];
+      const cloned = clone(original);
+
+      expect(cloned).toEqual(original);
+      expect(cloned).not.toBe(original);
+      expect(cloned[0]).not.toBe(original[0]);
+      expect(cloned[1]).not.toBe(original[1]);
+    });
+
+    test("does not mutate the original value when using cloneDeep", () => {
+      const original = { a: 1, b: { c: 2 } };
+      const cloned = clone(original);
+
+      cloned.a = 99;
+      cloned.b.c = 99;
+
+      expect(original.a).toBe(1);
+      expect(original.b.c).toBe(2);
+    });
+
+    test("handles complex objects with multiple levels", () => {
+      const original = {
+        name: "test",
+        data: {
+          items: [
+            { id: 1, value: "a" },
+            { id: 2, value: "b" },
+          ],
+          meta: { count: 2 },
+        },
+      };
+
+      const cloned = clone(original);
+
+      expect(cloned).toEqual(original);
+      expect(cloned).not.toBe(original);
+      expect(cloned.data).not.toBe(original.data);
+      expect(cloned.data.items).not.toBe(original.data.items);
+      expect(cloned.data.items[0]).not.toBe(original.data.items[0]);
+      expect(cloned.data.meta).not.toBe(original.data.meta);
+    });
+  });
+});

package/utils/clone.ts

@@ -0,0 +1,7 @@
+import { cloneDeep } from "lodash";
+
+export const clone = (value) => {
+  return typeof structuredClone !== "undefined"
+    ? structuredClone(value) // no support for hermes, fallback to cloneDeep
+    : cloneDeep(value);
+};

package/utils/index.ts

@@ -18,10 +18,9 @@ export { take } from "./take";
 
 export { mapAccum } from "./mapAccum";
 
-export { mergeRight } from "./mergeRight";
+export { clone } from "./clone";
 
 export {
-  cloneDeep as clone,
   flatten,
   drop,
   size,
@@ -38,20 +37,9 @@ export {
   last,
   toLower,
   isEqual as equals,
-  uniq,
   uniqWith,
   flowRight as compose,
   partial,
-  clamp,
   reverse,
-  takeRight,
-  fromPairs,
-  sortBy,
-  merge,
-  values,
-  head,
-  findIndex,
-  set,
   compact,
-  identity,
 } from "lodash";

package/utils/path.ts

@@ -1,8 +1,5 @@
-import { pathOr } from "./pathOr";
+import { get } from "lodash";
 
-export const path = <T = any>(
-  route: (string | number) | (string | number)[],
-  record: any
-) => {
-  return pathOr<T>(undefined, route, record);
+export const path = (route, record) => {
+  return get(record, route, undefined);
 };

package/utils/pathOr.ts

@@ -1,9 +1,5 @@
 import { get } from "lodash";
 
-export const pathOr = <T = any>(
-  defaultValue: T,
-  path: (number | string) | (number | string)[],
-  record: any
-): T => {
+export const pathOr = (defaultValue, path, record) => {
   return get(record, path, defaultValue);
 };

package/zappFrameworkUtils/HookCallback/callbackNavigationAction.ts

@@ -85,7 +85,7 @@ export const getNavigationKeys = (
   const general = (item?.general ?? {}) as General;
 
   const pluginIdentifier =
-    (item as any).identifier ?? item?.type ?? item?.component_type ?? "";
+    (item as any)?.identifier ?? item?.type ?? item?.component_type ?? "";
 
   const legacy =
     legacyMappingKeys[`${pluginIdentifier}.${resultType}`] ??
@@ -197,7 +197,7 @@ export const useCallbackNavigationAction = (
         }
       }
 
-      hookCallback?.({ ...args, success: false, cancelled: true });
+      hookCallback?.({ ...args, success: false, abort: true });
       const currentNavigation = navigationRef.current;
 
       switch (data.action) {

package/zappFrameworkUtils/HookCallback/hookCallbackManifestExtensions.config.js

@@ -20,7 +20,7 @@ const callbackKeyPrefix = (key, prefix, keySeparator = "_") =>
 
 const extendManifestWithHookCallback = (prefix = null) => ({
   group: true,
-  label: `CallBack Navigation: ${prefix}`,
+  label: prefix ? `Callback Navigation: ${prefix}` : "Callback Navigation",
   folded: true,
   fields: [
     {

package/zappFrameworkUtils/loginPluginUtils.ts

@@ -20,7 +20,7 @@ const isAuthenticationRequired = ({ payload, logs }) => {
 
   if (!payload) {
     log_info(
-      "isAuthenticationRequired: No payload exist, authentication required"
+      "isAuthenticationRequired: No payload exists, authentication required"
     );
 
     return true;