@applicaster/zapp-react-native-utils 15.0.0-alpha.4200413542 → 15.0.0-alpha.4232833803

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 (62) hide show
  1. package/README.md +0 -6
  2. package/actionUtils/index.ts +7 -0
  3. package/actionsExecutor/ActionExecutorContext.tsx +83 -6
  4. package/appUtils/HooksManager/index.ts +35 -0
  5. package/appUtils/focusManager/treeDataStructure/Tree/__tests__/Tree.test.js +46 -0
  6. package/appUtils/focusManager/treeDataStructure/Tree/index.js +18 -18
  7. package/appUtils/focusManagerAux/utils/index.ts +12 -6
  8. package/appUtils/focusManagerAux/utils/utils.ios.ts +6 -3
  9. package/appUtils/localizationsHelper.ts +4 -0
  10. package/appUtils/playerManager/index.ts +9 -0
  11. package/appUtils/playerManager/player.ts +1 -1
  12. package/appUtils/playerManager/playerNative.ts +2 -1
  13. package/appUtils/playerManager/usePlayer.tsx +5 -3
  14. package/cellUtils/__tests__/cellUtils.test.ts +39 -0
  15. package/cellUtils/index.ts +11 -1
  16. package/componentsUtils/index.ts +8 -0
  17. package/dateUtils/__tests__/dayjs.test.ts +0 -3
  18. package/dateUtils/index.ts +2 -0
  19. package/manifestUtils/_internals/__tests__/index.test.js +41 -0
  20. package/manifestUtils/_internals/index.js +33 -0
  21. package/manifestUtils/defaultManifestConfigurations/player.js +6 -16
  22. package/manifestUtils/fieldUtils/__tests__/fieldUtils.test.js +49 -0
  23. package/manifestUtils/fieldUtils/index.js +54 -0
  24. package/manifestUtils/index.js +2 -0
  25. package/manifestUtils/keys.js +228 -0
  26. package/manifestUtils/mobileAction/button/__tests__/mobileActionButton.test.js +168 -0
  27. package/manifestUtils/mobileAction/button/index.js +140 -0
  28. package/manifestUtils/mobileAction/container/__tests__/mobileActionButtonsContainer.test.js +102 -0
  29. package/manifestUtils/mobileAction/container/index.js +73 -0
  30. package/manifestUtils/mobileAction/groups/__tests__/buildMobileActionButtonGroups.test.js +127 -0
  31. package/manifestUtils/mobileAction/groups/defaults.js +76 -0
  32. package/manifestUtils/mobileAction/groups/index.js +80 -0
  33. package/numberUtils/__tests__/toNumber.test.ts +27 -12
  34. package/numberUtils/__tests__/toPositiveNumber.test.ts +32 -4
  35. package/numberUtils/index.ts +5 -1
  36. package/package.json +3 -3
  37. package/reactHooks/casting/index.ts +1 -0
  38. package/reactHooks/casting/useIsCasting.tsx +57 -0
  39. package/reactHooks/cell-click/index.ts +2 -1
  40. package/reactHooks/feed/index.ts +0 -2
  41. package/reactHooks/feed/useInflatedUrl.ts +1 -1
  42. package/reactHooks/resolvers/useComponentResolver.ts +11 -1
  43. package/reactHooks/screen/__tests__/useCurrentScreenIsHook.test.ts +103 -0
  44. package/reactHooks/screen/__tests__/useCurrentScreenIsStartupHook.test.ts +94 -0
  45. package/reactHooks/screen/index.ts +4 -0
  46. package/reactHooks/screen/useCurrentScreenIsHook.ts +9 -0
  47. package/reactHooks/screen/useCurrentScreenIsStartupHook.ts +8 -0
  48. package/reactHooks/state/__tests__/useComponentScreenState.test.ts +246 -0
  49. package/reactHooks/state/index.ts +2 -0
  50. package/reactHooks/state/useComponentScreenState.ts +45 -0
  51. package/refreshUtils/RefreshCoordinator/__tests__/refreshCoordinator.test.ts +206 -0
  52. package/refreshUtils/RefreshCoordinator/index.ts +245 -0
  53. package/refreshUtils/RefreshCoordinator/utils/__tests__/getDataRefreshConfig.test.ts +104 -0
  54. package/refreshUtils/RefreshCoordinator/utils/index.ts +29 -0
  55. package/screenPickerUtils/index.ts +5 -0
  56. package/screenUtils/index.ts +3 -0
  57. package/utils/__tests__/clone.test.ts +158 -0
  58. package/utils/__tests__/path.test.ts +7 -0
  59. package/utils/clone.ts +7 -0
  60. package/utils/index.ts +2 -1
  61. package/reactHooks/feed/__tests__/useFeedRefresh.test.tsx +0 -75
  62. package/reactHooks/feed/useFeedRefresh.tsx +0 -65
@@ -156,10 +156,38 @@ describe("toPositiveNumber", () => {
156
156
  it("handles Symbol values", () => {
157
157
  expect(toPositiveNumber(Symbol("test"))).toBeUndefined();
158
158
  });
159
+ });
159
160
 
160
- it("converts BigInt values", () => {
161
- expect(toPositiveNumber(5n)).toBe(5);
162
- expect(toPositiveNumber(-5n)).toBeUndefined();
163
- });
161
+ describe("BigInt support", () => {
162
+ // Conditional test based on BigInt availability
163
+ const isBigIntSupported = typeof BigInt !== "undefined";
164
+
165
+ if (isBigIntSupported) {
166
+ it("converts positive BigInt values to numbers when BigInt is supported", () => {
167
+ expect(toPositiveNumber(BigInt(5))).toBe(5);
168
+ expect(toPositiveNumber(BigInt(100))).toBe(100);
169
+ expect(toPositiveNumber(BigInt(1000))).toBe(1000);
170
+ });
171
+
172
+ it("returns undefined for zero BigInt", () => {
173
+ expect(toPositiveNumber(BigInt(0))).toBeUndefined();
174
+ });
175
+
176
+ it("returns undefined for negative BigInt values", () => {
177
+ expect(toPositiveNumber(BigInt(-5))).toBeUndefined();
178
+ expect(toPositiveNumber(BigInt(-100))).toBeUndefined();
179
+ });
180
+
181
+ it("handles large positive BigInt values", () => {
182
+ const largeBigInt = BigInt(Number.MAX_SAFE_INTEGER);
183
+ const result = toPositiveNumber(largeBigInt);
184
+ expect(result).toBe(Number(largeBigInt));
185
+ });
186
+ } else {
187
+ it("skips BigInt tests when BigInt is not supported", () => {
188
+ // Placeholder test to indicate BigInt is not available
189
+ expect(typeof BigInt).toBe("undefined");
190
+ });
191
+ }
164
192
  });
165
193
  });
@@ -8,7 +8,11 @@ export const toNumber = (value: unknown): number | undefined => {
8
8
  return undefined;
9
9
  }
10
10
 
11
- if (R.is(Number, value) || R.is(BigInt, value) || R.is(String, value)) {
11
+ // Feature-detect BigInt support to avoid ReferenceError on older runtimes
12
+ const isBigIntSupported = typeof BigInt !== "undefined";
13
+ const isBigIntValue = isBigIntSupported && R.is(BigInt, value);
14
+
15
+ if (R.is(Number, value) || isBigIntValue || R.is(String, value)) {
12
16
  const numberOrNan = Number(value);
13
17
 
14
18
  return Number.isNaN(numberOrNan) ? undefined : numberOrNan;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@applicaster/zapp-react-native-utils",
3
- "version": "15.0.0-alpha.4200413542",
3
+ "version": "15.0.0-alpha.4232833803",
4
4
  "description": "Applicaster Zapp React Native utilities package",
5
5
  "main": "index.js",
6
6
  "types": "index.d.ts",
@@ -27,11 +27,11 @@
27
27
  },
28
28
  "homepage": "https://github.com/applicaster/quickbrick#readme",
29
29
  "dependencies": {
30
- "@applicaster/applicaster-types": "15.0.0-alpha.4200413542",
30
+ "@applicaster/applicaster-types": "15.0.0-alpha.4232833803",
31
31
  "buffer": "^5.2.1",
32
32
  "camelize": "^1.0.0",
33
33
  "dayjs": "^1.11.10",
34
- "handlebars": "4.7.8",
34
+ "handlebars": "4.7.9",
35
35
  "memoizee": "0.4.15",
36
36
  "prop-types": "^15.0.0"
37
37
  },
@@ -0,0 +1 @@
1
+ export { useIsCasting } from "./useIsCasting";
@@ -0,0 +1,57 @@
1
+ import React from "react";
2
+ import { useActions } from "@applicaster/zapp-react-native-utils/reactHooks/actions";
3
+ import { useAppState } from "@applicaster/zapp-react-native-utils/reactHooks/app";
4
+ import { isApplePlatform } from "@applicaster/zapp-react-native-utils/reactUtils";
5
+
6
+ const CHROMECAST_IDENTIFIER = "quick-brick-chromecast-action";
7
+
8
+ const fakeEntry: any = {
9
+ title: "Chromecast use is casting fake entry",
10
+ id: "quick-brick-use-is-casting-fake-entry",
11
+ };
12
+
13
+ /**
14
+ * Returns the cast action state connection status, does not update when app is in background on Apple platforms
15
+ * On other platforms, it continues to check the cast action state even when the app is in background
16
+ */
17
+ export const useIsCasting = () => {
18
+ const actionContext = useActions(CHROMECAST_IDENTIFIER);
19
+ const appState = useAppState();
20
+ const isAppInForeground = appState === "active";
21
+ const shouldOnlyUpdateInForeground = isApplePlatform();
22
+
23
+ const [castActionState, setCastActionState] = React.useState(
24
+ !actionContext ? null : actionContext.initialEntryState(fakeEntry)
25
+ );
26
+
27
+ React.useEffect(() => {
28
+ if (!shouldOnlyUpdateInForeground || isAppInForeground) {
29
+ if (actionContext && castActionState === null) {
30
+ setCastActionState(actionContext.initialEntryState(fakeEntry));
31
+ }
32
+ }
33
+ }, [
34
+ actionContext,
35
+ setCastActionState,
36
+ isAppInForeground,
37
+ shouldOnlyUpdateInForeground,
38
+ ]);
39
+
40
+ React.useEffect(() => {
41
+ if (typeof actionContext?.addListener === "function") {
42
+ return actionContext?.addListener(String(fakeEntry.id), (state) => {
43
+ // Only check foreground state on Apple platforms
44
+ if (!shouldOnlyUpdateInForeground || isAppInForeground) {
45
+ setCastActionState(state);
46
+ }
47
+ });
48
+ }
49
+ }, [
50
+ setCastActionState,
51
+ actionContext,
52
+ isAppInForeground,
53
+ shouldOnlyUpdateInForeground,
54
+ ]);
55
+
56
+ return !!castActionState?.connected;
57
+ };
@@ -54,7 +54,7 @@ export const useCellClick = ({
54
54
  component?.rules?.component_cells_selectable
55
55
  );
56
56
 
57
- const [__, setEntryContext] =
57
+ const [entryContext, setEntryContext] =
58
58
  ZappPipesEntryContext.useZappPipesContext(pathname);
59
59
 
60
60
  const logTimestamp = useProfilerLogging();
@@ -89,6 +89,7 @@ export const useCellClick = ({
89
89
  screenState,
90
90
  screenRoute: pathname,
91
91
  screenStateStore,
92
+ entryContext,
92
93
  });
93
94
  }
94
95
 
@@ -1,5 +1,3 @@
1
- export { useFeedRefresh, feedRefreshLogger } from "./useFeedRefresh";
2
-
3
1
  export { useFeedLoader } from "./useFeedLoader";
4
2
 
5
3
  export { getSearchContext, getInflatedDataSourceUrl } from "./useInflatedUrl";
@@ -45,7 +45,7 @@ interface GetInflatedDataSourceUrl {
45
45
  (properties: {
46
46
  source?: string;
47
47
  contexts: {
48
- entry?: ZappEntry;
48
+ entry?: ZappEntry & { parent?: ZappEntry };
49
49
  screen?: ZappRiver;
50
50
  search?: object | string;
51
51
  };
@@ -1,6 +1,8 @@
1
1
  /// <reference types="@applicaster/applicaster-types" />
2
2
  import * as React from "react";
3
3
 
4
+ import { coreLogger } from "@applicaster/zapp-react-native-utils/logger";
5
+
4
6
  import { findComponentByType } from "@applicaster/zapp-react-native-utils/pluginUtils";
5
7
  import {
6
8
  usePlugins,
@@ -23,7 +25,7 @@ export function useComponentResolver(
23
25
 
24
26
  const components = useAppSelector(selectComponents);
25
27
 
26
- return React.useMemo(
28
+ const component = React.useMemo(
27
29
  () =>
28
30
  findComponentByType({
29
31
  components,
@@ -33,4 +35,12 @@ export function useComponentResolver(
33
35
  }),
34
36
  watchers
35
37
  );
38
+
39
+ if (!component) {
40
+ coreLogger.warn({
41
+ message: `useComponentResolver: Component of type ${componentType} not found`,
42
+ });
43
+ }
44
+
45
+ return component;
36
46
  }
@@ -0,0 +1,103 @@
1
+ import { renderHook } from "@testing-library/react-native";
2
+ import { useCurrentScreenIsHook } from "../useCurrentScreenIsHook";
3
+
4
+ import { useNavigation } from "@applicaster/zapp-react-native-utils/reactHooks";
5
+ import { last } from "@applicaster/zapp-react-native-utils/utils";
6
+ import { toBooleanWithDefaultFalse } from "@applicaster/zapp-react-native-utils/booleanUtils";
7
+
8
+ jest.mock("@applicaster/zapp-react-native-utils/reactHooks");
9
+ jest.mock("@applicaster/zapp-react-native-utils/utils");
10
+ jest.mock("@applicaster/zapp-react-native-utils/booleanUtils");
11
+
12
+ const mockUseNavigation = useNavigation as jest.Mock;
13
+ const mockLast = last as jest.Mock;
14
+ const mockToBoolean = toBooleanWithDefaultFalse as jest.Mock;
15
+
16
+ describe("useCurrentScreenIsHook", () => {
17
+ beforeEach(() => {
18
+ jest.clearAllMocks();
19
+
20
+ // sensible defaults
21
+ mockUseNavigation.mockReturnValue({ mainStack: [] });
22
+ mockLast.mockReturnValue(undefined);
23
+ mockToBoolean.mockReturnValue(false);
24
+ });
25
+
26
+ it("returns true when last route includes 'hook'", () => {
27
+ const stack = [{ route: "some-hook-screen" }];
28
+
29
+ mockUseNavigation.mockReturnValue({ mainStack: stack });
30
+ mockLast.mockReturnValue(stack[0]);
31
+ mockToBoolean.mockReturnValue(true);
32
+
33
+ const { result } = renderHook(() => useCurrentScreenIsHook());
34
+
35
+ expect(mockLast).toHaveBeenCalledWith(stack);
36
+ expect(mockToBoolean).toHaveBeenCalledWith(true);
37
+ expect(result.current).toBe(true);
38
+ });
39
+
40
+ it("returns false when last route does not include 'hook'", () => {
41
+ const stack = [{ route: "home-screen" }];
42
+
43
+ mockUseNavigation.mockReturnValue({ mainStack: stack });
44
+ mockLast.mockReturnValue(stack[0]);
45
+ mockToBoolean.mockReturnValue(false);
46
+
47
+ const { result } = renderHook(() => useCurrentScreenIsHook());
48
+
49
+ expect(mockToBoolean).toHaveBeenCalledWith(false);
50
+ expect(result.current).toBe(false);
51
+ });
52
+
53
+ it("returns false when route is undefined", () => {
54
+ const stack = [{}];
55
+
56
+ mockUseNavigation.mockReturnValue({ mainStack: stack });
57
+ mockLast.mockReturnValue(stack[0]);
58
+ mockToBoolean.mockReturnValue(false);
59
+
60
+ const { result } = renderHook(() => useCurrentScreenIsHook());
61
+
62
+ expect(mockToBoolean).toHaveBeenCalledWith(undefined);
63
+ expect(result.current).toBe(false);
64
+ });
65
+
66
+ it("returns false when last(mainStack) is undefined (empty stack)", () => {
67
+ mockUseNavigation.mockReturnValue({ mainStack: [] });
68
+ mockLast.mockReturnValue(undefined);
69
+ mockToBoolean.mockReturnValue(false);
70
+
71
+ const { result } = renderHook(() => useCurrentScreenIsHook());
72
+
73
+ expect(mockLast).toHaveBeenCalledWith([]);
74
+ expect(mockToBoolean).toHaveBeenCalledWith(undefined);
75
+ expect(result.current).toBe(false);
76
+ });
77
+
78
+ it("uses default empty array when mainStack is undefined", () => {
79
+ mockUseNavigation.mockReturnValue({});
80
+ mockLast.mockReturnValue(undefined);
81
+ mockToBoolean.mockReturnValue(false);
82
+
83
+ const { result } = renderHook(() => useCurrentScreenIsHook());
84
+
85
+ expect(mockLast).toHaveBeenCalledWith([]);
86
+ expect(result.current).toBe(false);
87
+ });
88
+
89
+ it("passes correct boolean result from includes('hook')", () => {
90
+ const stack = [{ route: "hook" }];
91
+
92
+ mockUseNavigation.mockReturnValue({ mainStack: stack });
93
+ mockLast.mockReturnValue(stack[0]);
94
+
95
+ // simulate actual includes result flowing through
96
+ mockToBoolean.mockImplementation((val) => Boolean(val));
97
+
98
+ const { result } = renderHook(() => useCurrentScreenIsHook());
99
+
100
+ expect(mockToBoolean).toHaveBeenCalledWith(true);
101
+ expect(result.current).toBe(true);
102
+ });
103
+ });
@@ -0,0 +1,94 @@
1
+ import { renderHook } from "@testing-library/react-native";
2
+ import { useCurrentScreenIsStartupHook } from "../useCurrentScreenIsStartupHook";
3
+
4
+ import { useNavigation } from "@applicaster/zapp-react-native-utils/reactHooks";
5
+ import { isFilledArray } from "@applicaster/zapp-react-native-utils/arrayUtils";
6
+
7
+ jest.mock("@applicaster/zapp-react-native-utils/reactHooks");
8
+ jest.mock("@applicaster/zapp-react-native-utils/arrayUtils");
9
+
10
+ const mockUseNavigation = useNavigation as jest.Mock;
11
+ const mockIsFilledArray = isFilledArray as jest.Mock;
12
+
13
+ describe("useCurrentScreenIsStartupHook", () => {
14
+ beforeEach(() => {
15
+ jest.clearAllMocks();
16
+ });
17
+
18
+ it("returns true when startUpHooks is a filled array", () => {
19
+ mockUseNavigation.mockReturnValue({
20
+ startUpHooks: ["hook1"],
21
+ });
22
+
23
+ mockIsFilledArray.mockReturnValue(true);
24
+
25
+ const { result } = renderHook(() => useCurrentScreenIsStartupHook());
26
+
27
+ expect(result.current).toBe(true);
28
+ expect(mockIsFilledArray).toHaveBeenCalledWith(["hook1"]);
29
+ });
30
+
31
+ it('returns true when startUpHooks is "in_process"', () => {
32
+ mockUseNavigation.mockReturnValue({
33
+ startUpHooks: "in_process",
34
+ });
35
+
36
+ mockIsFilledArray.mockReturnValue(false);
37
+
38
+ const { result } = renderHook(() => useCurrentScreenIsStartupHook());
39
+
40
+ expect(result.current).toBe(true);
41
+ expect(mockIsFilledArray).toHaveBeenCalledWith("in_process");
42
+ });
43
+
44
+ it("returns false when startUpHooks is empty array", () => {
45
+ mockUseNavigation.mockReturnValue({
46
+ startUpHooks: [],
47
+ });
48
+
49
+ mockIsFilledArray.mockReturnValue(false);
50
+
51
+ const { result } = renderHook(() => useCurrentScreenIsStartupHook());
52
+
53
+ expect(result.current).toBe(false);
54
+ expect(mockIsFilledArray).toHaveBeenCalledWith([]);
55
+ });
56
+
57
+ it("returns false when startUpHooks is undefined", () => {
58
+ mockUseNavigation.mockReturnValue({
59
+ startUpHooks: undefined,
60
+ });
61
+
62
+ mockIsFilledArray.mockReturnValue(false);
63
+
64
+ const { result } = renderHook(() => useCurrentScreenIsStartupHook());
65
+
66
+ expect(result.current).toBe(false);
67
+ expect(mockIsFilledArray).toHaveBeenCalledWith(undefined);
68
+ });
69
+
70
+ it("returns false when startUpHooks is null", () => {
71
+ mockUseNavigation.mockReturnValue({
72
+ startUpHooks: null,
73
+ });
74
+
75
+ mockIsFilledArray.mockReturnValue(false);
76
+
77
+ const { result } = renderHook(() => useCurrentScreenIsStartupHook());
78
+
79
+ expect(result.current).toBe(false);
80
+ expect(mockIsFilledArray).toHaveBeenCalledWith(null);
81
+ });
82
+
83
+ it("prioritizes filled array over string comparison", () => {
84
+ mockUseNavigation.mockReturnValue({
85
+ startUpHooks: ["hook1"],
86
+ });
87
+
88
+ mockIsFilledArray.mockReturnValue(true);
89
+
90
+ const { result } = renderHook(() => useCurrentScreenIsStartupHook());
91
+
92
+ expect(result.current).toBe(true);
93
+ });
94
+ });
@@ -12,3 +12,7 @@ export {
12
12
  } from "./useScreenContext";
13
13
 
14
14
  export { useScreenBackgroundColor } from "./useScreenBackgroundColor";
15
+
16
+ export { useCurrentScreenIsHook } from "./useCurrentScreenIsHook";
17
+
18
+ export { useCurrentScreenIsStartupHook } from "./useCurrentScreenIsStartupHook";
@@ -0,0 +1,9 @@
1
+ import { useNavigation } from "@applicaster/zapp-react-native-utils/reactHooks";
2
+ import { last } from "@applicaster/zapp-react-native-utils/utils";
3
+ import { toBooleanWithDefaultFalse } from "@applicaster/zapp-react-native-utils/booleanUtils";
4
+
5
+ export const useCurrentScreenIsHook = (): boolean => {
6
+ const { mainStack = [] } = useNavigation();
7
+
8
+ return toBooleanWithDefaultFalse(last(mainStack)?.route?.includes("hook"));
9
+ };
@@ -0,0 +1,8 @@
1
+ import { useNavigation } from "@applicaster/zapp-react-native-utils/reactHooks";
2
+ import { isFilledArray } from "@applicaster/zapp-react-native-utils/arrayUtils";
3
+
4
+ export const useCurrentScreenIsStartupHook = (): boolean => {
5
+ const { startUpHooks } = useNavigation();
6
+
7
+ return isFilledArray(startUpHooks) || startUpHooks === "in_process";
8
+ };
@@ -0,0 +1,246 @@
1
+ import { renderHook, act } from "@testing-library/react-native";
2
+ import { useComponentScreenState } from "../useComponentScreenState";
3
+ import { useScreenContextV2 } from "@applicaster/zapp-react-native-utils/reactHooks/screen/useScreenContext";
4
+
5
+ import { create } from "zustand";
6
+
7
+ const createMockStore = () => create(() => ({}));
8
+
9
+ // Mock the external dependencies
10
+ jest.mock(
11
+ "@applicaster/zapp-react-native-utils/reactHooks/screen/useScreenContext",
12
+ () => ({
13
+ useScreenContextV2: jest.fn(),
14
+ })
15
+ );
16
+
17
+ const mockUseScreenContextV2 = useScreenContextV2 as jest.MockedFunction<
18
+ typeof useScreenContextV2
19
+ >;
20
+
21
+ describe("useComponentScreenState", () => {
22
+ beforeEach(() => {
23
+ jest.clearAllMocks();
24
+ });
25
+
26
+ it("should return initial value when no state exists for componentId", () => {
27
+ const mockStore = createMockStore();
28
+
29
+ mockUseScreenContextV2.mockReturnValue({
30
+ _componentStateStore: mockStore,
31
+ } as any);
32
+
33
+ const initialValue = "default-value";
34
+ const componentId = "test-component";
35
+
36
+ const { result } = renderHook(() =>
37
+ useComponentScreenState(componentId, initialValue)
38
+ );
39
+
40
+ expect(result.current[0]).toBe(initialValue);
41
+ });
42
+
43
+ it("should return stored value when state exists for componentId", () => {
44
+ const mockStore = createMockStore();
45
+ mockStore.setState({ "existing-component": "stored-value" });
46
+
47
+ mockUseScreenContextV2.mockReturnValue({
48
+ _componentStateStore: mockStore,
49
+ } as any);
50
+
51
+ const { result } = renderHook(() =>
52
+ useComponentScreenState("existing-component", "default")
53
+ );
54
+
55
+ expect(result.current[0]).toBe("stored-value");
56
+ });
57
+
58
+ it("should update state when setter is called", () => {
59
+ const mockStore = createMockStore();
60
+
61
+ mockUseScreenContextV2.mockReturnValue({
62
+ _componentStateStore: mockStore,
63
+ } as any);
64
+
65
+ const { result } = renderHook(() =>
66
+ useComponentScreenState("update-test", "initial")
67
+ );
68
+
69
+ // Verify initial value
70
+ expect(result.current[0]).toBe("initial");
71
+
72
+ // Update the value
73
+ act(() => {
74
+ result.current[1]("updated-value");
75
+ });
76
+
77
+ // Verify updated value
78
+ expect(result.current[0]).toBe("updated-value");
79
+ });
80
+
81
+ it("should handle different data types correctly", () => {
82
+ const mockStore = createMockStore();
83
+
84
+ mockUseScreenContextV2.mockReturnValue({
85
+ _componentStateStore: mockStore,
86
+ } as any);
87
+
88
+ // Test with number
89
+ const { result: numberResult } = renderHook(() =>
90
+ useComponentScreenState<number>("number-test", 42)
91
+ );
92
+
93
+ expect(numberResult.current[0]).toBe(42);
94
+
95
+ // Test with boolean
96
+ const { result: boolResult } = renderHook(() =>
97
+ useComponentScreenState<boolean>("bool-test", true)
98
+ );
99
+
100
+ expect(boolResult.current[0]).toBe(true);
101
+
102
+ // Test with object
103
+ const testObj = { key: "value" };
104
+
105
+ const { result: objResult } = renderHook(() =>
106
+ useComponentScreenState<{ key: string }>("obj-test", testObj)
107
+ );
108
+
109
+ expect(objResult.current[0]).toEqual(testObj);
110
+ });
111
+
112
+ it("should maintain separate states for different componentIds", () => {
113
+ const mockStore = createMockStore();
114
+
115
+ mockUseScreenContextV2.mockReturnValue({
116
+ _componentStateStore: mockStore,
117
+ } as any);
118
+
119
+ const { result: firstResult } = renderHook(() =>
120
+ useComponentScreenState("first", "first-initial")
121
+ );
122
+
123
+ const { result: secondResult } = renderHook(() =>
124
+ useComponentScreenState("second", "second-initial")
125
+ );
126
+
127
+ // Verify initial values are separate
128
+ expect(firstResult.current[0]).toBe("first-initial");
129
+ expect(secondResult.current[0]).toBe("second-initial");
130
+
131
+ // Update first component's state
132
+ act(() => {
133
+ firstResult.current[1]("first-updated");
134
+ });
135
+
136
+ // Verify only first component's state changed
137
+ expect(firstResult.current[0]).toBe("first-updated");
138
+ expect(secondResult.current[0]).toBe("second-initial");
139
+ });
140
+
141
+ it("should return a memoized setter function", () => {
142
+ const mockStore = createMockStore();
143
+
144
+ mockUseScreenContextV2.mockReturnValue({
145
+ _componentStateStore: mockStore,
146
+ } as any);
147
+
148
+ const { result, rerender } = renderHook(
149
+ ({ id, initial }) => useComponentScreenState(id, initial),
150
+ {
151
+ initialProps: { id: "memo-test", initial: "initial" },
152
+ }
153
+ );
154
+
155
+ const firstSetter = result.current[1];
156
+
157
+ // Rerender with same props
158
+ rerender({ id: "memo-test", initial: "initial" });
159
+
160
+ const secondSetter = result.current[1];
161
+
162
+ // Setter should be the same instance due to useCallback
163
+ expect(firstSetter).toBe(secondSetter);
164
+ });
165
+
166
+ it("should update setter when componentId changes", () => {
167
+ const mockStore = createMockStore();
168
+
169
+ mockUseScreenContextV2.mockReturnValue({
170
+ _componentStateStore: mockStore,
171
+ } as any);
172
+
173
+ const { result, rerender } = renderHook(
174
+ ({ id, initial }) => useComponentScreenState(id, initial),
175
+ {
176
+ initialProps: { id: "old-id", initial: "initial" },
177
+ }
178
+ );
179
+
180
+ const firstSetter = result.current[1];
181
+
182
+ // Rerender with different componentId
183
+ rerender({ id: "new-id", initial: "initial" });
184
+
185
+ const secondSetter = result.current[1];
186
+
187
+ // Setter should be different because componentId changed
188
+ expect(firstSetter).not.toBe(secondSetter);
189
+ });
190
+
191
+ it("should call store.setState with correct parameters", () => {
192
+ const mockStore = createMockStore();
193
+ const setStateSpy = jest.spyOn(mockStore, "setState");
194
+
195
+ mockUseScreenContextV2.mockReturnValue({
196
+ _componentStateStore: mockStore,
197
+ } as any);
198
+
199
+ const { result } = renderHook(() =>
200
+ useComponentScreenState("state-test", "initial")
201
+ );
202
+
203
+ const newValue = "new-value";
204
+
205
+ act(() => {
206
+ result.current[1](newValue);
207
+ });
208
+
209
+ expect(setStateSpy).toHaveBeenCalledWith({
210
+ "state-test": newValue,
211
+ });
212
+ });
213
+
214
+ it("should handle falsy initial values correctly", () => {
215
+ const mockStore = createMockStore();
216
+
217
+ mockUseScreenContextV2.mockReturnValue({
218
+ _componentStateStore: mockStore,
219
+ } as any);
220
+
221
+ // Test with falsy values
222
+ const { result: nullResult } = renderHook(() =>
223
+ useComponentScreenState("null-test", null)
224
+ );
225
+
226
+ expect(nullResult.current[0]).toBeNull();
227
+
228
+ const { result: falseResult } = renderHook(() =>
229
+ useComponentScreenState("false-test", false)
230
+ );
231
+
232
+ expect(falseResult.current[0]).toBe(false);
233
+
234
+ const { result: zeroResult } = renderHook(() =>
235
+ useComponentScreenState("zero-test", 0)
236
+ );
237
+
238
+ expect(zeroResult.current[0]).toBe(0);
239
+
240
+ const { result: emptyStrResult } = renderHook(() =>
241
+ useComponentScreenState("empty-test", "")
242
+ );
243
+
244
+ expect(emptyStrResult.current[0]).toBe("");
245
+ });
246
+ });
@@ -3,3 +3,5 @@ export { useRivers } from "./useRivers";
3
3
  export { useHomeRiver, getHomeRiver } from "./useHomeRiver";
4
4
 
5
5
  export { ZStoreProvider, useZStore } from "./ZStoreProvider";
6
+
7
+ export { useComponentScreenState } from "./useComponentScreenState";