Revert changes in modal related code

software-mansion-labs · Feb 15, 2024 · 2947c3f · 2947c3f
1 parent c21dd04
commit 2947c3f
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 42 deletions.
diff --git a/src/components/Modal/BaseModal.tsx b/src/components/Modal/BaseModal.tsx
@@ -3,7 +3,6 @@ import {View} from 'react-native';
 import ReactNativeModal from 'react-native-modal';
 import ColorSchemeWrapper from '@components/ColorSchemeWrapper';
 import useKeyboardState from '@hooks/useKeyboardState';
-import useOnboardingLayout from '@hooks/useOnboardingLayout';
 import usePrevious from '@hooks/usePrevious';
 import useSafeAreaInsets from '@hooks/useSafeAreaInsets';
 import useStyleUtils from '@hooks/useStyleUtils';
@@ -23,7 +22,6 @@ function BaseModal(
         isVisible,
         onClose,
         shouldSetModalVisibility = true,
-        shouldForceHideBackdrop = false,
         onModalHide = () => {},
         type,
         popoverAnchorPosition = {},
@@ -50,7 +48,6 @@ function BaseModal(
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const {windowWidth, windowHeight, isSmallScreenWidth} = useWindowDimensions();
-    const {shouldUseNarrowLayout} = useOnboardingLayout();
     const keyboardStateContextValue = useKeyboardState();
 
     const safeAreaInsets = useSafeAreaInsets();
@@ -150,9 +147,8 @@ function BaseModal(
                 popoverAnchorPosition,
                 innerContainerStyle,
                 outerStyle,
-                shouldUseNarrowLayout,
             ),
-        [StyleUtils, type, windowWidth, windowHeight, isSmallScreenWidth, popoverAnchorPosition, innerContainerStyle, outerStyle, shouldUseNarrowLayout],
+        [StyleUtils, type, windowWidth, windowHeight, isSmallScreenWidth, popoverAnchorPosition, innerContainerStyle, outerStyle],
     );
 
     const {
@@ -195,7 +191,7 @@ function BaseModal(
             swipeDirection={swipeDirection}
             isVisible={isVisible}
             backdropColor={theme.overlay}
-            backdropOpacity={(!shouldUseCustomBackdrop && hideBackdrop) || shouldForceHideBackdrop ? 0 : variables.overlayOpacity}
+            backdropOpacity={!shouldUseCustomBackdrop && hideBackdrop ? 0 : variables.overlayOpacity}
             backdropTransitionOutTiming={0}
             hasBackdrop={fullscreen}
             coverScreen={fullscreen}

diff --git a/src/components/Modal/types.ts b/src/components/Modal/types.ts
@@ -20,9 +20,6 @@ type BaseModalProps = Partial<ModalProps> & {
     /** Should we announce the Modal visibility changes? */
     shouldSetModalVisibility?: boolean;
 
-    /** Should we hide backdrop no matter what value is set in modal styles */
-    shouldForceHideBackdrop?: boolean;
-
     /** Callback method fired when the user requests to close the modal */
     onClose: () => void;
 

diff --git a/src/styles/utils/generators/ModalStyleUtils.ts b/src/styles/utils/generators/ModalStyleUtils.ts
@@ -15,10 +15,6 @@ function getCenteredModalStyles(styles: ThemeStyles, windowWidth: number, isSmal
     };
 }
 
-function getOnboardingModalStyles(styles: ThemeStyles, windowWidth: number, shouldUseNarrowLayout: boolean, isFullScreenWhenSmall = false): ViewStyle {
-    return shouldUseNarrowLayout ? {width: 500, height: 712} : getCenteredModalStyles(styles, windowWidth, !shouldUseNarrowLayout, isFullScreenWhenSmall);
-}
-
 type WindowDimensions = {
     windowWidth: number;
     windowHeight: number;
@@ -45,12 +41,11 @@ type GetModalStylesStyleUtil = {
         popoverAnchorPosition?: ViewStyle,
         innerContainerStyle?: ViewStyle,
         outerStyle?: ViewStyle,
-        shouldUseNarrowLayout?: boolean,
     ) => GetModalStyles;
 };
 
 const createModalStyleUtils: StyleUtilGenerator<GetModalStylesStyleUtil> = ({theme, styles}) => ({
-    getModalStyles: (type, windowDimensions, popoverAnchorPosition = {}, innerContainerStyle = {}, outerStyle = {}, shouldUseNarrowLayout = false): GetModalStyles => {
+    getModalStyles: (type, windowDimensions, popoverAnchorPosition = {}, innerContainerStyle = {}, outerStyle = {}): GetModalStyles => {
         const {isSmallScreenWidth, windowWidth} = windowDimensions;
 
         let modalStyle: GetModalStyles['modalStyle'] = {
@@ -167,33 +162,7 @@ const createModalStyleUtils: StyleUtilGenerator<GetModalStylesStyleUtil> = ({the
                 shouldAddTopSafeAreaMargin = false;
                 shouldAddBottomSafeAreaMargin = false;
                 shouldAddTopSafeAreaPadding = false;
-                break;
-            case CONST.MODAL.MODAL_TYPE.ONBOARDING:
-                // Handles how onboarding modals should be rendered on different screens
-                modalStyle = {
-                    ...modalStyle,
-                    ...{
-                        alignItems: 'center',
-                    },
-                };
-                modalContainerStyle = {
-                    boxShadow: '0px 0px 5px 5px rgba(0, 0, 0, 0.1)',
-                    borderWidth: 0,
-                    flex: !shouldUseNarrowLayout ? 1 : undefined,
-                    marginTop: 0,
-                    marginBottom: 0,
-                    borderRadius: !shouldUseNarrowLayout ? 0 : 16,
-                    overflow: 'hidden',
-                    ...getOnboardingModalStyles(styles, windowWidth, shouldUseNarrowLayout, true),
-                };
-
-                // Allow this modal to be dismissed with a swipe down or swipe right
-                // swipeDirection = ['down', 'right'];
-                animationIn = 'fadeIn';
-                animationOut = 'fadeOut';
-                shouldAddTopSafeAreaMargin = !shouldUseNarrowLayout;
-                shouldAddBottomSafeAreaMargin = false;
-                shouldAddTopSafeAreaPadding = false;
+                shouldAddBottomSafeAreaPadding = false;
                 break;
             case CONST.MODAL.MODAL_TYPE.BOTTOM_DOCKED:
                 modalStyle = {