Merge pull request Expensify#29617 from ahmedGaber93/issue-28145

add bottom safe area padding on the EditRequestReceiptPage.
software-mansion-labs · Oct 16, 2023 · 2404352 · 2404352
2 parents 8e6a74c + c795517
commit 2404352
Showing 1 changed file with 16 additions and 11 deletions.
diff --git a/src/pages/EditRequestReceiptPage.js b/src/pages/EditRequestReceiptPage.js
@@ -1,5 +1,6 @@
 import React, {useState} from 'react';
 import PropTypes from 'prop-types';
+import {View} from 'react-native';
 import ScreenWrapper from '../components/ScreenWrapper';
 import HeaderWithBackButton from '../components/HeaderWithBackButton';
 import Navigation from '../libs/Navigation/Navigation';
@@ -40,17 +41,21 @@ function EditRequestReceiptPage({route, transactionID}) {
             testID={EditRequestReceiptPage.displayName}
             headerGapStyles={isDraggingOver ? [styles.receiptDropHeaderGap] : []}
         >
-            <DragAndDropProvider setIsDraggingOver={setIsDraggingOver}>
-                <HeaderWithBackButton
-                    title={translate('common.receipt')}
-                    onBackButtonPress={Navigation.goBack}
-                />
-                <ReceiptSelector
-                    route={route}
-                    transactionID={transactionID}
-                    isInTabNavigator={false}
-                />
-            </DragAndDropProvider>
+            {({safeAreaPaddingBottomStyle}) => (
+                <DragAndDropProvider setIsDraggingOver={setIsDraggingOver}>
+                    <View style={[styles.flex1, safeAreaPaddingBottomStyle]}>
+                        <HeaderWithBackButton
+                            title={translate('common.receipt')}
+                            onBackButtonPress={Navigation.goBack}
+                        />
+                        <ReceiptSelector
+                            route={route}
+                            transactionID={transactionID}
+                            isInTabNavigator={false}
+                        />
+                    </View>
+                </DragAndDropProvider>
+            )}
         </ScreenWrapper>
     );
 }