@applicaster/zapp-react-native-ui-components 15.0.0-rc.26 → 15.0.0-rc.27

package/Components/PlayerContainer/PlayerContainer.tsx

@@ -56,11 +56,6 @@ import { toNumber } from "@applicaster/zapp-react-native-utils/numberUtils";
 import { usePlayNextOverlay } from "@applicaster/zapp-react-native-utils/appUtils/playerManager/usePlayNextOverlay";
 import { PlayNextState } from "@applicaster/zapp-react-native-utils/appUtils/playerManager/OverlayObserver/OverlaysObserver";
 
-import {
-  PlayerAnimationStateEnum,
-  useModalAnimationContext,
-} from "@applicaster/zapp-react-native-ui-components/Components/VideoModal/ModalAnimation";
-
 import {
   PlayerNativeCommandTypes,
   PlayerNativeSendCommand,
@@ -248,9 +243,6 @@ const PlayerContainerComponent = (props: Props) => {
   const screenData = useTargetScreenData(item);
   const { setVisible: showNavBar } = useSetNavbarState();
 
-  const { isActiveGesture, startComponentsAnimation, setPlayerAnimationState } =
-    useModalAnimationContext();
-
   const playerEvent = (event, ...args) => {
     playerManager.invokeHandler(event, ...args);
   };
@@ -482,8 +474,6 @@ const PlayerContainerComponent = (props: Props) => {
     if (isModal && mode === VideoModalMode.MAXIMIZED) {
       if (disableMiniPlayer) {
         navigator.closeVideoModal();
-      } else {
-        setPlayerAnimationState(PlayerAnimationStateEnum.minimize);
       }
     }
 
@@ -680,11 +670,7 @@ const PlayerContainerComponent = (props: Props) => {
                         autoplay={true}
                         controls={false}
                         disableCastAction={disableCastAction}
-                        docked={
-                          navigator.isVideoModalDocked() &&
-                          !startComponentsAnimation &&
-                          !isActiveGesture
-                        }
+                        docked={navigator.isVideoModalDocked()}
                         entry={item}
                         fullscreen={mode === VideoModalMode.FULLSCREEN}
                         inline={inline}
@@ -702,7 +688,6 @@ const PlayerContainerComponent = (props: Props) => {
                         setNextVideoPreloadThresholdPercentage={
                           setNextVideoPreloadThresholdPercentage
                         }
-                        startComponentsAnimation={startComponentsAnimation}
                       >
                         {renderApplePlayer(applePlayerProps)}
                       </Player>

package/Components/PlayerImageBackground/index.tsx

@@ -2,12 +2,6 @@ import React, { PropsWithChildren } from "react";
 import { ImageBackground, View } from "react-native";
 
 import { imageSrcFromMediaItem } from "@applicaster/zapp-react-native-utils/configurationUtils";
-import {
-  AnimationComponent,
-  ComponentAnimationType,
-  useModalAnimationContext,
-  PlayerAnimationStateEnum,
-} from "@applicaster/zapp-react-native-ui-components/Components/VideoModal/ModalAnimation";
 
 type Props = PropsWithChildren<{
   entry: ZappEntry;
@@ -25,30 +19,17 @@ const PlayerImageBackgroundComponent = ({
   style,
   imageStyle,
   imageKey,
-  defaultImageDimensions,
 }: Props) => {
   const source = React.useMemo(
     () => ({ uri: imageSrcFromMediaItem(entry, [imageKey]) }),
     [imageKey, entry]
   );
 
-  const { playerAnimationState } = useModalAnimationContext();
-
   if (!source) return <>{children}</>;
 
   return (
-    <View
-      style={
-        playerAnimationState === PlayerAnimationStateEnum.maximize
-          ? defaultImageDimensions
-          : style
-      }
-    >
-      <AnimationComponent
-        style={style}
-        animationType={ComponentAnimationType.player}
-        additionalData={defaultImageDimensions}
-      >
+    <View style={style}>
+      <View style={style}>
         <ImageBackground
           resizeMode="cover"
           style={imageSize}
@@ -57,7 +38,7 @@ const PlayerImageBackgroundComponent = ({
         >
           {children}
         </ImageBackground>
-      </AnimationComponent>
+      </View>
     </View>
   );
 };

package/Components/VideoModal/ModalAnimation/ModalAnimationContext.tsx

@@ -1,78 +1,19 @@
 import React, { useEffect, useMemo } from "react";
 import { Animated, Dimensions } from "react-native";
 
-import {
-  useSafeAreaInsets,
-  useSafeAreaFrame,
-} from "react-native-safe-area-context";
-import { useGetBottomTabBarHeight } from "@applicaster/zapp-react-native-utils/reactHooks/navigation/useGetBottomTabBarHeight";
 import { useNavigation } from "@applicaster/zapp-react-native-utils/reactHooks/navigation/useNavigation";
-import { isLive } from "@applicaster/zapp-react-native-utils/playerUtils";
 
-import { PROGRESS_BAR_HEIGHT } from "./utils";
 import { useConfiguration } from "../utils";
 import { useIsTabletLandscape } from "@applicaster/zapp-react-native-utils/reactHooks/device/useMemoizedIsTablet";
 
-export enum PlayerAnimationStateEnum {
-  minimize = "minimize",
-  maximize = "maximize",
-  drag_player = "drag_player",
-  drag_scroll = "drag_scroll",
-  appear_as_docked = "appear_as_docked",
-}
-
-export type PlayerAnimationStateT = number | PlayerAnimationStateEnum | null;
-
 export type ModalAnimationContextT = {
   yTranslate: React.MutableRefObject<Animated.Value | null>;
-  isActiveGesture: boolean;
-  playerAnimationState: PlayerAnimationStateT;
-  setPlayerAnimationState: (value: PlayerAnimationStateT) => void;
-  startComponentsAnimation: boolean;
-  setStartComponentsAnimation: (value: boolean) => void;
-  resetPlayerAnimationState: () => void;
   minimisedHeight: number;
-  animatedValues: {
-    lastScrollY: Animated.Value;
-    dragScrollY: Animated.Value;
-    dragVideoPlayerY: Animated.Value;
-    translateYOffset: Animated.Value;
-  };
-  lastScrollYValue: React.MutableRefObject<number>;
-  scrollPosition: React.MutableRefObject<number>;
-  modalSnapPoints: number[];
-  lastSnap: number;
-  setLastSnap: (value: number) => void;
-  tabletLandscapePlayerTopPosition: number;
-  setTabletLandscapePlayerTopPosition: (value: number) => void;
-  startComponentsAnimationDistance: number;
-  progressBarHeight: number;
 };
 
 export const ReactContext = React.createContext<ModalAnimationContextT>({
   yTranslate: React.createRef<Animated.Value | null>(),
-  isActiveGesture: false,
-  playerAnimationState: null,
-  setPlayerAnimationState: () => null,
-  startComponentsAnimation: false,
-  setStartComponentsAnimation: () => null,
-  resetPlayerAnimationState: () => null,
   minimisedHeight: 60,
-  animatedValues: {
-    lastScrollY: new Animated.Value(0),
-    dragScrollY: new Animated.Value(0),
-    dragVideoPlayerY: new Animated.Value(0),
-    translateYOffset: new Animated.Value(0),
-  },
-  lastScrollYValue: null,
-  scrollPosition: null,
-  modalSnapPoints: [0, 0],
-  lastSnap: 0,
-  setLastSnap: () => null,
-  tabletLandscapePlayerTopPosition: 0,
-  setTabletLandscapePlayerTopPosition: () => null,
-  startComponentsAnimationDistance: 0,
-  progressBarHeight: 0,
 });
 
 const Provider = ({ children }: { children: React.ReactNode }) => {
@@ -80,49 +21,18 @@ const Provider = ({ children }: { children: React.ReactNode }) => {
     new Animated.Value(Dimensions.get("window").height)
   );
 
-  const [playerAnimationState, setPlayerAnimationState] =
-    React.useState<PlayerAnimationStateT>(null);
-
-  const [
-    tabletLandscapePlayerTopPosition,
-    setTabletLandscapePlayerTopPosition,
-  ] = React.useState<number>(0);
-
-  const [startComponentsAnimation, setStartComponentsAnimation] =
-    React.useState<boolean>(false);
-
   const {
-    videoModalState: { mode, visible, item },
+    videoModalState: { visible },
   } = useNavigation();
 
-  const isLiveItem = isLive(item);
   const { minimised_height: minimisedHeight } = useConfiguration();
 
-  const resetPlayerAnimationState = React.useCallback(() => {
-    setPlayerAnimationState(null);
-    setStartComponentsAnimation(false);
-  }, []);
-
-  // Animated values
-  const lastScrollY = React.useRef(new Animated.Value(0)).current;
-  const dragScrollY = React.useRef(new Animated.Value(0)).current;
-  const translateYOffset = React.useRef(new Animated.Value(0)).current;
-  const dragVideoPlayerY = React.useRef(new Animated.Value(0)).current;
-
-  const { height: safeAreaFrameHeight } = useSafeAreaFrame();
-  const [height, setHeight] = React.useState<number>(safeAreaFrameHeight);
-  const progressBarHeight = isLiveItem ? 0 : PROGRESS_BAR_HEIGHT;
-  const { bottom: bottomSafeArea } = useSafeAreaInsets();
-  const bottomTabBarHeight = useGetBottomTabBarHeight();
-  const startComponentsAnimationDistance = Math.round((height * 60) / 100);
   const isTabletLandscape = useIsTabletLandscape();
   const windowDimensions = Dimensions.get("window");
 
   useEffect(() => {
     // Reset player animation state when video modal is closed
     if (!visible) {
-      resetPlayerAnimationState();
-
       if (!isTabletLandscape) {
         // restore to portrait ( in portrait mode height is bigger)
         if (windowDimensions.height > windowDimensions.width) {
@@ -134,79 +44,19 @@ const Provider = ({ children }: { children: React.ReactNode }) => {
     }
   }, [
     visible,
-    resetPlayerAnimationState,
     windowDimensions.height,
     isTabletLandscape,
+    windowDimensions.width,
   ]);
 
-  React.useEffect(() => {
-    if (visible && mode === "MAXIMIZED" && height !== safeAreaFrameHeight) {
-      setHeight(safeAreaFrameHeight);
-    }
-  }, [height, safeAreaFrameHeight, mode, visible]);
-
-  /*
-    If bottomTabBarHeight is equal 0 it means an app does not use bottomTabBar.
-    Because of this we need to minus bottom SafeArea offset.
-  */
-
-  const minValue =
-    height -
-    (minimisedHeight + bottomTabBarHeight + progressBarHeight + bottomSafeArea);
-
-  const modalSnapPoints = React.useMemo(() => [0, minValue], [minValue]);
-  // Last snap state which will helps us to make smooth responder to scrollview animation
-  const [lastSnap, setLastSnap] = React.useState<number>(modalSnapPoints[0]);
-  // Extracted animated values which we will use for calculations
-  const lastScrollYValue = React.useRef<number>(0);
-  const scrollPosition = React.useRef<number>(0);
-
   return (
     <ReactContext.Provider
       value={useMemo(
         () => ({
           yTranslate,
-          startComponentsAnimation,
-          setStartComponentsAnimation,
-          isActiveGesture: playerAnimationState !== null,
-          playerAnimationState,
-          setPlayerAnimationState,
-          resetPlayerAnimationState,
           minimisedHeight,
-          animatedValues: {
-            lastScrollY,
-            dragScrollY,
-            dragVideoPlayerY,
-            translateYOffset,
-          },
-          lastScrollYValue,
-          scrollPosition,
-          modalSnapPoints,
-          lastSnap,
-          setLastSnap,
-          tabletLandscapePlayerTopPosition,
-          setTabletLandscapePlayerTopPosition,
-          startComponentsAnimationDistance,
-          progressBarHeight,
         }),
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-        [
-          startComponentsAnimation,
-          playerAnimationState,
-          minimisedHeight,
-          lastScrollY,
-          dragScrollY,
-          dragVideoPlayerY,
-          translateYOffset,
-          lastSnap,
-          modalSnapPoints,
-          lastScrollYValue,
-          scrollPosition,
-          tabletLandscapePlayerTopPosition,
-          startComponentsAnimationDistance,
-          progressBarHeight,
-          isLiveItem,
-        ]
+        [minimisedHeight]
       )}
     >
       {children}

package/Components/VideoModal/ModalAnimation/index.ts

@@ -1,18 +1,7 @@
-export { AnimatedPlayerModalWrapper } from "./AnimatedPlayerModalWrapper";
-
-export { AnimatedScrollModal } from "./AnimatedScrollModal";
-
-export { AnimatedVideoPlayerComponent } from "./AnimatedVideoPlayerComponent";
-
-export {
-  withModalAnimationProvider,
-  PlayerAnimationStateEnum,
-} from "./ModalAnimationContext";
+export { withModalAnimationProvider } from "./ModalAnimationContext";
 
 export { useModalAnimationContext } from "./useModalAnimationContext";
 
-export { AnimationComponent } from "./AnimationComponent";
-
-export { ComponentAnimationType, defaultAspectRatioWidth } from "./utils";
+export { defaultAspectRatioWidth } from "./utils";
 
 export { DURATION_TO_MINIMIZE, DURATION_TO_MAXIMIZE } from "./const";

package/Components/VideoModal/ModalAnimation/utils.ts

@@ -1,332 +1,6 @@
-/* eslint-disable padding-line-between-statements */
-
-import { PlayerAnimationStateEnum } from "@applicaster/zapp-react-native-ui-components/Components/VideoModal/ModalAnimation";
-import { toNumberWithDefaultZero } from "@applicaster/zapp-react-native-utils/numberUtils";
-
-export enum ComponentAnimationType {
-  bottomBar = "bottomBar",
-  player = "player",
-  componentFade = "componentFade",
-  componentAppears = "componentAppears",
-  moveUpComponent = "moveUpComponent",
-  moveComponentHorizontal = "moveComponentHorizontal",
-  audioPlayerPaddingHorizontal = "audioPlayerPaddingHorizontal",
-}
-
 export const AUDIO_PLAYER_HORIZONTAL_PADDING = 15;
+
 export const PROGRESS_BAR_HEIGHT = 3;
 
 export const defaultAspectRatioWidth = (height: number): number =>
   (height / 9) * 16;
-
-export const getAnimationStyle = (component, animatedValue) => {
-  switch (component) {
-    case ComponentAnimationType.bottomBar: {
-      return { zIndex: 99, transform: [{ translateY: animatedValue }] };
-    }
-
-    case ComponentAnimationType.player: {
-      return { width: animatedValue.x, height: animatedValue.y };
-    }
-
-    case ComponentAnimationType.componentFade:
-    case ComponentAnimationType.componentAppears: {
-      return { opacity: animatedValue };
-    }
-
-    case ComponentAnimationType.moveUpComponent: {
-      return { transform: [{ translateY: animatedValue }] };
-    }
-
-    case ComponentAnimationType.audioPlayerPaddingHorizontal:
-    case ComponentAnimationType.moveComponentHorizontal: {
-      return { transform: [{ translateX: animatedValue }] };
-    }
-
-    default:
-      return null;
-  }
-};
-
-export const getAnimationDefaultValue = (component, bottomTabBarHeight) => {
-  switch (component) {
-    case ComponentAnimationType.bottomBar: {
-      return bottomTabBarHeight;
-    }
-
-    case ComponentAnimationType.player: {
-      return { x: 0, y: 0 };
-    }
-
-    case ComponentAnimationType.componentFade: {
-      return 1;
-    }
-
-    case ComponentAnimationType.audioPlayerPaddingHorizontal:
-    case ComponentAnimationType.moveComponentHorizontal:
-    case ComponentAnimationType.componentAppears:
-    case ComponentAnimationType.moveUpComponent: {
-      return 0;
-    }
-  }
-};
-
-export const calculateAnimationValue = (animationType, dragPosition, data) => {
-  const {
-    isAudioItem,
-    bottomTabBarHeight,
-    minimisedHeight,
-    minimisedWidth,
-    defaultValue,
-    moveUpValue,
-    moveComponentHorizontalValue,
-    isTablet,
-    isTabletLandscape,
-    isRTL,
-    fromMiniPlayer,
-    inlineAudioPlayer,
-  } = data;
-
-  switch (animationType) {
-    case ComponentAnimationType.bottomBar: {
-      if (fromMiniPlayer) {
-        return dragPosition < bottomTabBarHeight
-          ? dragPosition
-          : bottomTabBarHeight;
-      }
-
-      return dragPosition < bottomTabBarHeight
-        ? bottomTabBarHeight - dragPosition
-        : 0;
-    }
-
-    case ComponentAnimationType.player: {
-      const value =
-        isAudioItem && !inlineAudioPlayer
-          ? isTabletLandscape
-            ? fromMiniPlayer
-              ? { forWidth: 4, forHeight: 4.5 }
-              : { forWidth: 3, forHeight: 3 }
-            : { forWidth: 2, forHeight: 2 }
-          : isTabletLandscape
-            ? { forWidth: 8, forHeight: 6.5 }
-            : { forWidth: 3.5, forHeight: 2 };
-
-      const minWidth =
-        isAudioItem && !inlineAudioPlayer ? minimisedHeight : minimisedWidth;
-
-      if (fromMiniPlayer) {
-        const calculationWidth =
-          dragPosition * value.forWidth < minWidth
-            ? minWidth
-            : dragPosition * value.forWidth;
-        const calculationHeight =
-          dragPosition * value.forHeight < minimisedHeight
-            ? minimisedHeight
-            : dragPosition * value.forHeight;
-
-        return {
-          x:
-            calculationWidth < defaultValue.x
-              ? calculationWidth
-              : defaultValue.x,
-          y:
-            calculationHeight < defaultValue.y
-              ? calculationHeight
-              : defaultValue.y,
-        };
-      }
-
-      const calculationWidth = defaultValue.x - dragPosition * value.forWidth;
-
-      const calculationHeight = defaultValue.y - dragPosition * value.forHeight;
-
-      return {
-        x: calculationWidth > minWidth ? calculationWidth : minWidth,
-        y:
-          calculationHeight > minimisedHeight
-            ? calculationHeight
-            : minimisedHeight,
-      };
-    }
-
-    case ComponentAnimationType.componentFade: {
-      if (fromMiniPlayer) {
-        const calculation = dragPosition / (isTablet ? 200 : 150);
-
-        return calculation < 1 ? calculation : 1;
-      }
-
-      const calculation = 1 - dragPosition / (isTablet ? 200 : 150);
-
-      return calculation > 0 ? calculation : 0;
-    }
-
-    case ComponentAnimationType.componentAppears: {
-      if (fromMiniPlayer) {
-        const calculation = 1 - dragPosition / (isTablet ? 200 : 150);
-
-        return calculation > 0 ? calculation : 0;
-      }
-
-      const calculation = dragPosition / (isTablet ? 200 : 150);
-
-      return calculation < 1 ? calculation : 1;
-    }
-
-    case ComponentAnimationType.moveUpComponent: {
-      if (fromMiniPlayer) {
-        const calculation =
-          moveUpValue + dragPosition / (isTabletLandscape ? 1 : 4);
-
-        return calculation < 0 ? calculation : 0;
-      }
-
-      const calculation = 0 - dragPosition / (isTabletLandscape ? 1 : 2);
-
-      return calculation > moveUpValue ? calculation : moveUpValue;
-    }
-
-    case ComponentAnimationType.moveComponentHorizontal: {
-      if (fromMiniPlayer) {
-        const calculation = isRTL
-          ? moveComponentHorizontalValue - dragPosition * 2
-          : moveComponentHorizontalValue + dragPosition * 2;
-        const condition = isRTL ? calculation > 0 : calculation < 0;
-
-        return condition ? calculation : 0;
-      }
-
-      const calculation = isRTL ? dragPosition * 2 : -(dragPosition * 2);
-      const condition = isRTL
-        ? calculation < moveComponentHorizontalValue
-        : calculation > moveComponentHorizontalValue;
-
-      return condition ? calculation : moveComponentHorizontalValue;
-    }
-
-    case ComponentAnimationType.audioPlayerPaddingHorizontal: {
-      const padding = isRTL
-        ? AUDIO_PLAYER_HORIZONTAL_PADDING
-        : -AUDIO_PLAYER_HORIZONTAL_PADDING;
-
-      if (fromMiniPlayer) {
-        const calculation = isRTL
-          ? padding - dragPosition / 5
-          : padding + dragPosition / 5;
-        const condition = isRTL ? calculation > 0 : calculation < 0;
-
-        return condition ? calculation : 0;
-      }
-
-      const calculation = isRTL ? dragPosition / 5 : -(dragPosition / 5);
-      const condition = isRTL ? calculation < padding : calculation > padding;
-
-      return condition ? calculation : padding;
-    }
-  }
-};
-
-export const gestureListenerHelper = (data) => {
-  const {
-    listenerValue,
-    preparedValue,
-    animationType,
-    animatedValue,
-    calculationData,
-    modalSnapPoint,
-    startComponentsAnimationDistance,
-    startComponentsAnimation,
-    setStartComponentsAnimation,
-    getAnimationValue,
-  } = data;
-
-  if (calculationData.fromMiniPlayer) {
-    if (listenerValue <= 0) {
-      if (
-        preparedValue >= 0 &&
-        preparedValue <= modalSnapPoint - startComponentsAnimationDistance
-      ) {
-        !startComponentsAnimation && setStartComponentsAnimation(true);
-
-        animatedValue.setValue(
-          calculateAnimationValue(animationType, preparedValue, calculationData)
-        );
-      } else {
-        animatedValue.setValue(calculationData.defaultValue);
-        startComponentsAnimation && setStartComponentsAnimation(false);
-      }
-    } else {
-      const value = getAnimationValue(
-        animationType,
-        PlayerAnimationStateEnum.minimize
-      ).toValue;
-
-      animatedValue.setValue(value);
-    }
-  } else {
-    if (preparedValue >= startComponentsAnimationDistance) {
-      !startComponentsAnimation && setStartComponentsAnimation(true);
-      const value = Math.round(
-        preparedValue - startComponentsAnimationDistance
-      );
-
-      animatedValue.setValue(
-        calculateAnimationValue(animationType, value, calculationData)
-      );
-    } else {
-      animatedValue.setValue(calculationData.defaultValue);
-      startComponentsAnimation && setStartComponentsAnimation(false);
-    }
-  }
-};
-
-export const setScrollModalAnimatedValue = (
-  animatedValue,
-  value,
-  setLastSnap
-) => {
-  setLastSnap(value);
-  animatedValue.setValue(value);
-};
-
-export const resetScrollAnimatedValues = (
-  lastScrollY,
-  lastScrollYValue,
-  dragScrollY,
-  dragVideoPlayerY
-) => {
-  lastScrollY.setValue(0);
-  lastScrollYValue.current = 0;
-  dragScrollY.setValue(0);
-  dragVideoPlayerY.setValue(0);
-};
-
-export const getMoveUpValue = ({
-  additionalData,
-  insets,
-  isAudioItem,
-  progressBarHeight,
-  isTablet,
-  isTabletLandscape,
-  tabletLandscapePlayerTopPosition,
-}) => {
-  if (additionalData.saveArea) {
-    return -insets.top + (isAudioItem ? 0 : progressBarHeight);
-  }
-
-  if (isAudioItem) {
-    // for any layouts in audioPlayer
-    return -1 * toNumberWithDefaultZero(additionalData?.marginTop);
-  }
-
-  if (isTablet) {
-    if (isTabletLandscape) {
-      return -tabletLandscapePlayerTopPosition + progressBarHeight;
-    } else {
-      return -130;
-    }
-  }
-
-  return -50 + progressBarHeight;
-};

package/Components/VideoModal/PlayerWrapper.tsx

@@ -1,6 +1,10 @@
 import * as React from "react";
 import { StyleSheet, View, ViewStyle } from "react-native";
-import { Edge, SafeAreaView } from "react-native-safe-area-context";
+import {
+  Edge,
+  SafeAreaView,
+  useSafeAreaInsets,
+} from "react-native-safe-area-context";
 import { isTV } from "@applicaster/zapp-react-native-utils/reactUtils";
 import { useIsTablet } from "@applicaster/zapp-react-native-utils/reactHooks";
 import { playerDimensionsHack } from "./utils";
@@ -63,8 +67,12 @@ const PlayerWrapperComponent = (props: Props) => {
     [isInlineModal, isTabletLandscape, tabletWidth]
   );
 
+  const insets = useSafeAreaInsets();
+
   const aspectRatio = React.useMemo(
-    () => calculateAspectRatio(isInlineModal, pip),
+    () => calculateAspectRatio(isInlineModal, pip, insets),
+    // ignoring insets - only initial needed
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     [isInlineModal, pip]
   );
 

package/Components/VideoModal/__tests__/PlayerWrapper.test.tsx

@@ -46,6 +46,7 @@ jest.mock("@applicaster/zapp-react-native-utils/theme", () => ({
 
 jest.mock("@applicaster/zapp-react-native-utils/reactUtils", () => ({
   isTV: jest.fn(() => false),
+  isAndroidPlatform: jest.fn(() => false),
   isApplePlatform: jest.fn(() => true),
   platformSelect: jest.fn((props) => props.android),
 }));