From 1a034c35b5fbfef5d2658b8aa092f0ea9dfea6a1 Mon Sep 17 00:00:00 2001
From: Abdelhafidh Belalia <16493223+s77rt@users.noreply.github.com>
Date: Thu, 3 Aug 2023 10:29:34 +0100
Subject: [PATCH 1/3] use ScreenWrapper only if editing

---
 src/pages/iou/steps/MoneyRequestAmount.js | 128 ++++++++++++----------
 1 file changed, 68 insertions(+), 60 deletions(-)

diff --git a/src/pages/iou/steps/MoneyRequestAmount.js b/src/pages/iou/steps/MoneyRequestAmount.js
index c455cbc84c88..058d029feb6c 100755
--- a/src/pages/iou/steps/MoneyRequestAmount.js
+++ b/src/pages/iou/steps/MoneyRequestAmount.js
@@ -419,69 +419,77 @@ function MoneyRequestAmount(props) {
     const formattedAmount = replaceAllDigits(amount, toLocaleDigit);
     const buttonText = isEditing.current ? translate('common.save') : translate('common.next');
 
-    return (
-        <FullPageNotFoundView shouldShow={!IOUUtils.isValidMoneyRequestType(iouType.current)}>
-            <ScreenWrapper
-                includeSafeAreaPaddingBottom={false}
-                onEntryTransitionEnd={focusTextInput}
+    const content = (
+        <>
+            <View
+                nativeID={amountViewID}
+                onMouseDown={(event) => onMouseDown(event, [amountViewID])}
+                style={[styles.flex1, styles.flexRow, styles.w100, styles.alignItemsCenter, styles.justifyContentCenter]}
+            >
+                <TextInputWithCurrencySymbol
+                    formattedAmount={formattedAmount}
+                    onChangeAmount={updateAmount}
+                    onCurrencyButtonPress={navigateToCurrencySelectionPage}
+                    placeholder={numberFormat(0)}
+                    ref={(el) => (textInput.current = el)}
+                    selectedCurrencyCode={selectedCurrencyCode}
+                    selection={selection}
+                    onSelectionChange={(e) => {
+                        if (!shouldUpdateSelection) {
+                            return;
+                        }
+                        setSelection(e.nativeEvent.selection);
+                    }}
+                />
+            </View>
+            <View
+                onMouseDown={(event) => onMouseDown(event, [numPadContainerViewID, numPadViewID])}
+                style={[styles.w100, styles.justifyContentEnd, styles.pageWrapper]}
+                nativeID={numPadContainerViewID}
             >
-                {({safeAreaPaddingBottomStyle}) => (
+                {DeviceCapabilities.canUseTouchScreen() ? (
+                    <BigNumberPad
+                        nativeID={numPadViewID}
+                        numberPressed={updateAmountNumberPad}
+                        longPressHandlerStateChanged={updateLongPressHandlerState}
+                    />
+                ) : (
+                    <View />
+                )}
+
+                <Button
+                    success
+                    style={[styles.w100, styles.mt5]}
+                    onPress={navigateToNextPage}
+                    pressOnEnter
+                    isDisabled={!amount.length || parseFloat(amount) < 0.01}
+                    text={buttonText}
+                />
+            </View>
+        </>
+    );
+
+    if (!isEditing.current) {
+        return content;
+    }
+
+    return (
+        <ScreenWrapper
+            includeSafeAreaPaddingBottom={false}
+            onEntryTransitionEnd={focusTextInput}
+        >
+            {({safeAreaPaddingBottomStyle}) => (
+                <FullPageNotFoundView shouldShow={!IOUUtils.isValidMoneyRequestType(iouType.current)}>
                     <View style={[styles.flex1, safeAreaPaddingBottomStyle]}>
-                        {isEditing.current && (
-                            <HeaderWithBackButton
-                                title={titleForStep}
-                                onBackButtonPress={navigateBack}
-                            />
-                        )}
-                        <View
-                            nativeID={amountViewID}
-                            onMouseDown={(event) => onMouseDown(event, [amountViewID])}
-                            style={[styles.flex1, styles.flexRow, styles.w100, styles.alignItemsCenter, styles.justifyContentCenter]}
-                        >
-                            <TextInputWithCurrencySymbol
-                                formattedAmount={formattedAmount}
-                                onChangeAmount={updateAmount}
-                                onCurrencyButtonPress={navigateToCurrencySelectionPage}
-                                placeholder={numberFormat(0)}
-                                ref={(el) => (textInput.current = el)}
-                                selectedCurrencyCode={selectedCurrencyCode}
-                                selection={selection}
-                                onSelectionChange={(e) => {
-                                    if (!shouldUpdateSelection) {
-                                        return;
-                                    }
-                                    setSelection(e.nativeEvent.selection);
-                                }}
-                            />
-                        </View>
-                        <View
-                            onMouseDown={(event) => onMouseDown(event, [numPadContainerViewID, numPadViewID])}
-                            style={[styles.w100, styles.justifyContentEnd, styles.pageWrapper]}
-                            nativeID={numPadContainerViewID}
-                        >
-                            {DeviceCapabilities.canUseTouchScreen() ? (
-                                <BigNumberPad
-                                    nativeID={numPadViewID}
-                                    numberPressed={updateAmountNumberPad}
-                                    longPressHandlerStateChanged={updateLongPressHandlerState}
-                                />
-                            ) : (
-                                <View />
-                            )}
-
-                            <Button
-                                success
-                                style={[styles.w100, styles.mt5]}
-                                onPress={navigateToNextPage}
-                                pressOnEnter
-                                isDisabled={!amount.length || parseFloat(amount) < 0.01}
-                                text={buttonText}
-                            />
-                        </View>
+                        <HeaderWithBackButton
+                            title={titleForStep}
+                            onBackButtonPress={navigateBack}
+                        />
+                        {content}
                     </View>
-                )}
-            </ScreenWrapper>
-        </FullPageNotFoundView>
+                </FullPageNotFoundView>
+            )}
+        </ScreenWrapper>
     );
 }
 

From d070db30f8b20863d9653bb7ba25c27a291028e0 Mon Sep 17 00:00:00 2001
From: Abdelhafidh Belalia <16493223+s77rt@users.noreply.github.com>
Date: Thu, 3 Aug 2023 12:56:53 +0100
Subject: [PATCH 2/3] Update MoneyRequestAmount.js

---
 src/pages/iou/steps/MoneyRequestAmount.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/pages/iou/steps/MoneyRequestAmount.js b/src/pages/iou/steps/MoneyRequestAmount.js
index 058d029feb6c..1bb3dbbb6ed8 100755
--- a/src/pages/iou/steps/MoneyRequestAmount.js
+++ b/src/pages/iou/steps/MoneyRequestAmount.js
@@ -469,6 +469,8 @@ function MoneyRequestAmount(props) {
         </>
     );
 
+    // ScreenWrapper is only needed in edit mode because we have a dedicated route for the edit amount page (MoneyRequestEditAmountPage).
+    // The rest of the cases this component is rendered through <MoneyRequestSelectorPage /> which has it's own ScreenWrapper 
     if (!isEditing.current) {
         return content;
     }

From 08bbe41c7babf5bb144d64312960cc5075db78b9 Mon Sep 17 00:00:00 2001
From: Abdelhafidh Belalia <16493223+s77rt@users.noreply.github.com>
Date: Thu, 3 Aug 2023 13:05:15 +0100
Subject: [PATCH 3/3] prettier

---
 src/pages/iou/steps/MoneyRequestAmount.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/iou/steps/MoneyRequestAmount.js b/src/pages/iou/steps/MoneyRequestAmount.js
index 1bb3dbbb6ed8..966f8068ea21 100755
--- a/src/pages/iou/steps/MoneyRequestAmount.js
+++ b/src/pages/iou/steps/MoneyRequestAmount.js
@@ -470,7 +470,7 @@ function MoneyRequestAmount(props) {
     );
 
     // ScreenWrapper is only needed in edit mode because we have a dedicated route for the edit amount page (MoneyRequestEditAmountPage).
-    // The rest of the cases this component is rendered through <MoneyRequestSelectorPage /> which has it's own ScreenWrapper 
+    // The rest of the cases this component is rendered through <MoneyRequestSelectorPage /> which has it's own ScreenWrapper
     if (!isEditing.current) {
         return content;
     }