Merge pull request #40912 from lukemorawski/40827-missing_bottom_padd…

…ing_fix Missing bottom padding fix
Expensify · May 10, 2024 · f894f89 · f894f89
2 parents 52d4f31 + ddb7755
commit f894f89
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 8 deletions.
diff --git a/src/pages/settings/AboutPage/ConsolePage.tsx b/src/pages/settings/AboutPage/ConsolePage.tsx
@@ -154,7 +154,7 @@ function ConsolePage({capturedLogs, shouldStoreLogs}: ConsolePageProps) {
                     success
                     text={translate('initialSettingsPage.debugConsole.execute')}
                     onPress={executeArbitraryCode}
-                    style={[styles.mt5]}
+                    style={[styles.mv5]}
                     large
                 />
             </View>

diff --git a/src/pages/settings/Wallet/ReportCardLostPage.tsx b/src/pages/settings/Wallet/ReportCardLostPage.tsx
@@ -11,6 +11,7 @@ import SingleOptionSelector from '@components/SingleOptionSelector';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import usePrevious from '@hooks/usePrevious';
+import useStyledSafeAreaInsets from '@hooks/useStyledSafeAreaInsets';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@libs/Navigation/Navigation';
 import type {SettingsNavigatorParamList} from '@libs/Navigation/types';
@@ -92,6 +93,8 @@ function ReportCardLostPage({
 
     const prevIsLoading = usePrevious(formData?.isLoading);
 
+    const {paddingBottom} = useStyledSafeAreaInsets();
+
     const formattedAddress = PersonalDetailsUtils.getFormattedAddress(privatePersonalDetails ?? {});
 
     useEffect(() => {
@@ -159,11 +162,11 @@ function ReportCardLostPage({
                 title={translate('reportCardLostOrDamaged.screenTitle')}
                 onBackButtonPress={handleBackButtonPress}
             />
-            <View style={[styles.flex1, styles.justifyContentBetween, styles.pt3]}>
+            <View style={[styles.flex1, styles.justifyContentBetween, styles.pt3, styles.mh5, !paddingBottom ? styles.pb5 : null]}>
                 {isReasonConfirmed ? (
                     <>
                         <View>
-                            <Text style={[styles.textHeadline, styles.mb3, styles.mh5]}>{translate('reportCardLostOrDamaged.confirmAddressTitle')}</Text>
+                            <Text style={[styles.textHeadline, styles.mb3]}>{translate('reportCardLostOrDamaged.confirmAddressTitle')}</Text>
                             <MenuItemWithTopDescription
                                 title={formattedAddress}
                                 description={translate('reportCardLostOrDamaged.address')}
@@ -172,9 +175,9 @@ function ReportCardLostPage({
                                 numberOfLinesTitle={2}
                             />
                             {isDamaged ? (
-                                <Text style={[styles.mt3, styles.mh5]}>{translate('reportCardLostOrDamaged.cardDamagedInfo')}</Text>
+                                <Text style={[styles.mt3]}>{translate('reportCardLostOrDamaged.cardDamagedInfo')}</Text>
                             ) : (
-                                <Text style={[styles.mt3, styles.mh5]}>{translate('reportCardLostOrDamaged.cardLostOrStolenInfo')}</Text>
+                                <Text style={[styles.mt3]}>{translate('reportCardLostOrDamaged.cardLostOrStolenInfo')}</Text>
                             )}
                         </View>
                         <FormAlertWithSubmitButton
@@ -187,7 +190,7 @@ function ReportCardLostPage({
                     </>
                 ) : (
                     <>
-                        <View style={styles.mh5}>
+                        <View>
                             <Text style={[styles.textHeadline, styles.mr5]}>{translate('reportCardLostOrDamaged.reasonTitle')}</Text>
                             <SingleOptionSelector
                                 options={OPTIONS}
@@ -200,7 +203,6 @@ function ReportCardLostPage({
                             onSubmit={handleSubmitFirstStep}
                             message="reportCardLostOrDamaged.reasonError"
                             buttonText={translate('reportCardLostOrDamaged.nextButtonLabel')}
-                            containerStyles={[styles.m5]}
                         />
                     </>
                 )}

diff --git a/src/pages/settings/Wallet/TransferBalancePage.tsx b/src/pages/settings/Wallet/TransferBalancePage.tsx
@@ -14,6 +14,7 @@ import ScrollView from '@components/ScrollView';
 import Text from '@components/Text';
 import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
+import useStyledSafeAreaInsets from '@hooks/useStyledSafeAreaInsets';
 import useThemeStyles from '@hooks/useThemeStyles';
 import * as CurrencyUtils from '@libs/CurrencyUtils';
 import * as ErrorUtils from '@libs/ErrorUtils';
@@ -51,6 +52,7 @@ function TransferBalancePage({bankAccountList, fundList, userWallet, walletTrans
     const styles = useThemeStyles();
     const {numberFormat, translate} = useLocalize();
     const {isOffline} = useNetwork();
+    const {paddingBottom} = useStyledSafeAreaInsets();
     const paymentCardList = fundList ?? {};
 
     const paymentTypes = [
@@ -217,6 +219,7 @@ function TransferBalancePage({bankAccountList, fundList, userWallet, walletTrans
                         isDisabled={isButtonDisabled || isOffline}
                         message={errorMessage}
                         isAlertVisible={!isEmptyObject(errorMessage)}
+                        containerStyles={[styles.ph5, !paddingBottom ? styles.pb5 : null]}
                     />
                 </View>
             </FullPageNotFoundView>

diff --git a/src/pages/tasks/NewTaskPage.tsx b/src/pages/tasks/NewTaskPage.tsx
@@ -12,6 +12,7 @@ import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
 import ScreenWrapper from '@components/ScreenWrapper';
 import ScrollView from '@components/ScrollView';
 import useLocalize from '@hooks/useLocalize';
+import useStyledSafeAreaInsets from '@hooks/useStyledSafeAreaInsets';
 import useThemeStyles from '@hooks/useThemeStyles';
 import * as LocalePhoneNumber from '@libs/LocalePhoneNumber';
 import Navigation from '@libs/Navigation/Navigation';
@@ -56,6 +57,8 @@ function NewTaskPage({task, reports, personalDetails}: NewTaskPageProps) {
     const hasDestinationError = task?.skipConfirmation && !task?.parentReportID;
     const isAllowedToCreateTask = useMemo(() => isEmptyObject(parentReport) || ReportUtils.isAllowedToComment(parentReport), [parentReport]);
 
+    const {paddingBottom} = useStyledSafeAreaInsets();
+
     useEffect(() => {
         setErrorMessage('');
 
@@ -201,7 +204,7 @@ function NewTaskPage({task, reports, personalDetails}: NewTaskPageProps) {
                             onSubmit={onSubmit}
                             enabledWhenOffline
                             buttonText={translate('newTaskPage.confirmTask')}
-                            containerStyles={[styles.mh0, styles.mt5, styles.flex1, styles.ph5]}
+                            containerStyles={[styles.mh0, styles.mt5, styles.flex1, styles.ph5, !paddingBottom ? styles.mb5 : null]}
                         />
                     </View>
                 </ScrollView>