@applicaster/zapp-react-native-utils 14.0.0-alpha.3140225604 → 14.0.0-alpha.3216572828

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (47) hide show
  1. package/analyticsUtils/AnalyticsEvents/sendHeaderClickEvent.ts +1 -1
  2. package/analyticsUtils/AnalyticsEvents/sendMenuClickEvent.ts +2 -1
  3. package/analyticsUtils/index.tsx +3 -4
  4. package/analyticsUtils/manager.ts +1 -1
  5. package/appUtils/HooksManager/Hook.ts +4 -4
  6. package/appUtils/HooksManager/index.ts +11 -1
  7. package/appUtils/accessibilityManager/index.ts +3 -12
  8. package/appUtils/focusManager/__tests__/__snapshots__/focusManager.test.js.snap +5 -0
  9. package/appUtils/focusManager/__tests__/focusManager.test.js +1 -1
  10. package/appUtils/focusManager/index.ios.ts +10 -0
  11. package/appUtils/focusManager/index.ts +82 -11
  12. package/appUtils/focusManager/treeDataStructure/Tree/index.js +1 -1
  13. package/appUtils/focusManagerAux/utils/index.ts +106 -3
  14. package/arrayUtils/index.ts +1 -1
  15. package/componentsUtils/__tests__/isTabsScreen.test.ts +38 -0
  16. package/componentsUtils/index.ts +4 -1
  17. package/configurationUtils/__tests__/manifestKeyParser.test.ts +0 -1
  18. package/index.d.ts +0 -12
  19. package/navigationUtils/__tests__/mapContentTypesToRivers.test.ts +130 -0
  20. package/navigationUtils/index.ts +6 -4
  21. package/package.json +2 -3
  22. package/reactHooks/autoscrolling/__tests__/useTrackedView.test.tsx +15 -14
  23. package/reactHooks/debugging/__tests__/index.test.js +0 -1
  24. package/reactHooks/feed/__tests__/useBatchLoading.test.tsx +39 -88
  25. package/reactHooks/feed/useBatchLoading.ts +8 -6
  26. package/reactHooks/feed/useFeedLoader.tsx +12 -8
  27. package/reactHooks/feed/usePipesCacheReset.ts +2 -2
  28. package/reactHooks/flatList/useSequentialRenderItem.tsx +3 -3
  29. package/reactHooks/layout/__tests__/index.test.tsx +3 -1
  30. package/reactHooks/layout/useDimensions/__tests__/useDimensions.test.ts +34 -36
  31. package/reactHooks/layout/useDimensions/useDimensions.ts +2 -3
  32. package/reactHooks/layout/useLayoutVersion.ts +5 -5
  33. package/reactHooks/navigation/index.ts +5 -7
  34. package/reactHooks/resolvers/__tests__/useCellResolver.test.tsx +4 -0
  35. package/reactHooks/state/index.ts +1 -1
  36. package/reactHooks/state/useHomeRiver.ts +4 -2
  37. package/reactHooks/state/useRivers.ts +7 -8
  38. package/screenPickerUtils/index.ts +7 -0
  39. package/testUtils/index.tsx +7 -8
  40. package/time/BackgroundTimer.ts +1 -1
  41. package/utils/__tests__/find.test.ts +36 -0
  42. package/utils/__tests__/pathOr.test.ts +37 -0
  43. package/utils/__tests__/startsWith.test.ts +30 -0
  44. package/utils/find.ts +3 -0
  45. package/utils/index.ts +8 -0
  46. package/utils/pathOr.ts +5 -0
  47. package/utils/startsWith.ts +9 -0
@@ -1,46 +1,48 @@
1
1
  import { renderHook } from "@testing-library/react-hooks";
2
2
  import { Dimensions, StatusBar } from "react-native";
3
+ import { useDimensions } from "../useDimensions";
4
+ import { usePickFromState } from "@applicaster/zapp-react-native-redux";
3
5
 
4
- const mockUsePickFromState = jest.fn();
5
- const mockUseIsScreenActive = jest.fn();
6
- const mockGetInitialDimensions = jest.fn();
7
- const mockGetDeviceInfo = jest.fn();
6
+ import { useIsScreenActive } from "@applicaster/zapp-react-native-utils/reactHooks/navigation/useIsScreenActive";
8
7
 
9
- jest.mock("@applicaster/zapp-react-native-redux/hooks", () => ({
10
- ...(jest.requireActual("@applicaster/zapp-react-native-redux/hooks") as {}),
11
- usePickFromState: mockUsePickFromState,
12
- }));
13
-
14
- jest.mock("../../../navigation", () => ({
15
- useIsScreenActive: mockUseIsScreenActive,
16
- }));
8
+ jest.mock("@applicaster/zapp-react-native-redux/hooks", () => {
9
+ return {
10
+ ...jest.requireActual("@applicaster/zapp-react-native-redux/hooks"),
11
+ usePickFromState: jest.fn(),
12
+ };
13
+ });
17
14
 
18
- jest.mock("../helpers", () => ({
19
- getInitialDimensions: mockGetInitialDimensions,
15
+ jest.mock(
16
+ "@applicaster/zapp-react-native-utils/reactHooks/navigation/useIsScreenActive",
17
+ () => ({
18
+ useIsScreenActive: jest.fn().mockReturnValue(true),
19
+ })
20
+ );
21
+
22
+ jest.doMock("../helpers", () => ({
23
+ getInitialDimensions: jest
24
+ .fn()
25
+ .mockReturnValue({ width: 100, height: 200, scale: 1, fontScale: 1 }),
20
26
  }));
21
27
 
22
28
  jest.mock("../../getDeviceInfo", () => ({
23
- getDeviceInfo: mockGetDeviceInfo,
29
+ getDeviceInfo: jest.fn().mockReturnValue({ deviceInfo: "testDeviceInfo" }),
24
30
  }));
25
31
 
26
- const { useDimensions } = require("../useDimensions");
32
+ const mockDimensions = { width: 100, height: 200, scale: 1, fontScale: 1 };
33
+
34
+ Dimensions.get = jest.fn().mockReturnValue(mockDimensions);
35
+
36
+ Dimensions.addEventListener = jest.fn().mockReturnValue({
37
+ remove: jest.fn(),
38
+ });
27
39
 
28
40
  describe("useDimensions", () => {
29
- const mockDimensions = { width: 100, height: 200, scale: 1, fontScale: 1 };
30
41
  const mockAppData = { someData: "test" };
31
42
 
32
43
  beforeEach(() => {
33
- jest.clearAllMocks();
34
- Dimensions.get = jest.fn().mockReturnValue(mockDimensions);
35
-
36
- Dimensions.addEventListener = jest.fn().mockReturnValue({
37
- remove: jest.fn(),
38
- });
39
-
40
- mockUsePickFromState.mockReturnValue({ appData: mockAppData });
41
- mockUseIsScreenActive.mockReturnValue(true);
42
- mockGetInitialDimensions.mockReturnValue(mockDimensions);
43
- mockGetDeviceInfo.mockReturnValue({ deviceInfo: "testDeviceInfo" });
44
+ StatusBar.currentHeight = 20;
45
+ (usePickFromState as jest.Mock).mockReturnValue({ appData: mockAppData });
44
46
  });
45
47
 
46
48
  it("returns correct initial dimensions", () => {
@@ -48,12 +50,9 @@ describe("useDimensions", () => {
48
50
  useDimensions("window", { fullDimensions: false })
49
51
  );
50
52
 
51
- expect(result.current).toEqual({
52
- ...mockDimensions,
53
+ expect(result.current).toMatchObject({
53
54
  statusBarHeight: StatusBar.currentHeight,
54
55
  });
55
-
56
- expect(mockGetInitialDimensions).toHaveBeenCalledWith("window");
57
56
  });
58
57
 
59
58
  it("calls handler on mount", () => {
@@ -70,7 +69,7 @@ describe("useDimensions", () => {
70
69
  useDimensions("window", { fullDimensions: false })
71
70
  );
72
71
 
73
- mockUseIsScreenActive.mockReturnValue(false);
72
+ (useIsScreenActive as jest.Mock).mockReturnValue(false);
74
73
  rerender();
75
74
 
76
75
  expect(Dimensions.addEventListener).toHaveBeenCalledWith(
@@ -84,8 +83,7 @@ describe("useDimensions", () => {
84
83
  useDimensions("window", { fullDimensions: true })
85
84
  );
86
85
 
87
- expect(result.current).toEqual({
88
- ...mockDimensions,
86
+ expect(result.current).toMatchObject({
89
87
  scale: 1,
90
88
  fontScale: 1,
91
89
  statusBarHeight: StatusBar.currentHeight,
@@ -98,7 +96,7 @@ describe("useDimensions", () => {
98
96
  );
99
97
 
100
98
  expect(result.current.height).toBe(
101
- mockDimensions.height - StatusBar.currentHeight ?? 0
99
+ mockDimensions.height - (StatusBar?.currentHeight ?? 0)
102
100
  );
103
101
  });
104
102
 
@@ -10,7 +10,7 @@ import { isTV } from "../../../reactUtils";
10
10
  import { Options, UseDimensions } from "../types";
11
11
  import { getDeviceInfo } from "../getDeviceInfo";
12
12
  import { getInitialDimensions } from "./helpers";
13
- import { useIsScreenActive } from "../../navigation";
13
+ import { useIsScreenActive } from "../../navigation/useIsScreenActive";
14
14
 
15
15
  function compensateForScaleIfNeeded(context) {
16
16
  return function () {
@@ -24,8 +24,6 @@ const applyScaleToDimensions = R.unless(R.propEq("scale", 1), (dimensions) => ({
24
24
  scale: 1,
25
25
  }));
26
26
 
27
- const statusBarHeight = StatusBar?.currentHeight;
28
-
29
27
  /**
30
28
  * Returns React-native Dimensions object and updates it on any dimension change
31
29
  * @param {('screen'|'window')} [context=window] - Dimensions context passed to Dimensions.get method
@@ -37,6 +35,7 @@ export const useDimensions: UseDimensions = (
37
35
  context = "window",
38
36
  fullDimensions = { fullDimensions: false, updateForInactiveScreens: true }
39
37
  ) => {
38
+ const statusBarHeight = StatusBar?.currentHeight;
40
39
  const isActive = useIsScreenActive();
41
40
  const { appData } = usePickFromState(["appData"]);
42
41
 
@@ -1,6 +1,8 @@
1
1
  /* eslint-disable no-redeclare */
2
- import { useSelector } from "react-redux";
3
- import * as R from "ramda";
2
+ import {
3
+ useAppSelector,
4
+ selectLayoutVersion,
5
+ } from "@applicaster/zapp-react-native-redux";
4
6
 
5
7
  export function useLayoutVersion(): ZappLayoutVersions;
6
8
 
@@ -23,9 +25,7 @@ export function useLayoutVersion({
23
25
  isV2?: boolean;
24
26
  isV1?: boolean;
25
27
  } = {}): boolean | ZappLayoutVersions {
26
- const layoutVersion = useSelector<any, ZappLayoutVersions>(
27
- R.path(["appData", "layoutVersion"])
28
- );
28
+ const layoutVersion = useAppSelector(selectLayoutVersion);
29
29
 
30
30
  if (isV2) {
31
31
  return layoutVersion === "v2";
@@ -128,14 +128,12 @@ export function isNavBarVisible(
128
128
  export const useBackHandler = (cb: () => boolean) => {
129
129
  useEffect(() => {
130
130
  if (!isWeb()) {
131
- BackHandler.addEventListener("hardwareBackPress", cb);
132
- }
131
+ const unsubscribe = BackHandler.addEventListener("hardwareBackPress", cb);
133
132
 
134
- return () => {
135
- if (!isWeb()) {
136
- BackHandler.removeEventListener("hardwareBackPress", cb);
137
- }
138
- };
133
+ return () => {
134
+ unsubscribe.remove();
135
+ };
136
+ }
139
137
  }, [cb]);
140
138
  };
141
139
 
@@ -14,6 +14,10 @@ jest.mock("@applicaster/zapp-react-native-utils/localizationUtils", () => ({
14
14
 
15
15
  jest.mock("@applicaster/zapp-react-native-utils/reactHooks/navigation");
16
16
 
17
+ jest.mock(
18
+ "@applicaster/zapp-react-native-utils/reactHooks/navigation/useNavigation"
19
+ );
20
+
17
21
  const { useCellResolver } = require("../useCellResolver");
18
22
 
19
23
  describe("cellResolver", () => {
@@ -1,5 +1,5 @@
1
1
  export { useRivers } from "./useRivers";
2
2
 
3
- export { useHomeRiver } from "./useHomeRiver";
3
+ export { useHomeRiver, getHomeRiver } from "./useHomeRiver";
4
4
 
5
5
  export { ZStoreProvider, useZStore } from "./ZStoreProvider";
@@ -1,8 +1,10 @@
1
- import * as R from "ramda";
2
1
  import { useRivers } from "./useRivers";
3
2
 
3
+ export const getHomeRiver = (rivers: Record<string, ZappRiver>) =>
4
+ Object.values(rivers).find((river: ZappRiver) => river.home);
5
+
4
6
  export const useHomeRiver = () => {
5
7
  const rivers = useRivers();
6
8
 
7
- return R.compose(R.find(R.propEq("home", true)), R.values)(rivers);
9
+ return getHomeRiver(rivers);
8
10
  };
@@ -1,9 +1,8 @@
1
- import { usePickFromState } from "@applicaster/zapp-react-native-redux/hooks";
1
+ import {
2
+ useAppSelector,
3
+ selectRivers,
4
+ } from "@applicaster/zapp-react-native-redux";
2
5
 
3
- const riversSelector = ["rivers"];
4
-
5
- export const useRivers = () => {
6
- const { rivers } = usePickFromState(riversSelector as any);
7
-
8
- return rivers;
9
- };
6
+ export function useRivers(): Record<string, ZappRiver> {
7
+ return useAppSelector(selectRivers);
8
+ }
@@ -0,0 +1,7 @@
1
+ export const getFocusableId = (id) => `PickerItem.${id}`;
2
+
3
+ export const getPickerSelectorId = (id) => `PickerSelector.${id}`;
4
+
5
+ export const SCREEN_PICKER_CONTAINER = "ScreenPickerContainer";
6
+
7
+ export const getScreenPickerId = (id) => `${SCREEN_PICKER_CONTAINER}.${id}`;
@@ -1,17 +1,16 @@
1
- import * as R from "ramda";
2
-
1
+ import { SafeAreaProvider } from "react-native-safe-area-context";
2
+ import { render } from "@testing-library/react-native";
3
3
  import React, { PropsWithChildren } from "react";
4
- import { View } from "react-native";
5
-
4
+ import configureStore from "redux-mock-store";
6
5
  import { Provider } from "react-redux";
6
+ import { View } from "react-native";
7
7
  import thunk from "redux-thunk";
8
- import configureStore from "redux-mock-store";
9
- import { SafeAreaProvider } from "react-native-safe-area-context";
8
+ import * as R from "ramda";
9
+
10
10
  import { appStore } from "@applicaster/zapp-react-native-redux/AppStore";
11
11
 
12
- import { render } from "@testing-library/react-native";
13
- import { AnalyticsProvider } from "../analyticsUtils";
14
12
  import { ThemeContext } from "../theme";
13
+ import { AnalyticsProvider } from "../analyticsUtils";
15
14
 
16
15
  export { getByTestId } from "./getByTestId";
17
16
 
@@ -11,7 +11,7 @@ class BackgroundTimer {
11
11
  this.uniqueId = 0;
12
12
  this.callbacks = {};
13
13
 
14
- const EventEmitter = platformSelect({
14
+ const EventEmitter: typeof DeviceEventEmitter | undefined = platformSelect({
15
15
  android: DeviceEventEmitter,
16
16
  android_tv: DeviceEventEmitter,
17
17
  amazon: DeviceEventEmitter, // probably does not exist and uses android_tv
@@ -0,0 +1,36 @@
1
+ import { find } from "../find";
2
+
3
+ test("example 1", () => {
4
+ const predicate = <T>(_: T, index: number): boolean => index === 0;
5
+ const xs = ["1", "2", "2", "3", "4"];
6
+
7
+ expect(find(predicate, xs)).toBe("1");
8
+ });
9
+
10
+ test("example 2", () => {
11
+ const predicate = <T>(_: T, index: number): boolean => index === 0;
12
+ const xs: string[] = [];
13
+
14
+ expect(find(predicate, xs)).toBe(undefined);
15
+ });
16
+
17
+ test("example 3", () => {
18
+ const predicate = () => false;
19
+ const xs = ["1", "2", "2", "3"];
20
+
21
+ expect(find(predicate, xs)).toBe(undefined);
22
+ });
23
+
24
+ test("example 4", () => {
25
+ const predicate = <T>(_: T, index: number): boolean => index === 1;
26
+ const xs = ["1", "2", "2", "3"];
27
+
28
+ expect(find(predicate, xs)).toBe("2");
29
+ });
30
+
31
+ test("example 5", () => {
32
+ const predicate = <T>(_: T, index: number): boolean => index === 2;
33
+ const xs = ["1", "2.1", "2", "3", "2", "4"];
34
+
35
+ expect(find(predicate, xs)).toBe("2");
36
+ });
@@ -0,0 +1,37 @@
1
+ import { pathOr } from "../pathOr";
2
+
3
+ test("example 1", () => {
4
+ const defaultValue = "defaultValue";
5
+ const path = ["a", "b", "c"];
6
+ const xs = { a: { b: { c: 1 } } };
7
+
8
+ const output = 1;
9
+
10
+ expect(pathOr(defaultValue, path, xs)).toEqual(output);
11
+ });
12
+
13
+ test("example 2", () => {
14
+ const defaultValue = "defaultValue";
15
+ const path = ["a", "b"];
16
+ const xs = { a: { b: { c: 1 } } };
17
+
18
+ const output = { c: 1 };
19
+
20
+ expect(pathOr(defaultValue, path, xs)).toEqual(output);
21
+ });
22
+
23
+ test("example 3", () => {
24
+ const defaultValue = "defaultValue";
25
+ const path = ["a", "b", "x"];
26
+ const xs = { a: { b: { c: 1 } } };
27
+
28
+ expect(pathOr(defaultValue, path, xs)).toBe(defaultValue);
29
+ });
30
+
31
+ test("example 4", () => {
32
+ const defaultValue = "defaultValue";
33
+ const path = ["a", "b", "c"];
34
+ const xs = undefined;
35
+
36
+ expect(pathOr(defaultValue, path, xs)).toBe(defaultValue);
37
+ });
@@ -0,0 +1,30 @@
1
+ import { startsWith } from "../startsWith";
2
+
3
+ describe("startsWith", () => {
4
+ it("returns false when str is null", () => {
5
+ expect(startsWith("a", null)).toBe(false);
6
+ });
7
+
8
+ it("returns false when str is undefined", () => {
9
+ expect(startsWith("a", undefined)).toBe(false);
10
+ });
11
+
12
+ it("returns true when string starts with target", () => {
13
+ expect(startsWith("he", "hello")).toBe(true);
14
+ expect(startsWith("", "hello")).toBe(true); // empty target always matches
15
+ });
16
+
17
+ it("returns false when string does not start with target", () => {
18
+ expect(startsWith("yo", "hello")).toBe(false);
19
+ });
20
+
21
+ it("works with single character target", () => {
22
+ expect(startsWith("h", "hello")).toBe(true);
23
+ expect(startsWith("x", "hello")).toBe(false);
24
+ });
25
+
26
+ it("is case-sensitive", () => {
27
+ expect(startsWith("He", "hello")).toBe(false);
28
+ expect(startsWith("he", "hello")).toBe(true);
29
+ });
30
+ });
package/utils/find.ts ADDED
@@ -0,0 +1,3 @@
1
+ export const find = (predicate, xs) => {
2
+ return (xs || []).find((x, index) => predicate(x, index));
3
+ };
package/utils/index.ts CHANGED
@@ -2,6 +2,12 @@ export { chunk } from "./chunk";
2
2
 
3
3
  export { times } from "./times";
4
4
 
5
+ export { startsWith } from "./startsWith";
6
+
7
+ export { find } from "./find";
8
+
9
+ export { pathOr } from "./pathOr";
10
+
5
11
  export {
6
12
  cloneDeep as clone,
7
13
  flatten,
@@ -14,7 +20,9 @@ export {
14
20
  flatMap,
15
21
  difference,
16
22
  take,
23
+ pick,
17
24
  map,
18
25
  trim,
19
26
  toString,
27
+ last,
20
28
  } from "lodash";
@@ -0,0 +1,5 @@
1
+ import { get } from "lodash";
2
+
3
+ export const pathOr = (defaultValue, path, record) => {
4
+ return get(record, path, defaultValue);
5
+ };
@@ -0,0 +1,9 @@
1
+ import { isNil } from "lodash";
2
+
3
+ export const startsWith = (target, str) => {
4
+ if (isNil(str)) {
5
+ return false;
6
+ }
7
+
8
+ return str.startsWith(target);
9
+ };