Merge pull request #11257 from Expensify/Rory-ExtraSpaceAdditionalDet…

…ails Fix extra space on AdditionalDetailsPage
Expensify · Sep 29, 2022 · 60d933e · 60d933e
2 parents cebd727 + da98b2e
commit 60d933e
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 29 deletions.
diff --git a/src/pages/EnablePayments/ActivateStep.js b/src/pages/EnablePayments/ActivateStep.js
@@ -1,7 +1,6 @@
 import React from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
-import ScreenWrapper from '../../components/ScreenWrapper';
 import HeaderWithCloseButton from '../../components/HeaderWithCloseButton';
 import Navigation from '../../libs/Navigation/Navigation';
 import withLocalize, {withLocalizePropTypes} from '../../components/withLocalize';
@@ -79,7 +78,7 @@ class ActivateStep extends React.Component {
 
     render() {
         return (
-            <ScreenWrapper>
+            <>
                 <HeaderWithCloseButton
                     title={this.props.translate('activateStep.headerTitle')}
                     onCloseButtonPress={() => Navigation.dismissModal()}
@@ -92,7 +91,7 @@ class ActivateStep extends React.Component {
                         <Text>{this.props.translate('activateStep.checkBackLater')}</Text>
                     )}
                 </View>
-            </ScreenWrapper>
+            </>
         );
     }
 }

diff --git a/src/pages/EnablePayments/AdditionalDetailsStep.js b/src/pages/EnablePayments/AdditionalDetailsStep.js
@@ -269,7 +269,7 @@ class AdditionalDetailsStep extends React.Component {
         const {firstName, lastName} = PersonalDetails.extractFirstAndLastNameFromAvailableDetails(this.props.currentUserPersonalDetails);
 
         return (
-            <ScreenWrapper style={[styles.flex1]} keyboardAvoidingViewBehavior="height">
+            <>
                 <HeaderWithCloseButton
                     title={this.props.translate('additionalDetailsStep.headerTitle')}
                     onCloseButtonPress={() => Navigation.dismissModal()}
@@ -370,7 +370,7 @@ class AdditionalDetailsStep extends React.Component {
                         <OfflineIndicator containerStyles={[styles.mh5, styles.mb3]} />
                     </FormScrollView>
                 </View>
-            </ScreenWrapper>
+            </>
         );
     }
 }

diff --git a/src/pages/EnablePayments/EnablePaymentsPage.js b/src/pages/EnablePayments/EnablePaymentsPage.js
@@ -15,7 +15,6 @@ import OnfidoStep from './OnfidoStep';
 import AdditionalDetailsStep from './AdditionalDetailsStep';
 import TermsStep from './TermsStep';
 import ActivateStep from './ActivateStep';
-import styles from '../../styles/styles';
 import HeaderWithCloseButton from '../../components/HeaderWithCloseButton';
 import Navigation from '../../libs/Navigation/Navigation';
 import FailedKYC from './FailedKYC';
@@ -54,31 +53,37 @@ class EnablePaymentsPage extends React.Component {
             return <FullScreenLoadingIndicator />;
         }
 
-        if (this.props.userWallet.errorCode === CONST.WALLET.ERROR.KYC) {
-            return (
-                <ScreenWrapper style={[styles.flex1]} keyboardAvoidingViewBehavior="height">
-                    <HeaderWithCloseButton
-                        title={this.props.translate('additionalDetailsStep.headerTitle')}
-                        onCloseButtonPress={() => Navigation.dismissModal()}
-                    />
-                    <FailedKYC />
-                </ScreenWrapper>
-            );
-        }
-        if (this.props.userWallet.shouldShowWalletActivationSuccess) {
-            return (
-                <ActivateStep userWallet={this.props.userWallet} />
-            );
-        }
-
-        const currentStep = this.props.userWallet.currentStep || CONST.WALLET.STEP.ADDITIONAL_DETAILS;
-
         return (
             <ScreenWrapper>
-                {currentStep === CONST.WALLET.STEP.ADDITIONAL_DETAILS && <AdditionalDetailsStep walletAdditionalDetailsDraft={this.props.walletAdditionalDetailsDraft} />}
-                {currentStep === CONST.WALLET.STEP.ONFIDO && <OnfidoStep walletAdditionalDetailsDraft={this.props.walletAdditionalDetailsDraft} />}
-                {currentStep === CONST.WALLET.STEP.TERMS && <TermsStep />}
-                {currentStep === CONST.WALLET.STEP.ACTIVATE && <ActivateStep userWallet={this.props.userWallet} />}
+                {(() => {
+                    if (this.props.userWallet.errorCode === CONST.WALLET.ERROR.KYC) {
+                        return (
+                            <>
+                                <HeaderWithCloseButton
+                                    title={this.props.translate('additionalDetailsStep.headerTitle')}
+                                    onCloseButtonPress={() => Navigation.dismissModal()}
+                                />
+                                <FailedKYC />
+                            </>
+                        );
+                    }
+
+                    if (this.props.userWallet.shouldShowWalletActivationSuccess) {
+                        return (
+                            <ActivateStep userWallet={this.props.userWallet} />
+                        );
+                    }
+
+                    const currentStep = this.props.userWallet.currentStep || CONST.WALLET.STEP.ADDITIONAL_DETAILS;
+                    return (
+                        <>
+                            {currentStep === CONST.WALLET.STEP.ADDITIONAL_DETAILS && <AdditionalDetailsStep walletAdditionalDetailsDraft={this.props.walletAdditionalDetailsDraft} />}
+                            {currentStep === CONST.WALLET.STEP.ONFIDO && <OnfidoStep walletAdditionalDetailsDraft={this.props.walletAdditionalDetailsDraft} />}
+                            {currentStep === CONST.WALLET.STEP.TERMS && <TermsStep />}
+                            {currentStep === CONST.WALLET.STEP.ACTIVATE && <ActivateStep userWallet={this.props.userWallet} />}
+                        </>
+                    );
+                })()}
             </ScreenWrapper>
         );
     }