From 352d844eebb90b0cb62d1555e8806552e0250688 Mon Sep 17 00:00:00 2001
From: Krishna Gupta <belivethatkg@gmail.com>
Date: Tue, 23 Apr 2024 02:16:54 +0530
Subject: [PATCH 1/2] fix: Quick action - 'Pay elsewhere' button is small when
 paying someone via Quick action.

Signed-off-by: Krishna Gupta <belivethatkg@gmail.com>
---
 src/components/ButtonWithDropdownMenu/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx
index a4e6e2c87fec..e516b415786e 100644
--- a/src/components/ButtonWithDropdownMenu/index.tsx
+++ b/src/components/ButtonWithDropdownMenu/index.tsx
@@ -66,7 +66,7 @@ function ButtonWithDropdownMenu<IValueType>({
     }, [windowWidth, windowHeight, isMenuVisible, anchorAlignment.vertical]);
 
     return (
-        <View style={wrapperStyle}>
+        <View style={[styles.w100, wrapperStyle]}>
             {shouldAlwaysShowDropdownMenu || options.length > 1 ? (
                 <View style={[styles.flexRow, styles.justifyContentBetween, styles.alignItemsCenter, style]}>
                     <Button

From 83acd68bb285665e6d03caf8091521fc92bed306 Mon Sep 17 00:00:00 2001
From: Krishna Gupta <belivethatkg@gmail.com>
Date: Tue, 23 Apr 2024 02:39:35 +0530
Subject: [PATCH 2/2] wrap SettlementButton with View.

Signed-off-by: Krishna Gupta <belivethatkg@gmail.com>
---
 .../ButtonWithDropdownMenu/index.tsx          |  2 +-
 .../iou/steps/MoneyRequestAmountForm.tsx      | 72 ++++++++++---------
 2 files changed, 38 insertions(+), 36 deletions(-)

diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx
index e516b415786e..a4e6e2c87fec 100644
--- a/src/components/ButtonWithDropdownMenu/index.tsx
+++ b/src/components/ButtonWithDropdownMenu/index.tsx
@@ -66,7 +66,7 @@ function ButtonWithDropdownMenu<IValueType>({
     }, [windowWidth, windowHeight, isMenuVisible, anchorAlignment.vertical]);
 
     return (
-        <View style={[styles.w100, wrapperStyle]}>
+        <View style={wrapperStyle}>
             {shouldAlwaysShowDropdownMenu || options.length > 1 ? (
                 <View style={[styles.flexRow, styles.justifyContentBetween, styles.alignItemsCenter, style]}>
                     <Button
diff --git a/src/pages/iou/steps/MoneyRequestAmountForm.tsx b/src/pages/iou/steps/MoneyRequestAmountForm.tsx
index 5727351f45da..4207b3bdfdff 100644
--- a/src/pages/iou/steps/MoneyRequestAmountForm.tsx
+++ b/src/pages/iou/steps/MoneyRequestAmountForm.tsx
@@ -387,41 +387,43 @@ function MoneyRequestAmountForm(
                         longPressHandlerStateChanged={updateLongPressHandlerState}
                     />
                 ) : null}
-                {iouType === CONST.IOU.TYPE.PAY && skipConfirmation ? (
-                    <SettlementButton
-                        pressOnEnter
-                        onPress={submitAndNavigateToNextPage}
-                        enablePaymentsRoute={ROUTES.IOU_SEND_ENABLE_PAYMENTS}
-                        addBankAccountRoute={bankAccountRoute}
-                        addDebitCardRoute={ROUTES.IOU_SEND_ADD_DEBIT_CARD}
-                        currency={currency ?? CONST.CURRENCY.USD}
-                        policyID={policyID ?? ''}
-                        style={[styles.w100, canUseTouchScreen ? styles.mt5 : styles.mt3]}
-                        buttonSize={CONST.DROPDOWN_BUTTON_SIZE.LARGE}
-                        kycWallAnchorAlignment={{
-                            horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.LEFT,
-                            vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.BOTTOM,
-                        }}
-                        paymentMethodDropdownAnchorAlignment={{
-                            horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.RIGHT,
-                            vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.BOTTOM,
-                        }}
-                        shouldShowPersonalBankAccountOption
-                        enterKeyEventListenerPriority={1}
-                    />
-                ) : (
-                    <Button
-                        success
-                        // Prevent bubbling on edit amount Page to prevent double page submission when two CTA are stacked.
-                        allowBubble={!isEditing}
-                        pressOnEnter
-                        medium={isExtraSmallScreenHeight}
-                        large={!isExtraSmallScreenHeight}
-                        style={[styles.w100, canUseTouchScreen ? styles.mt5 : styles.mt3]}
-                        onPress={() => submitAndNavigateToNextPage()}
-                        text={buttonText}
-                    />
-                )}
+                <View style={styles.w100}>
+                    {iouType === CONST.IOU.TYPE.PAY && skipConfirmation ? (
+                        <SettlementButton
+                            pressOnEnter
+                            onPress={submitAndNavigateToNextPage}
+                            enablePaymentsRoute={ROUTES.IOU_SEND_ENABLE_PAYMENTS}
+                            addBankAccountRoute={bankAccountRoute}
+                            addDebitCardRoute={ROUTES.IOU_SEND_ADD_DEBIT_CARD}
+                            currency={currency ?? CONST.CURRENCY.USD}
+                            policyID={policyID ?? ''}
+                            style={[styles.w100, canUseTouchScreen ? styles.mt5 : styles.mt3]}
+                            buttonSize={CONST.DROPDOWN_BUTTON_SIZE.LARGE}
+                            kycWallAnchorAlignment={{
+                                horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.LEFT,
+                                vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.BOTTOM,
+                            }}
+                            paymentMethodDropdownAnchorAlignment={{
+                                horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.RIGHT,
+                                vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.BOTTOM,
+                            }}
+                            shouldShowPersonalBankAccountOption
+                            enterKeyEventListenerPriority={1}
+                        />
+                    ) : (
+                        <Button
+                            success
+                            // Prevent bubbling on edit amount Page to prevent double page submission when two CTA are stacked.
+                            allowBubble={!isEditing}
+                            pressOnEnter
+                            medium={isExtraSmallScreenHeight}
+                            large={!isExtraSmallScreenHeight}
+                            style={[styles.w100, canUseTouchScreen ? styles.mt5 : styles.mt3]}
+                            onPress={() => submitAndNavigateToNextPage()}
+                            text={buttonText}
+                        />
+                    )}
+                </View>
             </View>
         </ScrollView>
     );