@applicaster/zapp-react-native-utils 13.0.0-rc.13 → 13.0.0-rc.131

package/reactHooks/state/__tests__/ZStoreProvider.test.tsx

@@ -0,0 +1,66 @@
+import React from "react";
+import { render, screen } from "@testing-library/react-native";
+import { Text } from "react-native";
+import { ZStoreProvider, useZStore } from "../ZStoreProvider";
+import { useStore } from "zustand";
+
+interface TestState {
+  value: string;
+}
+
+// Test component that uses the store
+const TestComponent = ({ storeName }: { storeName: string }) => {
+  const store = useZStore(storeName);
+  const value = useStore(store, (state: any) => (state as TestState).value);
+
+  return <Text testID="test-value">{value}</Text>;
+};
+
+// Test component that provides a store
+const TestProvider = ({ children }: { children: React.ReactNode }) => {
+  return (
+    <ZStoreProvider name="testStore" value={{ value: "test-value" }}>
+      {children}
+    </ZStoreProvider>
+  );
+};
+
+describe("ZStoreProvider and useZStore", () => {
+  it("should provide a store and allow access via useZStore", () => {
+    render(
+      <TestProvider>
+        <TestComponent storeName="testStore" />
+      </TestProvider>
+    );
+
+    expect(screen.getByTestId("test-value").props.children).toBe("test-value");
+  });
+
+  it("should throw error when useZStore is used outside provider", () => {
+    // Suppress console.error for this test
+    const originalError = console.error;
+    console.error = jest.fn();
+
+    expect(() => {
+      render(<TestComponent storeName="testStore" />);
+    }).toThrow("useZStore must be used within a ZStoreProvider");
+
+    console.error = originalError;
+  });
+
+  it("should throw error when store name is not found", () => {
+    // Suppress console.error for this test
+    const originalError = console.error;
+    console.error = jest.fn();
+
+    expect(() => {
+      render(
+        <TestProvider>
+          <TestComponent storeName="nonExistentStore" />
+        </TestProvider>
+      );
+    }).toThrow('Store with name "nonExistentStore" not found');
+
+    console.error = originalError;
+  });
+});

package/reactHooks/state/index.ts

@@ -1,3 +1,5 @@
 export { useRivers } from "./useRivers";
 
 export { useHomeRiver } from "./useHomeRiver";
+
+export { ZStoreProvider, useZStore } from "./ZStoreProvider";

package/reactHooks/state/useRefWithInitialValue.ts

@@ -0,0 +1,14 @@
+import React from "react";
+
+/**
+ * returns a ref with an initial value that is lazily evaluated once
+ * */
+export const useRefWithInitialValue = <T>(initialValueGetter: () => T) => {
+  const ref = React.useRef<T>(null);
+
+  if (ref.current === null) {
+    ref.current = initialValueGetter();
+  }
+
+  return ref;
+};

package/reactHooks/state/useStateFromSubscribe.ts

@@ -0,0 +1,23 @@
+import { useEffect, useState } from "react";
+import type { Subject } from "rxjs";
+
+export const useStateFromSubscribe = <T, U>(
+  subject: Subject<T>,
+  onUpdate: (
+    observerValue: T,
+    next: React.Dispatch<React.SetStateAction<U>>
+  ) => void,
+  initialValue: U
+) => {
+  const [state, setState] = useState<U>(initialValue);
+
+  useEffect(() => {
+    const subscription = subject.subscribe((observer) =>
+      onUpdate(observer, setState)
+    );
+
+    return () => subscription.unsubscribe();
+  }, [subject]);
+
+  return state;
+};

package/reactHooks/useListenEventBusEvent.ts

@@ -23,5 +23,5 @@ export const useListenEventBusEvent = (
         sub.remove(); // stop listening to DeviceEventEmitter
       };
     }
-  }, []);
+  }, [handler, subscriptionID, source, events]);
 };

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/reactUtils/__tests__/__snapshots__/reactUtilsHelpers.test.js.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`addLifeCycleMethods attaches the lifecycle method to the component 1`] = `
+exports[`reactUtils helpers addLifeCycleMethods attaches the lifecycle method to the component 1`] = `
 <View>
   <Text>
     I'm a class component
@@ -8,7 +8,7 @@ exports[`addLifeCycleMethods attaches the lifecycle method to the component 1`]
 </View>
 `;
 
-exports[`attachMethodToPrototype attaches a lifecycle method to the component's prototype 1`] = `
+exports[`reactUtils helpers attachMethodToPrototype attaches a lifecycle method to the component's prototype 1`] = `
 <View>
   <Text>
     I'm a class component
@@ -16,6 +16,18 @@ exports[`attachMethodToPrototype attaches a lifecycle method to the component's
 </View>
 `;
 
-exports[`attachMethodToPrototype preserves any existing lifecycle method 1`] = `<StatelessComponent />`;
+exports[`reactUtils helpers attachMethodToPrototype preserves any existing lifecycle method 1`] = `
+<View>
+  <Text>
+    I'm a stateless component
+  </Text>
+</View>
+`;
 
-exports[`wrapInClass wraps the stateless component in a class 1`] = `<StatelessComponent />`;
+exports[`reactUtils helpers wrapInClass wraps the stateless component in a class 1`] = `
+<View>
+  <Text>
+    I'm a stateless component
+  </Text>
+</View>
+`;

package/reactUtils/__tests__/reactUtils.test.js

@@ -1,4 +1,3 @@
-jest.mock("create-react-ref/lib/createRef", () => jest.fn());
 import * as React from "react";
 import * as helpers from "../helpers";
 
@@ -8,13 +7,7 @@ import {
   componentDidMount,
 } from "./fixtures";
 
-const {
-  attachLifeCycleMethods,
-  createReactRef,
-  mergeChildrenProps,
-} = require("../index");
-
-const createRef = require("create-react-ref/lib/createRef");
+import { attachLifeCycleMethods, mergeChildrenProps } from "..";
 
 describe("attachLifeCycleMethods", () => {
   let addLifeCycleMethodsSpy;
@@ -48,35 +41,6 @@ describe("attachLifeCycleMethods", () => {
   });
 });
 
-describe("createReactRef", () => {
-  it("calls the React.createRef function if it exists", () => {
-    jest.resetModules();
-
-    jest.doMock("react", () => ({
-      ...jest.requireActual("react"),
-      createRef: jest.fn(),
-    }));
-
-    const React = require("react");
-
-    createReactRef();
-    expect(React.createRef).toHaveBeenCalled();
-    expect(createRef).not.toHaveBeenCalled();
-  });
-
-  it("calls the polyfill if React.createRef doesn't exist", () => {
-    jest.resetModules();
-
-    jest.doMock("react", () => ({
-      ...jest.requireActual("react"),
-      createRef: undefined,
-    }));
-
-    createReactRef();
-    expect(createRef).toHaveBeenCalled();
-  });
-});
-
 describe("mergeChildrenProps", () => {
   it("returns the cloned children with the merged props", () => {
     const Egg = () => React.createElement("Egg");

package/reactUtils/__tests__/reactUtilsHelpers.test.js

@@ -1,6 +1,5 @@
 import * as React from "react";
-import { shallow } from "enzyme";
-import { shallowToJson } from "enzyme-to-json";
+import { render } from "@testing-library/react-native";
 
 import {
   isClassComponent,
@@ -20,98 +19,100 @@ import {
 } from "./fixtures";
 
 describe("reactUtils helpers", () => {
-  it("should have isNilOrEmpty", () => {
-    expect(isNilOrEmpty).toBeDefined();
-    expect(isNilOrEmpty(null)).toBeTruthy();
-    expect(isNilOrEmpty(undefined)).toBeTruthy();
-    expect(isNilOrEmpty("")).toBeTruthy();
-    expect(isNilOrEmpty([])).toBeTruthy();
+  describe("isNilOrEmpty", () => {
+    it("should return correct output", () => {
+      expect(isNilOrEmpty).toBeDefined();
+      expect(isNilOrEmpty(null)).toBeTruthy();
+      expect(isNilOrEmpty(undefined)).toBeTruthy();
+      expect(isNilOrEmpty("")).toBeTruthy();
+      expect(isNilOrEmpty([])).toBeTruthy();
+    });
   });
-});
 
-describe("isClassComponent", () => {
-  it("returns true if the component is a class component", () => {
-    expect(isClassComponent(ClassComponent)).toBe(true);
-  });
+  describe("isClassComponent", () => {
+    it("returns true if the component is a class component", () => {
+      expect(isClassComponent(ClassComponent)).toBe(true);
+    });
 
-  it("returns false otherwise", () => {
-    expect(isClassComponent(StatelessComponent)).toBe(false);
+    it("returns false otherwise", () => {
+      expect(isClassComponent(StatelessComponent)).toBe(false);
+    });
   });
-});
 
-describe("attachMethodToPrototype", () => {
-  const initialWrapper = shallow(<ClassComponent />);
+  describe("attachMethodToPrototype", () => {
+    const initialWrapper = render(<ClassComponent />);
 
-  expect(initialWrapper.instance()).not.toHaveProperty(
-    COMPONENT_DID_MOUNT_METHOD
-  );
-
-  afterEach(() => {
-    componentDidMount.mockClear();
-  });
-
-  it("attaches a lifecycle method to the component's prototype", () => {
-    const NewComponent = attachMethodToPrototype(ClassComponent)(
-      componentDidMount,
+    expect(initialWrapper.toJSON()).not.toHaveProperty(
       COMPONENT_DID_MOUNT_METHOD
     );
 
-    const wrapper = shallow(<NewComponent />);
+    afterEach(() => {
+      componentDidMount.mockClear();
+    });
 
-    expect(shallowToJson(wrapper)).toMatchSnapshot();
-    expect(wrapper.instance()).toHaveProperty(COMPONENT_DID_MOUNT_METHOD);
-    expect(componentDidMount).toHaveBeenCalled();
-  });
+    it("attaches a lifecycle method to the component's prototype", () => {
+      const NewComponent = attachMethodToPrototype(ClassComponent)(
+        componentDidMount,
+        COMPONENT_DID_MOUNT_METHOD
+      );
 
-  it("preserves any existing lifecycle method", () => {
-    const NewComponent = attachMethodToPrototype(ComponentWithLifeCycle)(
-      componentDidMount,
-      COMPONENT_DID_MOUNT_METHOD
-    );
+      const wrapper = render(<NewComponent />);
 
-    expect(componentDidMount).not.toHaveBeenCalled();
+      expect(wrapper.toJSON(wrapper)).toMatchSnapshot();
+      expect(new NewComponent()).toHaveProperty(COMPONENT_DID_MOUNT_METHOD);
+      expect(componentDidMount).toHaveBeenCalled();
+    });
 
-    const wrapper = shallow(<NewComponent />);
+    it("preserves any existing lifecycle method", () => {
+      const NewComponent = attachMethodToPrototype(ComponentWithLifeCycle)(
+        componentDidMount,
+        COMPONENT_DID_MOUNT_METHOD
+      );
 
-    expect(shallowToJson(wrapper)).toMatchSnapshot();
-    expect(componentDidMount).toHaveBeenCalled();
-    expect(existingMethod).toHaveBeenCalled();
-  });
-});
+      expect(componentDidMount).not.toHaveBeenCalled();
 
-describe("wrapInClass", () => {
-  let NewComponent;
-  let wrapper;
+      const wrapper = render(<NewComponent />);
 
-  beforeEach(() => {
-    NewComponent = wrapInClass(StatelessComponent);
-    wrapper = shallow(<NewComponent />);
+      expect(wrapper.toJSON()).toMatchSnapshot();
+      expect(componentDidMount).toHaveBeenCalled();
+      expect(existingMethod).toHaveBeenCalled();
+    });
   });
 
-  it("wraps the stateless component in a class", () => {
-    expect(isClassComponent(NewComponent)).toBe(true);
-    expect(shallowToJson(wrapper)).toMatchSnapshot();
-  });
-});
+  describe("wrapInClass", () => {
+    let NewComponent;
+    let wrapper;
 
-describe("addLifeCycleMethods", () => {
-  let NewComponent;
-  let wrapper;
+    beforeEach(() => {
+      NewComponent = wrapInClass(StatelessComponent);
+      wrapper = render(<NewComponent />);
+    });
 
-  beforeEach(() => {
-    NewComponent = addLifeCycleMethods({ componentDidMount })(ClassComponent);
-    wrapper = shallow(<NewComponent />);
+    it("wraps the stateless component in a class", () => {
+      expect(isClassComponent(NewComponent)).toBe(true);
+      expect(wrapper.toJSON()).toMatchSnapshot();
+    });
   });
 
-  afterEach(() => {
-    componentDidMount.mockClear();
-  });
+  describe("addLifeCycleMethods", () => {
+    let NewComponent;
+    let wrapper;
 
-  it("attaches the lifecycle method to the component", () => {
-    expect(shallowToJson(wrapper)).toMatchSnapshot();
-  });
+    beforeEach(() => {
+      NewComponent = addLifeCycleMethods({ componentDidMount })(ClassComponent);
+      wrapper = render(<NewComponent />);
+    });
+
+    afterEach(() => {
+      componentDidMount.mockClear();
+    });
+
+    it("attaches the lifecycle method to the component", () => {
+      expect(wrapper.toJSON()).toMatchSnapshot();
+    });
 
-  it("adds the lifecycle method to the component", () => {
-    expect(componentDidMount).toHaveBeenCalled();
+    it("adds the lifecycle method to the component", () => {
+      expect(componentDidMount).toHaveBeenCalled();
+    });
   });
 });

package/reactUtils/createContext/__tests__/__snapshots__/helpers.test.js.snap

@@ -1,106 +1,40 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`createContextSetters when no state validator is provided calls setState when the setters are called, no matter what the value is 1`] = `
-Object {
+exports[`helpers createContextSetters when no state validator is provided calls setState when the setters are called, no matter what the value is 1`] = `
+{
   "bar": "bar",
   "foo": "foo",
 }
 `;
 
-exports[`createContextSetters when no state validator is provided calls setState when the setters are called, no matter what the value is 2`] = `
-Object {
-  "bar": "bar",
-  "foo": "invalid foo",
-}
-`;
-
-exports[`createContextSetters when no state validator is provided calls setState when the setters are called, no matter what the value is 3`] = `
-Object {
-  "bar": "invalid bar",
-  "foo": "invalid foo",
-}
-`;
-
-exports[`createContextSetters when no state validator is provided calls setState when the setters are called, no matter what the value is 4`] = `
-Array [
-  Array [
-    [Function],
-  ],
-  Array [
-    [Function],
-  ],
-]
-`;
-
-exports[`createContextSetters when state validator is provided calls setState when the setters are called & the validator passes 1`] = `
-Object {
+exports[`helpers createContextSetters when no state validator is provided calls setState when the setters are called, no matter what the value is 2`] = `
+{
   "bar": "bar",
   "foo": "foo",
 }
 `;
 
-exports[`createContextSetters when state validator is provided calls setState when the setters are called & the validator passes 2`] = `
-Object {
+exports[`helpers createContextSetters when no state validator is provided calls setState when the setters are called, no matter what the value is 3`] = `
+{
   "bar": "bar",
-  "foo": "new foo",
-}
-`;
-
-exports[`createContextSetters when state validator is provided calls setState when the setters are called & the validator passes 3`] = `
-Object {
-  "bar": "new bar",
-  "foo": "new foo",
+  "foo": "foo",
 }
 `;
 
-exports[`createContextSetters when state validator is provided calls setState when the setters are called & the validator passes 4`] = `
-Array [
-  Array [
+exports[`helpers createContextSetters when no state validator is provided calls setState when the setters are called, no matter what the value is 4`] = `
+[
+  [
     [Function],
   ],
-  Array [
+  [
     [Function],
   ],
 ]
 `;
 
-exports[`createContextSetters when state validator is provided skips the update if the new value is the same as the previous one 1`] = `
-Object {
+exports[`helpers createContextSetters when state validator is provided skips the update if the new value is the same as the previous one 1`] = `
+{
   "bar": "bar",
   "foo": "new foo",
 }
 `;
-
-exports[`createContextSetters when state validator is provided skips the update if the state validator doesn't pass 1`] = `
-Object {
-  "bar": "bar",
-  "foo": "foo",
-}
-`;
-
-exports[`createContextSetters when state validator is provided skips the update if the state validator doesn't pass 2`] = `
-Object {
-  "bar": "bar",
-  "foo": "foo",
-}
-`;
-
-exports[`createContextSetters when state validator is provided skips the update if the state validator doesn't pass 3`] = `
-Object {
-  "bar": "bar",
-  "foo": "foo",
-}
-`;
-
-exports[`createContextSetters when state validator is provided skips the update if the state validator doesn't pass 4`] = `
-Array [
-  Array [
-    "trying to invoke setFoo with invalid foo - but it was rejected by the state validator
-          skipping context update",
-  ],
-  Array [
-    "trying to invoke setBar with invalid bar - but it was rejected by the state validator
-          skipping context update",
-  ],
-]
-`;

package/reactUtils/createContext/__tests__/__snapshots__/{index.test.js.snap → index.test.ts.snap}

@@ -1,10 +1,10 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`createContext - when React has the new context API returns the components and the decorators 1`] = `
-Object {
+{
   "Consumer": [MockFunction],
   "Provider": [MockFunction],
-  "ReactContext": Object {
+  "ReactContext": {
     "Consumer": [MockFunction],
     "Provider": [MockFunction],
   },

package/reactUtils/createContext/__tests__/__snapshots__/provider.test.js.snap

@@ -1,32 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`createProvider creates a context Provider component 1`] = `
-<mockConstructor
-  value={
-    Object {
-      "context": "initialValue",
-      "otherContext": "otherValue",
-      "setContext": [Function],
-      "setOtherContext": [Function],
-    }
-  }
->
-  <MockChild
-    context="context"
-  />
-</mockConstructor>
-`;
-
-exports[`createProvider creates a context Provider component 2`] = `
-Object {
-  "children": <MockChild
-    context="context"
-  />,
-  "value": Object {
-    "context": "initialValue",
-    "otherContext": "otherValue",
-    "setContext": [Function],
-    "setOtherContext": [Function],
-  },
-}
+<View>
+  context
+</View>
 `;

package/reactUtils/createContext/__tests__/__snapshots__/withConsumer.test.js.snap

@@ -1,8 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`createConsumer creates a context consumer function 1`] = `
-<Child
-  context="foo"
-  setContext={[MockFunction]}
-/>
+<View>
+  foo
+</View>
 `;

package/reactUtils/createContext/__tests__/__snapshots__/withProvider.test.js.snap

@@ -1,7 +1,11 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`withProvider decorates a component with the provider 1`] = `
-<Provider>
-  <Component />
-</Provider>
+<View>
+  <View>
+    <Text>
+      I am a Component
+    </Text>
+  </View>
+</View>
 `;