Merge pull request Expensify#68649 from dukenv0307/fix/68298

test drive backdrop does not cover all screen when resize

Author: Beamanator

src/components/Modal/ReanimatedModal/index.tsx

@@ -1,11 +1,12 @@
 import noop from 'lodash/noop';
 import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import type {NativeEventSubscription, ViewStyle} from 'react-native';
-import {BackHandler, Dimensions, InteractionManager, Modal, View} from 'react-native';
+import {BackHandler, InteractionManager, Modal, View} from 'react-native';
 import {LayoutAnimationConfig} from 'react-native-reanimated';
 import FocusTrapForModal from '@components/FocusTrap/FocusTrapForModal';
 import KeyboardAvoidingView from '@components/KeyboardAvoidingView';
 import useThemeStyles from '@hooks/useThemeStyles';
+import useWindowDimensions from '@hooks/useWindowDimensions';
 import getPlatform from '@libs/getPlatform';
 import variables from '@styles/variables';
 import CONST from '@src/CONST';
@@ -49,6 +50,8 @@ function ReanimatedModal({
     const [isVisibleState, setIsVisibleState] = useState(isVisible);
     const [isContainerOpen, setIsContainerOpen] = useState(false);
     const [isTransitioning, setIsTransitioning] = useState(false);
+    const {windowWidth, windowHeight} = useWindowDimensions();
+
     const backHandlerListener = useRef<NativeEventSubscription | null>(null);
     const handleRef = useRef<number | undefined>(undefined);
 
@@ -119,9 +122,8 @@ function ReanimatedModal({
     }, [isVisible, isContainerOpen, isTransitioning]);
 
     const backdropStyle: ViewStyle = useMemo(() => {
-        const {width, height} = Dimensions.get('screen');
-        return {width, height, backgroundColor: backdropColor};
-    }, [backdropColor]);
+        return {width: windowWidth, height: windowHeight, backgroundColor: backdropColor};
+    }, [windowWidth, windowHeight, backdropColor]);
 
     const onOpenCallBack = useCallback(() => {
         setIsTransitioning(false);