@applicaster/zapp-react-native-ui-components 16.0.0-alpha.1836140445 → 16.0.0-alpha.2628821467

package/Components/GeneralContentScreen/index.ts

@@ -1,3 +1 @@
 export { GeneralContentScreen } from "./GeneralContentScreen";
-
-export { GeneralContentScreenHookAdapter } from "./GeneralContentScreenHookAdapter";

package/Components/River/ComponentsMap/ComponentsMap.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import * as R from "ramda";
-import { FlatList, StyleSheet, View } from "react-native";
+import { FlatList, ScrollView, ScrollViewProps, View } from "react-native";
 import { useTheme } from "@applicaster/zapp-react-native-utils/theme";
 import { RiverItem } from "../RiverItem";
 import { RiverFooter } from "../RiverFooter";
@@ -36,18 +36,16 @@ type Props = {
   groupId?: string;
   isScreenWrappedInContainer?: boolean;
   riverComponents: ZappUIComponent[];
-  scrollViewExtraProps?: {};
+  scrollViewExtraProps?: Partial<ScrollViewProps>;
   riverId?: string;
-  getStaticComponentFeed: any;
+  getStaticComponentFeed: (args: {
+    component: ZappUIComponent;
+    index: number;
+  }) => ZappFeed | Promise<ZappFeed>;
   stickyHeaderIndices?: number[];
+  useScrollView?: boolean;
 };
 
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-  },
-});
-
 const getNearestValue = (value, optionA, optionB) =>
   Math.abs(value - optionA) < Math.abs(value - optionB) ? optionA : optionB;
 
@@ -64,11 +62,14 @@ function ComponentsMapComponent(props: Props) {
     riverId,
     getStaticComponentFeed,
     stickyHeaderIndices,
+    useScrollView,
   } = props;
 
   const flatListRef = React.useRef<FlatList | null>(null);
+  const scrollViewRef = React.useRef<ScrollView | null>(null);
   const flatListWrapperRef = React.useRef<View | null>(null);
   const hasUserScrolledRef = React.useRef(false);
+  const scrollEndReachedRef = React.useRef(false);
   const screenConfig = useScreenConfiguration(riverId);
   const screenData = useScreenData(riverId);
   const pullToRefreshEnabled = screenData?.rules?.pull_to_refresh_enabled;
@@ -87,7 +88,7 @@ function ComponentsMapComponent(props: Props) {
 
   const onLoadDone = React.useCallback(() => {
     logTimestamp(riverId?.toString());
-  }, [logTimestamp]);
+  }, [logTimestamp, riverId]);
 
   const { loadingState, onLoadFinished, onLoadFailed, shouldShowLoadingError } =
     useLoadingState(riverComponents.length, onLoadDone);
@@ -116,7 +117,17 @@ function ComponentsMapComponent(props: Props) {
         </ScreenLoadingMeasurementsListItemWrapper>
       );
     },
-    [feed, getStaticComponentFeed, onLoadFailed, onLoadFinished]
+    [
+      feed,
+      getStaticComponentFeed,
+      groupId,
+      isScreenWrappedInContainer,
+      loadingState,
+      onLoadFailed,
+      onLoadFinished,
+      riverComponents.length,
+      riverId,
+    ]
   );
 
   const screenStyle = React.useMemo(
@@ -138,7 +149,13 @@ function ComponentsMapComponent(props: Props) {
         R.prop("screen_padding_right")(theme)
       ),
     }),
-    [riverId]
+    [
+      screenConfig.paddingTop,
+      screenConfig.paddingBottom,
+      screenConfig.paddingLeft,
+      screenConfig.paddingRight,
+      theme,
+    ]
   );
 
   const handleOnLayout = React.useCallback(
@@ -173,55 +190,50 @@ function ComponentsMapComponent(props: Props) {
     canMomentum.current = true;
   }, []);
 
-  /* onMomentumScrollEnd: Handling snap to expanded/collapsed state ( for navbar ) */
-  const _onMomentumScrollEnd = React.useCallback(({ nativeEvent }) => {
-    if (!canMomentum.current) return;
-    canMomentum.current = false;
+  /* Snap the navbar to its expanded/collapsed state based on current offset. */
+  const snapToHeaderState = React.useCallback(
+    (rawOffsetY: number) => {
+      const { height: headerHeight, scrollState } = navBarStore.getState();
 
-    const { height: headerHeight, scrollState } = navBarStore.getState();
+      // Already fully expanded or fully collapsed — nothing to snap.
+      if (scrollState === 0 || scrollState === -headerHeight) return;
+      if (!flatListRef.current) return;
 
-    const offsetY = Math.max(0, nativeEvent.contentOffset.y);
+      const offsetY = Math.max(0, rawOffsetY);
 
-    if (
-      !(scrollState === 0 || scrollState === -headerHeight) &&
-      flatListRef.current
-    ) {
-      const offset =
+      const snapsToCollapsed =
         getNearestValue(Math.round(scrollState), -headerHeight, 0) ===
-        -headerHeight
-          ? Math.round(offsetY + scrollState + headerHeight)
-          : Math.round(offsetY + scrollState);
-
-      flatListRef.current.scrollToOffset({
-        animated: true,
-        offset,
-      });
-    }
-  }, []);
+        -headerHeight;
 
-  /* onScrollEnd: Handling snap to expanded/collapsed state ( for navbar ) */
-  const _onScrollEndDrag = React.useCallback(({ nativeEvent }) => {
-    const { height: headerHeight, scrollState } = navBarStore.getState();
+      const offset = snapsToCollapsed
+        ? Math.round(offsetY + scrollState + headerHeight)
+        : Math.round(offsetY + scrollState);
 
-    const offsetY = Math.max(0, nativeEvent.contentOffset.y);
+      flatListRef.current.scrollToOffset({ animated: true, offset });
+    },
+    [navBarStore]
+  );
 
-    if (
-      !(scrollState === 0 || scrollState === -headerHeight) &&
-      flatListRef.current &&
-      nativeEvent.velocity.y === 0
-    ) {
-      const offset =
-        getNearestValue(Math.round(scrollState), -headerHeight, 0) ===
-        -headerHeight
-          ? Math.round(offsetY + scrollState + headerHeight)
-          : Math.round(offsetY + scrollState);
-
-      flatListRef.current.scrollToOffset({
-        animated: true,
-        offset,
-      });
-    }
-  }, []);
+  /* onMomentumScrollEnd: Handling snap to expanded/collapsed state ( for navbar ) */
+  const _onMomentumScrollEnd = React.useCallback(
+    ({ nativeEvent }) => {
+      if (!canMomentum.current) return;
+      canMomentum.current = false;
+      snapToHeaderState(nativeEvent.contentOffset.y);
+    },
+    [snapToHeaderState]
+  );
+
+  /* onScrollEndDrag: Handling snap to expanded/collapsed state ( for navbar ) */
+  const _onScrollEndDrag = React.useCallback(
+    ({ nativeEvent }) => {
+      // Only snap on drag-end if there's no momentum to follow;
+      // otherwise _onMomentumScrollEnd handles it.
+      if (nativeEvent.velocity?.y !== 0) return;
+      snapToHeaderState(nativeEvent.contentOffset.y);
+    },
+    [snapToHeaderState]
+  );
 
   const onScroll = React.useCallback((event) => {
     hasUserScrolledRef.current = true;
@@ -245,8 +257,42 @@ function ComponentsMapComponent(props: Props) {
     }
   }, []);
 
+  const onScrollWithEndReached = React.useCallback(
+    (event) => {
+      onScroll(event);
+
+      if (!hasUserScrolledRef.current) return;
+      if (isScreenWrappedInContainer) return;
+
+      const {
+        nativeEvent: {
+          contentOffset: { y },
+          layoutMeasurement: { height },
+          contentSize: { height: contentHeight },
+        },
+      } = event;
+
+      const distanceFromEnd = contentHeight - y - height;
+
+      if (distanceFromEnd <= height * 0.5) {
+        if (!scrollEndReachedRef.current) {
+          scrollEndReachedRef.current = true;
+          emitScrollEndReached();
+        }
+      } else {
+        scrollEndReachedRef.current = false;
+      }
+    },
+    [onScroll, isScreenWrappedInContainer]
+  );
+
   const contentContainerStyle = React.useMemo(
-    () => (isScreenWrappedInContainer ? {} : screenStyle),
+    () =>
+      isScreenWrappedInContainer
+        ? {
+            flexGrow: 1,
+          }
+        : screenStyle,
     [isScreenWrappedInContainer, screenStyle]
   );
 
@@ -257,61 +303,98 @@ function ComponentsMapComponent(props: Props) {
   // TODO: support both "isScreenWrappedInContainer" and hasScreenPicker().
   // The Screen Picker in Mobile is completly different than the TV
   // so the various offsets / margins in TV do not apply here.
+  // Fix for WebView rerender crashes on Android API 28+
+  // https://github.com/react-native-webview/react-native-webview/issues/1915#issuecomment-964035468
+  const sharedScrollProps = {
+    overScrollMode: isAndroid ? ("never" as const) : ("auto" as const),
+    scrollIndicatorInsets,
+    onLayout: handleOnLayout,
+    contentContainerStyle,
+    refreshControl,
+    onScrollBeginDrag,
+    onMomentumScrollEnd: _onMomentumScrollEnd,
+    onScrollEndDrag: _onScrollEndDrag,
+    scrollEventThrottle: 16,
+    ...scrollViewExtraProps,
+  };
+
+  const listContent = useScrollView ? (
+    <ScrollView
+      testID="components-map-scroll-view"
+      // ViewportTracker clones this child and calls its `ref` as a function
+      // (childrenRef.current.ref(node)), so a callback ref is required here
+      // — an object ref would throw "ref is not a function".
+      ref={(ref) => {
+        scrollViewRef.current = ref;
+      }}
+      onScroll={onScrollWithEndReached}
+      {...sharedScrollProps}
+    >
+      {riverComponents.map((item, index) => (
+        <React.Fragment key={keyExtractor(item)}>
+          {renderRiverItem({ item, index })}
+        </React.Fragment>
+      ))}
+      <RiverFooter
+        flatListHeight={flatListHeight}
+        loadingState={loadingState}
+      />
+    </ScrollView>
+  ) : (
+    <FlatList
+      testID="components-map-flat-list"
+      // ViewportTracker clones this child and calls its `ref` as a function
+      // (childrenRef.current.ref(node)), so a callback ref is required here
+      // — an object ref would throw "ref is not a function".
+      ref={(ref) => {
+        flatListRef.current = ref;
+      }}
+      extraData={feed}
+      stickyHeaderIndices={stickyHeaderIndices}
+      removeClippedSubviews={isAndroid}
+      initialNumToRender={3}
+      maxToRenderPerBatch={10}
+      windowSize={12}
+      keyExtractor={keyExtractor}
+      renderItem={renderRiverItem}
+      data={riverComponents}
+      ListFooterComponent={
+        <RiverFooter
+          flatListHeight={flatListHeight}
+          loadingState={loadingState}
+        />
+      }
+      onScroll={onScroll}
+      onEndReached={
+        /* TODO: end-reached detection is inconsistent between the two paths:
+        the ScrollView branch uses manual pixel-offset math (onScrollWithEndReached)
+        with a scrollEndReachedRef debounce, while this FlatList relies on the
+        native onEndReached. Consider unifying the threshold/debounce behavior. */
+        /* When wrapped in a parent ScrollView (e.g. tabs),
+        this FlatList doesn't scroll so onEndReached can fire repeatedly;
+        skip it here and let the parent ScrollView emit scroll-end instead. */
+        isScreenWrappedInContainer
+          ? undefined
+          : () => {
+              if (!hasUserScrolledRef.current) return;
+              emitScrollEndReached();
+            }
+      }
+      {...sharedScrollProps}
+    />
+  );
+
   return (
-    <View style={styles.container} ref={flatListWrapperRef}>
+    // Wrapper View exists only to expose a ref (via ComponentsMapRefContext)
+    // for measuring the list's position/height; it intentionally has no style.
+    <View ref={flatListWrapperRef}>
       <ComponentsMapHeightContext.Provider value={flatListHeight}>
         <ComponentsMapRefContext.Provider value={flatListWrapperRef}>
           <ScreenLoadingMeasurements
             riverId={riverId}
             numberOfComponents={riverComponents.length}
           >
-            <ViewportTracker>
-              <FlatList
-                testID="components-map-flat-list"
-                ref={(ref) => {
-                  flatListRef.current = ref;
-                }}
-                // Fix for WebView rerender crashes on Android API 28+
-                // https://github.com/react-native-webview/react-native-webview/issues/1915#issuecomment-964035468
-                overScrollMode={isAndroid ? "never" : "auto"}
-                scrollIndicatorInsets={scrollIndicatorInsets}
-                extraData={feed}
-                stickyHeaderIndices={stickyHeaderIndices}
-                removeClippedSubviews={isAndroid}
-                onLayout={handleOnLayout}
-                initialNumToRender={3}
-                maxToRenderPerBatch={10}
-                windowSize={12}
-                keyExtractor={keyExtractor}
-                renderItem={renderRiverItem}
-                data={riverComponents}
-                contentContainerStyle={contentContainerStyle}
-                ListFooterComponent={
-                  <RiverFooter
-                    flatListHeight={flatListHeight}
-                    loadingState={loadingState}
-                  />
-                }
-                refreshControl={refreshControl}
-                onScrollBeginDrag={onScrollBeginDrag}
-                onScroll={onScroll}
-                onMomentumScrollEnd={_onMomentumScrollEnd}
-                onScrollEndDrag={_onScrollEndDrag}
-                scrollEventThrottle={16}
-                {...scrollViewExtraProps}
-                onEndReached={
-                  /* When wrapped in a parent ScrollView (e.g. tabs),
-                  this FlatList doesn't scroll so onEndReached can fire repeatedly;
-                  skip it here and let the parent ScrollView emit scroll-end instead. */
-                  isScreenWrappedInContainer
-                    ? undefined
-                    : () => {
-                        if (!hasUserScrolledRef.current) return;
-                        emitScrollEndReached();
-                      }
-                }
-              />
-            </ViewportTracker>
+            <ViewportTracker>{listContent}</ViewportTracker>
           </ScreenLoadingMeasurements>
         </ComponentsMapRefContext.Provider>
       </ComponentsMapHeightContext.Provider>

package/Components/River/__tests__/__snapshots__/componentsMap.test.js.snap

@@ -1,20 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`componentsMap renders renders components map correctly 1`] = `
-<View
-  style={
-    {
-      "flex": 1,
-    }
-  }
->
+<View>
   <View
     onLayout={[Function]}
-    style={
-      {
-        "flex": 1,
-      }
-    }
   >
     <RCTScrollView
       ListFooterComponent={
@@ -167,11 +156,6 @@ exports[`componentsMap renders renders components map correctly 1`] = `
         >
           <View
             onLayout={[Function]}
-            style={
-              {
-                "flex": 1,
-              }
-            }
           >
             <View />
           </View>
@@ -183,11 +167,6 @@ exports[`componentsMap renders renders components map correctly 1`] = `
         >
           <View
             onLayout={[Function]}
-            style={
-              {
-                "flex": 1,
-              }
-            }
           />
         </View>
         <View

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-ui-components",
-  "version": "16.0.0-alpha.1836140445",
+  "version": "16.0.0-alpha.2628821467",
   "description": "Applicaster Zapp React Native ui components for the Quick Brick App",
   "main": "index.js",
   "types": "index.d.ts",
@@ -28,10 +28,10 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "16.0.0-alpha.1836140445",
-    "@applicaster/zapp-react-native-bridge": "16.0.0-alpha.1836140445",
-    "@applicaster/zapp-react-native-redux": "16.0.0-alpha.1836140445",
-    "@applicaster/zapp-react-native-utils": "16.0.0-alpha.1836140445",
+    "@applicaster/applicaster-types": "16.0.0-alpha.2628821467",
+    "@applicaster/zapp-react-native-bridge": "16.0.0-alpha.2628821467",
+    "@applicaster/zapp-react-native-redux": "16.0.0-alpha.2628821467",
+    "@applicaster/zapp-react-native-utils": "16.0.0-alpha.2628821467",
     "fast-json-stable-stringify": "^2.1.0",
     "promise": "^8.3.0",
     "url": "^0.11.0",

package/Components/GeneralContentScreen/GeneralContentScreenHookAdapter.tsx

@@ -1,39 +0,0 @@
-import React from "react";
-import { GeneralContentScreen } from "./GeneralContentScreen";
-import { HookContentFocusGroup } from "./hookFocus";
-import { runInBackground } from "./hookAdapter/runInBackground";
-import { log_error } from "./hookAdapter/logger";
-
-type HookComponentProps = HookPluginProps & {
-  configuration?: unknown;
-};
-
-function GeneralContentScreenHookComponent(props: HookComponentProps) {
-  const { hookPlugin, focused, parentFocus } = props;
-
-  if (!hookPlugin?.screen_id) {
-    log_error(
-      "GeneralContentScreenHookAdapter: This component should only be used as a hook, but no hookPlugin was provided."
-    );
-
-    return null;
-  }
-
-  return (
-    <HookContentFocusGroup>
-      <GeneralContentScreen
-        screenId={hookPlugin.screen_id}
-        isScreenWrappedInContainer={false}
-        focused={focused}
-        parentFocus={parentFocus}
-      />
-    </HookContentFocusGroup>
-  );
-}
-
-export const GeneralContentScreenHookAdapter = {
-  isFlowBlocker: () => true,
-  presentFullScreen: true,
-  Component: GeneralContentScreenHookComponent,
-  runInBackground,
-};

package/Components/GeneralContentScreen/__tests__/GeneralContentScreenHookAdapter.test.tsx

@@ -1,64 +0,0 @@
-import React from "react";
-import { render } from "@testing-library/react-native";
-import { GeneralContentScreenHookAdapter } from "../GeneralContentScreenHookAdapter";
-import { log_error } from "../hookAdapter/logger";
-
-const mockScreenSpy = jest.fn();
-
-jest.mock("../GeneralContentScreen", () => ({
-  GeneralContentScreen: (props) => {
-    const React = require("react");
-    const { View } = require("react-native");
-
-    mockScreenSpy(props);
-
-    return <View testID="general-content-screen" />;
-  },
-}));
-
-jest.mock("../hookAdapter/runInBackground", () => ({
-  runInBackground: jest.fn(),
-}));
-
-jest.mock("../hookAdapter/logger", () => ({
-  log_debug: jest.fn(),
-  log_error: jest.fn(),
-  log_info: jest.fn(),
-}));
-
-const { Component } = GeneralContentScreenHookAdapter;
-
-describe("GeneralContentScreenHookAdapter", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  it("renders GeneralContentScreen with the hook plugin screen id", () => {
-    const { getByTestId } = render(
-      <Component hookPlugin={{ screen_id: "screen-1" }} focused />
-    );
-
-    expect(getByTestId("general-content-screen")).toBeDefined();
-
-    expect(mockScreenSpy).toHaveBeenCalledWith(
-      expect.objectContaining({
-        screenId: "screen-1",
-        isScreenWrappedInContainer: false,
-      })
-    );
-  });
-
-  it("renders nothing and logs an error when hookPlugin is missing", () => {
-    const { toJSON } = render(<Component />);
-
-    expect(toJSON()).toBeNull();
-    expect(mockScreenSpy).not.toHaveBeenCalled();
-    expect(log_error).toHaveBeenCalled();
-  });
-
-  it("renders nothing when hookPlugin has no screen_id", () => {
-    const { toJSON } = render(<Component hookPlugin={{}} />);
-
-    expect(toJSON()).toBeNull();
-  });
-});

package/Components/GeneralContentScreen/__tests__/HookContentFocusGroup.web.test.tsx

@@ -1,91 +0,0 @@
-import React from "react";
-import { render } from "@testing-library/react-native";
-import { View } from "react-native";
-
-import { HookContentFocusGroup } from "../hookFocus/index.web";
-
-const mockFocusableGroupSpy = jest.fn();
-const mockUseInitialFocusSpy = jest.fn();
-
-const mockModalState = { isRunningInBackground: false };
-
-jest.mock("../../FocusableGroup", () => ({
-  FocusableGroup: (props) => {
-    const React = require("react");
-    const { View } = require("react-native");
-
-    mockFocusableGroupSpy(props);
-
-    return <View testID="focusable-group">{props.children}</View>;
-  },
-}));
-
-jest.mock("@applicaster/zapp-react-native-utils/reactHooks/navigation", () => ({
-  useContentId: () => "quick-brick-content___route",
-  useNavbarId: () => "quick-brick-navbar___route",
-  usePathname: () => "hooks-modal/profile-select",
-}));
-
-jest.mock("../../Screen/TV/hooks", () => ({
-  useInitialFocus: () => mockUseInitialFocusSpy(),
-}));
-
-jest.mock("../../../Contexts/ZappHookModalContext", () => ({
-  useZappHookModalStore: (selector) => selector(mockModalState),
-}));
-
-describe("HookContentFocusGroup (web)", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-    mockModalState.isRunningInBackground = false;
-  });
-
-  it("wraps content in a preferred-focus content group and triggers initial focus when presented full screen", () => {
-    const { getByTestId } = render(
-      <HookContentFocusGroup>
-        <View testID="child" />
-      </HookContentFocusGroup>
-    );
-
-    expect(getByTestId("focusable-group")).toBeDefined();
-    expect(getByTestId("child")).toBeDefined();
-    expect(mockUseInitialFocusSpy).toHaveBeenCalledTimes(1);
-
-    expect(mockFocusableGroupSpy).toHaveBeenCalledWith(
-      expect.objectContaining({
-        id: "quick-brick-content___route",
-        groupId: "hooks-modal/profile-select",
-        nextFocusUp: "quick-brick-navbar___route",
-        preferredFocus: true,
-        shouldUsePreferredFocus: true,
-      })
-    );
-  });
-
-  it("injects the content group id into the wrapped child so its cells register under it", () => {
-    render(
-      <HookContentFocusGroup>
-        <View testID="child" />
-      </HookContentFocusGroup>
-    );
-
-    const child = mockFocusableGroupSpy.mock.calls[0][0].children;
-
-    expect(child.props.groupId).toBe("quick-brick-content___route");
-  });
-
-  it("renders the child without focus handling when running in background (not full screen)", () => {
-    mockModalState.isRunningInBackground = true;
-
-    const { getByTestId, queryByTestId } = render(
-      <HookContentFocusGroup>
-        <View testID="child" />
-      </HookContentFocusGroup>
-    );
-
-    expect(getByTestId("child")).toBeDefined();
-    expect(queryByTestId("focusable-group")).toBeNull();
-    expect(mockUseInitialFocusSpy).not.toHaveBeenCalled();
-    expect(mockFocusableGroupSpy).not.toHaveBeenCalled();
-  });
-});

package/Components/GeneralContentScreen/hookAdapter/__tests__/networkService.test.ts

@@ -1,74 +0,0 @@
-import { requestToSkipHook } from "../networkService";
-
-const mockCall = jest.fn();
-const mockBuildAxiosRequest = jest.fn();
-let mockHelper: Record<string, any>;
-
-jest.mock("@applicaster/zapp-pipes-v2-client", () => ({
-  RequestBuilder: jest.fn().mockImplementation(() => ({
-    setEntryContext: jest.fn().mockReturnThis(),
-    setScreenContext: jest.fn().mockReturnThis(),
-    setUrl: jest.fn().mockReturnThis(),
-    buildAxiosRequest: (...args) => mockBuildAxiosRequest(...args),
-    call: (...args) => mockCall(...args),
-  })),
-  PipesClientResponseHelper: jest.fn().mockImplementation(() => mockHelper),
-}));
-
-jest.mock("../logger", () => ({
-  log_debug: jest.fn(),
-  log_error: jest.fn(),
-  log_info: jest.fn(),
-}));
-
-const dataSource = { source: "https://skip-endpoint", mapping: {} };
-const payload = { id: "entry-1" };
-
-describe("requestToSkipHook", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-    mockBuildAxiosRequest.mockResolvedValue({ url: "https://skip-endpoint" });
-    mockCall.mockResolvedValue({});
-
-    mockHelper = {
-      error: null,
-      statusCode: 200,
-      responseData: null,
-      getLogsData: jest.fn(() => ({})),
-    };
-  });
-
-  it("returns true when the endpoint returns a non-empty body", async () => {
-    mockHelper.responseData = true;
-
-    await expect(requestToSkipHook(dataSource, payload)).resolves.toBe(true);
-  });
-
-  it("treats any truthy payload as skip (hook-screen-wrapper contract)", async () => {
-    mockHelper.responseData = { entry: [] };
-
-    await expect(requestToSkipHook(dataSource, payload)).resolves.toBe(true);
-  });
-
-  it("returns false when the endpoint returns an empty body", async () => {
-    mockHelper.responseData = null;
-
-    await expect(requestToSkipHook(dataSource, payload)).resolves.toBe(false);
-  });
-
-  it("throws when the response contains an error", async () => {
-    mockHelper.error = new Error("server error");
-
-    await expect(requestToSkipHook(dataSource, payload)).rejects.toThrow(
-      "server error"
-    );
-  });
-
-  it("throws when the request itself fails", async () => {
-    mockCall.mockRejectedValue(new Error("network down"));
-
-    await expect(requestToSkipHook(dataSource, payload)).rejects.toThrow(
-      "network down"
-    );
-  });
-});

package/Components/GeneralContentScreen/hookAdapter/__tests__/runInBackground.test.ts

@@ -1,139 +0,0 @@
-import { runInBackground } from "../runInBackground";
-import { shouldSkipHook } from "../validationHelper";
-import { requestToSkipHook } from "../networkService";
-
-jest.mock("../validationHelper", () => ({
-  shouldSkipHook: jest.fn(),
-}));
-
-jest.mock("../networkService", () => ({
-  requestToSkipHook: jest.fn(),
-}));
-
-jest.mock("../logger", () => ({
-  log_debug: jest.fn(),
-  log_error: jest.fn(),
-  log_info: jest.fn(),
-}));
-
-const mockShouldSkipHook = shouldSkipHook as jest.Mock;
-const mockRequestToSkipHook = requestToSkipHook as jest.Mock;
-
-const item = { id: "entry-1" };
-const endpoint = { source: "https://skip-endpoint", mapping: {} };
-
-describe("runInBackground", () => {
-  let callback: jest.Mock;
-  let presentUI: jest.Mock;
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-    callback = jest.fn();
-    presentUI = jest.fn();
-    mockShouldSkipHook.mockResolvedValue(false);
-    mockRequestToSkipHook.mockResolvedValue(false);
-  });
-
-  it("presents the UI when no skip rules are configured", async () => {
-    await runInBackground(item, callback, {}, presentUI);
-
-    expect(presentUI).toHaveBeenCalled();
-    expect(callback).not.toHaveBeenCalled();
-    expect(mockShouldSkipHook).not.toHaveBeenCalled();
-    expect(mockRequestToSkipHook).not.toHaveBeenCalled();
-  });
-
-  it("finishes the hook when a storage key is found, without calling the endpoint", async () => {
-    mockShouldSkipHook.mockResolvedValue(true);
-
-    const configuration = {
-      rules: {
-        skip_hook_storage_key: "ns.key",
-        skip_hook_endpoint: endpoint,
-      },
-    };
-
-    await runInBackground(item, callback, configuration, presentUI);
-
-    expect(mockShouldSkipHook).toHaveBeenCalledWith("ns.key");
-
-    expect(callback).toHaveBeenCalledWith({
-      success: true,
-      error: null,
-      payload: item,
-    });
-
-    expect(mockRequestToSkipHook).not.toHaveBeenCalled();
-    expect(presentUI).not.toHaveBeenCalled();
-  });
-
-  it("falls through to the endpoint check when storage keys are not found", async () => {
-    const configuration = {
-      rules: {
-        skip_hook_storage_key: "ns.key",
-        skip_hook_endpoint: endpoint,
-      },
-    };
-
-    await runInBackground(item, callback, configuration, presentUI);
-
-    expect(mockRequestToSkipHook).toHaveBeenCalledWith(endpoint, item);
-    expect(presentUI).toHaveBeenCalled();
-    expect(callback).not.toHaveBeenCalled();
-  });
-
-  it("finishes the hook when the endpoint allows skipping", async () => {
-    mockRequestToSkipHook.mockResolvedValue(true);
-
-    const configuration = {
-      rules: { skip_hook_endpoint: endpoint },
-    };
-
-    await runInBackground(item, callback, configuration, presentUI);
-
-    expect(callback).toHaveBeenCalledWith({
-      success: true,
-      error: null,
-      payload: item,
-    });
-
-    expect(presentUI).not.toHaveBeenCalled();
-  });
-
-  it("ignores an endpoint configuration without a source", async () => {
-    const configuration = {
-      rules: { skip_hook_endpoint: { mapping: {} } },
-    };
-
-    await runInBackground(item, callback, configuration, presentUI);
-
-    expect(mockRequestToSkipHook).not.toHaveBeenCalled();
-    expect(presentUI).toHaveBeenCalled();
-  });
-
-  it("presents the UI when the endpoint check throws", async () => {
-    mockRequestToSkipHook.mockRejectedValue(new Error("network down"));
-
-    const configuration = {
-      rules: { skip_hook_endpoint: endpoint },
-    };
-
-    await runInBackground(item, callback, configuration, presentUI);
-
-    expect(presentUI).toHaveBeenCalled();
-    expect(callback).not.toHaveBeenCalled();
-  });
-
-  it("presents the UI when the storage check throws", async () => {
-    mockShouldSkipHook.mockRejectedValue(new Error("storage error"));
-
-    const configuration = {
-      rules: { skip_hook_storage_key: "ns.key" },
-    };
-
-    await runInBackground(item, callback, configuration, presentUI);
-
-    expect(presentUI).toHaveBeenCalled();
-    expect(callback).not.toHaveBeenCalled();
-  });
-});

package/Components/GeneralContentScreen/hookAdapter/__tests__/validationHelper.test.ts

@@ -1,124 +0,0 @@
-import {
-  parseKeyEntries,
-  getKeyToSkipHook,
-  shouldSkipHook,
-} from "../validationHelper";
-
-const mockSessionGetItem = jest.fn();
-const mockLocalGetItem = jest.fn();
-
-jest.mock(
-  "@applicaster/zapp-react-native-bridge/ZappStorage/SessionStorage",
-  () => ({
-    sessionStorage: { getItem: (...args) => mockSessionGetItem(...args) },
-  })
-);
-
-jest.mock(
-  "@applicaster/zapp-react-native-bridge/ZappStorage/LocalStorage",
-  () => ({
-    localStorage: { getItem: (...args) => mockLocalGetItem(...args) },
-  })
-);
-
-jest.mock("../logger", () => ({
-  log_debug: jest.fn(),
-  log_error: jest.fn(),
-  log_info: jest.fn(),
-}));
-
-describe("parseKeyEntries", () => {
-  it("parses a namespaced key as namespace.key", () => {
-    expect(parseKeyEntries("myNamespace.myKey")).toEqual([
-      { namespace: "myNamespace", key: "myKey" },
-    ]);
-  });
-
-  it("treats everything before the last dot as the namespace", () => {
-    expect(parseKeyEntries("com.applicaster.feature.someKey")).toEqual([
-      { namespace: "com.applicaster.feature", key: "someKey" },
-    ]);
-  });
-
-  it("falls back to the default namespace when there is no dot", () => {
-    expect(parseKeyEntries("plainKey")).toEqual([
-      { namespace: "applicaster.v2", key: "plainKey" },
-    ]);
-  });
-
-  it("splits comma-separated entries, trimming whitespace and empty items", () => {
-    expect(parseKeyEntries(" ns1.key1 , , ns2.key2 ,")).toEqual([
-      { namespace: "ns1", key: "key1" },
-      { namespace: "ns2", key: "key2" },
-    ]);
-  });
-});
-
-describe("getKeyToSkipHook", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  it("returns the session storage value when present, without hitting local storage", async () => {
-    mockSessionGetItem.mockResolvedValue("session-value");
-
-    const value = await getKeyToSkipHook("myKey", "myNamespace");
-
-    expect(value).toBe("session-value");
-    expect(mockSessionGetItem).toHaveBeenCalledWith("myKey", "myNamespace");
-    expect(mockLocalGetItem).not.toHaveBeenCalled();
-  });
-
-  it("falls back to local storage when session storage is empty", async () => {
-    mockSessionGetItem.mockResolvedValue(null);
-    mockLocalGetItem.mockResolvedValue("local-value");
-
-    const value = await getKeyToSkipHook("myKey", "myNamespace");
-
-    expect(value).toBe("local-value");
-    expect(mockLocalGetItem).toHaveBeenCalledWith("myKey", "myNamespace");
-  });
-});
-
-describe("shouldSkipHook", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-    mockSessionGetItem.mockResolvedValue(null);
-    mockLocalGetItem.mockResolvedValue(null);
-  });
-
-  it("returns false when no condition is provided", async () => {
-    await expect(shouldSkipHook(undefined)).resolves.toBe(false);
-    await expect(shouldSkipHook("")).resolves.toBe(false);
-    await expect(shouldSkipHook("   ")).resolves.toBe(false);
-  });
-
-  it("returns true when a key is found in storage, querying with parsed namespace and key", async () => {
-    mockSessionGetItem.mockResolvedValue("value");
-
-    await expect(shouldSkipHook("myNamespace.myKey")).resolves.toBe(true);
-    expect(mockSessionGetItem).toHaveBeenCalledWith("myKey", "myNamespace");
-  });
-
-  it("returns true when any of the comma-separated keys is found", async () => {
-    mockLocalGetItem.mockImplementation((key) =>
-      Promise.resolve(key === "key2" ? "value" : null)
-    );
-
-    await expect(shouldSkipHook("ns1.key1, ns2.key2")).resolves.toBe(true);
-  });
-
-  it("returns false when none of the keys are found", async () => {
-    await expect(shouldSkipHook("ns1.key1, ns2.key2")).resolves.toBe(false);
-    expect(mockSessionGetItem).toHaveBeenCalledTimes(2);
-    expect(mockLocalGetItem).toHaveBeenCalledTimes(2);
-  });
-
-  it("continues to the next key when a storage read throws", async () => {
-    mockSessionGetItem
-      .mockRejectedValueOnce(new Error("storage error"))
-      .mockResolvedValueOnce("value");
-
-    await expect(shouldSkipHook("ns1.key1, ns2.key2")).resolves.toBe(true);
-  });
-});

package/Components/GeneralContentScreen/hookAdapter/logger.ts

@@ -1,6 +0,0 @@
-import { createLogger } from "@applicaster/zapp-react-native-utils/logger";
-
-export const { log_debug, log_error, log_info } = createLogger({
-  category: "runInBackground",
-  subsystem: "GeneralContentScreenHookAdapter",
-});

package/Components/GeneralContentScreen/hookAdapter/networkService.ts

@@ -1,53 +0,0 @@
-import {
-  PipesClientResponseHelper,
-  RequestBuilder,
-} from "@applicaster/zapp-pipes-v2-client";
-import { log_debug, log_error } from "./logger";
-
-export const requestToSkipHook = async (
-  dataSource: ZappDataSource,
-  payload: ZappEntry
-): Promise<boolean> => {
-  try {
-    const requestBuilder = new RequestBuilder()
-      .setEntryContext(payload)
-      // @ts-ignore: empty screen context is acceptable for this request
-      .setScreenContext({})
-      .setUrl(dataSource.source, dataSource.mapping);
-
-    const request = await requestBuilder.buildAxiosRequest();
-
-    log_debug(
-      `requestToSkipHook: Request built for source: ${
-        request?.url || dataSource.source
-      }`,
-      { ...request, source: dataSource.source }
-    );
-
-    const responseObject = await requestBuilder.call<boolean>();
-    const responseHelper = new PipesClientResponseHelper(responseObject);
-
-    const error = responseHelper.error;
-    const logData = responseHelper.getLogsData();
-
-    if (error) {
-      log_error(`requestToSkipHook: Error: ${error.message}`, {
-        response: logData,
-      });
-
-      throw error;
-    }
-
-    log_debug(
-      `requestToSkipHook: Request received successfully. Status: ${responseHelper.statusCode}`,
-      { response: logData }
-    );
-
-    // Non-empty body = skip the hook (same contract as hook-screen-wrapper)
-    return Boolean(responseHelper.responseData);
-  } catch (error) {
-    log_error(`requestToSkipHook: Error: ${error.message}`, { error });
-
-    throw error;
-  }
-};

package/Components/GeneralContentScreen/hookAdapter/runInBackground.ts

@@ -1,48 +0,0 @@
-import { shouldSkipHook } from "./validationHelper";
-import { requestToSkipHook } from "./networkService";
-import { log_debug, log_error } from "./logger";
-
-/**
- * Headless pre-hook for the General Content Screen. `configuration` is the
- * Hook object with the screen merged in; skip-hook fields live under `rules`.
- */
-export const runInBackground = async (
-  item,
-  callback,
-  configuration,
-  presentUI
-) => {
-  try {
-    const skipHookIfKeysExist = configuration?.rules?.skip_hook_storage_key;
-
-    if (skipHookIfKeysExist) {
-      const shouldSkip = await shouldSkipHook(skipHookIfKeysExist);
-
-      if (shouldSkip) {
-        log_debug(
-          `runInBackground: Storage key found: ${skipHookIfKeysExist}. Skipping hook.`
-        );
-
-        return callback({ success: true, error: null, payload: item });
-      }
-    }
-
-    const skipHookEndpoint = configuration?.rules?.skip_hook_endpoint;
-
-    if (skipHookEndpoint?.source) {
-      const success = await requestToSkipHook(skipHookEndpoint, item);
-
-      if (success) {
-        log_debug(
-          "runInBackground: Network call forced to finish hook. Skipping hook."
-        );
-
-        return callback({ success: true, error: null, payload: item });
-      }
-    }
-  } catch (error) {
-    log_error(`runInBackground: Error: ${error.message}`);
-  }
-
-  return presentUI();
-};

package/Components/GeneralContentScreen/hookAdapter/validationHelper.ts

@@ -1,72 +0,0 @@
-import { getNamespaceAndKey } from "@applicaster/zapp-react-native-utils/appUtils/contextKeysManager/utils";
-import { localStorage } from "@applicaster/zapp-react-native-bridge/ZappStorage/LocalStorage";
-import { sessionStorage } from "@applicaster/zapp-react-native-bridge/ZappStorage/SessionStorage";
-import { log_error, log_info } from "./logger";
-
-type ParseKey = { key: string; namespace?: string };
-
-export function parseKeyEntries(input: string): ParseKey[] {
-  return input.split(",").flatMap((item) => {
-    const trimmed = item.trim();
-
-    return trimmed ? getNamespaceAndKey(trimmed) : [];
-  });
-}
-
-export const getKeyToSkipHook = async (key: string, namespace?: string) => {
-  const value = await sessionStorage.getItem(key, namespace);
-
-  if (value) {
-    return value;
-  }
-
-  return await localStorage.getItem(key, namespace);
-};
-
-export const shouldSkipHook = async (
-  skipHookIfKeysExist?: string
-): Promise<boolean> => {
-  if (!skipHookIfKeysExist?.trim()) {
-    log_info("shouldSkipHook: No skipping condition provided");
-
-    return false;
-  }
-
-  const keyEntries = parseKeyEntries(skipHookIfKeysExist);
-
-  if (keyEntries.length === 0) {
-    log_info("shouldSkipHook: No valid keys provided");
-
-    return false;
-  }
-
-  for (const entry of keyEntries) {
-    try {
-      const value = await getKeyToSkipHook(entry.key, entry.namespace);
-
-      if (value) {
-        log_info(
-          `shouldSkipHook: Hook will be skipped due to: ${
-            entry.namespace ?? ""
-          } ${entry.key}. Finishing hook flow`
-        );
-
-        return true;
-      }
-    } catch (error) {
-      log_error(
-        `shouldSkipHook: Error: ${error.message} checking key: ${
-          entry.namespace ?? ""
-        } ${entry.key}`,
-        { error }
-      );
-    }
-  }
-
-  log_info(
-    // eslint-disable-next-line max-len
-    "shouldSkipHook: No skipping condition met, none of the provided keys found in storage, proceeding with hook"
-  );
-
-  return false;
-};

package/Components/GeneralContentScreen/hookFocus/index.tsx

@@ -1,13 +0,0 @@
-import * as React from "react";
-
-type Props = {
-  children: React.ReactElement;
-};
-
-/**
- * On native platforms the river `ComponentsMap` registers its own initial focus,
- * so a hook-presented general content screen needs no extra focus wrapper here.
- * The web counterpart (`index.web.tsx`) recreates the content focus group that
- * the `River` wrapper would normally provide.
- */
-export const HookContentFocusGroup = ({ children }: Props) => <>{children}</>;

package/Components/GeneralContentScreen/hookFocus/index.web.tsx

@@ -1,69 +0,0 @@
-import * as React from "react";
-import { StyleSheet } from "react-native";
-import { shallow } from "zustand/shallow";
-
-import { FocusableGroup } from "../../FocusableGroup";
-import {
-  useContentId,
-  useNavbarId,
-  usePathname,
-} from "@applicaster/zapp-react-native-utils/reactHooks/navigation";
-import { useZappHookModalStore } from "../../../Contexts/ZappHookModalContext";
-
-import { useInitialFocus } from "../../Screen/TV/hooks";
-
-const styles = StyleSheet.create({
-  container: { flex: 1 },
-});
-
-type Props = {
-  children: React.ReactElement;
-};
-
-/**
- * A general content screen presented as a full-screen hook is rendered straight
- * through `ComponentsMap`, bypassing the web `River` wrapper. That wrapper is what
- * normally creates the `quick-brick-content` FocusableGroup (with `preferredFocus`)
- * the focus manager relies on and what lets initial focus land on the content.
- *
- * Without it the hook screen renders but nothing is focusable on web TV. This
- * recreates that content group and triggers initial focus, mirroring `River`.
- */
-const FocusedHookContent = ({ children }: Props) => {
-  const contentId = useContentId();
-  const navbarId = useNavbarId();
-  const pathname = usePathname();
-
-  useInitialFocus();
-
-  return (
-    <FocusableGroup
-      id={contentId}
-      // Nest under the hook-modal route so the focus manager treats this as the
-      // active screen's content node; `useInitialFocus` targets the same route.
-      groupId={pathname}
-      nextFocusUp={navbarId}
-      preferredFocus
-      shouldUsePreferredFocus
-      style={styles.container}
-    >
-      {React.cloneElement(children, { groupId: contentId })}
-    </FocusableGroup>
-  );
-};
-
-export const HookContentFocusGroup = ({ children }: Props) => {
-  const isRunningInBackground = useZappHookModalStore(
-    (state) => state.isRunningInBackground,
-    shallow
-  );
-
-  // A hook presented full screen (either as a `/hooks/<id>` screen or a
-  // full-screen modal) needs the content focus group. Only background runs,
-  // which render invisibly, must be left alone so they don't steal focus.
-  if (isRunningInBackground) {
-    return <>{children}</>;
-  }
-
-  return <FocusedHookContent>{children}</FocusedHookContent>;
-};