@applicaster/zapp-react-native-utils 14.0.7-rc.2 → 14.0.9-alpha.2354002522

package/navigationUtils/index.ts

@@ -5,8 +5,7 @@ import { layoutV2TypeMatcher } from "./layoutV2TypeMatcher";
 import { HOOKS_EVENTS } from "../appUtils/HooksManager/constants";
 import { HooksManager } from "../appUtils/HooksManager";
 import { appStore } from "@applicaster/zapp-react-native-redux/AppStore";
-
-import { zappHookModalStore } from "@applicaster/zapp-react-native-ui-components/Contexts/ZappHookModalContext";
+import { HookModalContextT } from "@applicaster/zapp-react-native-ui-components/Contexts/ZappHookModalContext";
 import { logger } from "@applicaster/zapp-react-native-utils/logger";
 import {
   isGeneralPlugin,
@@ -16,8 +15,6 @@ import {
 } from "./itemTypeMatchers";
 import { RootState } from "@applicaster/zapp-react-native-redux/store";
 
-import { pick } from "@applicaster/zapp-react-native-utils/utils";
-
 type PathAttribute = {
   screenType: string;
   screenId: string;
@@ -406,22 +403,15 @@ export const mapContentTypesToRivers = (
 };
 
 export const runZappHooksForEntry = async (
-  entry: HookPluginProps["payload"]
-): Promise<{ success: boolean; payload: ZappEntry }> => {
-  const {
+  entry: HookPluginProps["payload"],
+  {
     setState,
     resetState,
     setIsHooksExecutionInProgress,
     setIsPresentingFullScreen,
     setIsRunningInBackground,
-  } = pick(zappHookModalStore.getState(), [
-    "setState",
-    "resetState",
-    "setIsHooksExecutionInProgress",
-    "setIsPresentingFullScreen",
-    "setIsRunningInBackground",
-  ]);
-
+  }: Partial<HookModalContextT>
+): Promise<{ success: boolean; payload: ZappEntry }> => {
   resetState?.();
 
   let success;

package/package.json

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

package/reactHooks/hookModal/hooks/useHookModalScreenData.ts

@@ -1,24 +1,20 @@
 import { reactHooksLogger } from "../../logger";
-import { useZappHookModalStore } from "@applicaster/zapp-react-native-ui-components/Contexts/ZappHookModalContext";
+import { useZappHooksModalState } from "@applicaster/zapp-react-dom-ui-components/Components/ZappHooksModal/hooks/useZappHooksModalState";
 
 const logger = reactHooksLogger.addSubsystem("useHookModalScreenData");
 
 type VariousScreenData = LegacyNavigationScreenData | ZappRiver | ZappEntry;
 
-export const useHookModalScreenData = (
-  skipSubscription: boolean
-): VariousScreenData | undefined => {
-  const hookModalState = useZappHookModalStore((state) =>
-    skipSubscription ? undefined : state.state
-  );
+export const useHookModalScreenData = (): VariousScreenData | undefined => {
+  const hookModalState = useZappHooksModalState();
 
-  if (!hookModalState?.screenData) {
+  if (!hookModalState.state?.screenData) {
     return;
   }
 
   try {
-    const screenData = hookModalState.screenData?.payload;
-    const hookPlugin = hookModalState.screenData.hookPlugin;
+    const screenData = hookModalState.state.screenData?.payload;
+    const hookPlugin = hookModalState.state.screenData.hookPlugin;
 
     if (hookPlugin?.screen_id) {
       return {
@@ -27,7 +23,7 @@ export const useHookModalScreenData = (
       };
     }
 
-    return hookModalState.screenData?.payload;
+    return hookModalState.state.screenData?.payload;
   } catch (error) {
     logger.error({
       message: "Hook modal screen data creation failed",
@@ -38,6 +34,6 @@ export const useHookModalScreenData = (
       jsOnly: true,
     });
 
-    return hookModalState.screenData?.payload;
+    return hookModalState.state.screenData?.payload;
   }
 };

package/reactHooks/navigation/__tests__/index.test.tsx

@@ -5,6 +5,7 @@ import { isNavBarVisible, useRoute } from "../";
 import { Provider } from "react-redux";
 import configureMockStore from "redux-mock-store";
 import { NavigationContext } from "@applicaster/zapp-react-native-ui-components/Contexts/NavigationContext";
+import { ZappHookModalContext } from "@applicaster/zapp-react-native-ui-components/Contexts";
 import { ROUTE_TYPES } from "@applicaster/zapp-react-native-utils/navigationUtils/routeTypes";
 import { ScreenDataContext } from "@applicaster/zapp-react-native-ui-components/Contexts/ScreenDataContext";
 
@@ -82,45 +83,9 @@ const hookModalContextState = {
   },
   setState: jest.fn(),
   resetState: jest.fn(),
-  hookPresentationMode: null,
 };
 
 const hooksModalPathname = `${ROUTE_TYPES.HOOKS_MODAL}/${hookModalContextState.state.screenData.payload.id}`;
-
-jest.mock(
-  "@applicaster/zapp-react-native-ui-components/Contexts/ZappHookModalContext",
-  () => {
-    // Define state inside mock factory to avoid hoisting issues
-    const mockState = {
-      isRunningInBackground: false,
-      setIsRunningInBackground: jest.fn(),
-      setIsPresentingFullScreen: jest.fn(),
-      isPresentationFullScreen: true,
-      isHooksExecutionInProgress: true,
-      setIsHooksExecutionInProgress: jest.fn(),
-      state: {
-        path: "/home",
-        screenData: { payload: { id: "hookExecutedInModal" } },
-      },
-      setState: jest.fn(),
-      resetState: jest.fn(),
-      hookPresentationMode: null,
-    };
-
-    const mockHook = jest.fn((selector) => {
-      return selector ? selector(mockState) : mockState;
-    }) as jest.MockedFunction<any> & { getState: () => typeof mockState };
-
-    // Add getState method to the mock hook (Zustand stores have this)
-    mockHook.getState = jest.fn(() => mockState);
-
-    return {
-      useZappHookModalStore: mockHook,
-      zappHookModalStore: mockHook,
-    };
-  }
-);
-
 const videoModalPathname = `${ROUTE_TYPES.VIDEO_MODAL}/${videoModalNavigator.videoModalState.item.id}`;
 const mockStore = configureMockStore();
 
@@ -160,11 +125,13 @@ const videoModalWrapper = ({ children }) => (
 
 const hookModalWrapper = ({ children }) => (
   <Provider store={store}>
-    <NavigationContext.Provider value={hookModalNavigator}>
-      <PathnameContext.Provider value={hooksModalPathname}>
-        {children}
-      </PathnameContext.Provider>
-    </NavigationContext.Provider>
+    <ZappHookModalContext.ReactContext.Provider value={hookModalContextState}>
+      <NavigationContext.Provider value={hookModalNavigator}>
+        <PathnameContext.Provider value={hooksModalPathname}>
+          {children}
+        </PathnameContext.Provider>
+      </NavigationContext.Provider>
+    </ZappHookModalContext.ReactContext.Provider>
   </Provider>
 );
 

package/reactHooks/navigation/index.ts

@@ -1,6 +1,5 @@
-import { useEffect, useMemo, useRef } from "react";
+import { useContext, useEffect, useMemo, useRef } from "react";
 import { BackHandler } from "react-native";
-import { shallow } from "zustand/shallow";
 
 import {
   useContentTypes,
@@ -9,13 +8,13 @@ import {
 import { HooksManager } from "@applicaster/zapp-react-native-utils/appUtils/HooksManager";
 
 import { LONG_KEY_PRESS_TIMEOUT } from "@applicaster/quick-brick-core/const";
-import { useZappHookModalStore } from "@applicaster/zapp-react-native-ui-components/Contexts/ZappHookModalContext";
+import { ZappHookModalContext } from "@applicaster/zapp-react-native-ui-components/Contexts";
+import { HookModalContextT } from "@applicaster/zapp-react-native-ui-components/Contexts/ZappHookModalContext";
 import { HOOKS_EVENTS } from "../../appUtils/HooksManager/constants";
 import { getRiverFromRoute, getTargetRoute } from "../../navigationUtils";
 import { useConnectionInfo } from "../connection";
 
 import { isTV, isWeb } from "@applicaster/zapp-react-native-utils/reactUtils";
-import { pick } from "@applicaster/zapp-react-native-utils/utils";
 import { useNavbarState } from "../screen";
 
 export { useNavigation } from "./useNavigation";
@@ -167,17 +166,7 @@ export const useZappHooksForEntry = (
     setIsHooksExecutionInProgress,
     setIsPresentingFullScreen,
     setIsRunningInBackground,
-  } = useZappHookModalStore(
-    (state) =>
-      pick(state, [
-        "setState",
-        "resetState",
-        "setIsHooksExecutionInProgress",
-        "setIsPresentingFullScreen",
-        "setIsRunningInBackground",
-      ]),
-    shallow
-  );
+  }: HookModalContextT = useContext(ZappHookModalContext.ReactContext);
 
   const {
     appData: { layoutVersion },

package/reactHooks/navigation/useRoute.ts

@@ -52,9 +52,7 @@ export const useRoute = (
 
   const modalScreenData = modalState.screen;
 
-  const hookModalScreenData = useHookModalScreenData(
-    !isHookModalPathname(pathname)
-  );
+  const hookModalScreenData = useHookModalScreenData();
 
   const videoModalScreenData =
     navigator?.videoModalState?.item &&