Merge pull request #8410 from phivh/fix/hide-make-payment-default

Fix make default payment
Expensify · Apr 6, 2022 · 120e03a · 120e03a
2 parents b1e82bc + e97b620
commit 120e03a
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 4 deletions.
diff --git a/src/pages/settings/Payments/PaymentMethodList.js b/src/pages/settings/Payments/PaymentMethodList.js
@@ -130,7 +130,7 @@ class PaymentMethodList extends Component {
         combinedPaymentMethods = _.map(combinedPaymentMethods, paymentMethod => ({
             ...paymentMethod,
             type: MENU_ITEM,
-            onPress: e => this.props.onPress(e, paymentMethod.accountType, paymentMethod.accountData),
+            onPress: e => this.props.onPress(e, paymentMethod.accountType, paymentMethod.accountData, paymentMethod.isDefault),
             iconFill: this.isPaymentMethodActive(paymentMethod) ? StyleUtils.getIconFillColor(CONST.BUTTON_STATES.PRESSED) : null,
             wrapperStyle: this.isPaymentMethodActive(paymentMethod) ? [StyleUtils.getButtonBackgroundColorStyle(CONST.BUTTON_STATES.PRESSED)] : null,
         }));

diff --git a/src/pages/settings/Payments/PaymentsPage/BasePaymentsPage.js b/src/pages/settings/Payments/PaymentsPage/BasePaymentsPage.js
@@ -40,6 +40,7 @@ class BasePaymentsPage extends React.Component {
             shouldShowDefaultDeleteMenu: false,
             shouldShowPasswordPrompt: false,
             shouldShowConfirmPopover: false,
+            isSelectedPaymentMethodDefault: false,
             selectedPaymentMethod: {},
             formattedSelectedPaymentMethod: {},
             anchorPositionTop: 0,
@@ -112,8 +113,9 @@ class BasePaymentsPage extends React.Component {
      * @param {Object} nativeEvent
      * @param {String} accountType
      * @param {String} account
+     * @param {Boolean} isDefault
      */
-    paymentMethodPressed(nativeEvent, accountType, account) {
+    paymentMethodPressed(nativeEvent, accountType, account, isDefault) {
         const position = getClickedElementLocation(nativeEvent);
         this.setState({
             addPaymentMethodButton: nativeEvent,
@@ -143,6 +145,7 @@ class BasePaymentsPage extends React.Component {
                 };
             }
             this.setState({
+                isSelectedPaymentMethodDefault: isDefault,
                 shouldShowDefaultDeleteMenu: true,
                 selectedPaymentMethod: account,
                 selectedPaymentMethodType: accountType,
@@ -229,6 +232,7 @@ class BasePaymentsPage extends React.Component {
 
     render() {
         const isPayPalMeSelected = this.state.formattedSelectedPaymentMethod.type === CONST.PAYMENT_METHODS.PAYPAL;
+        const shouldShowMakeDefaultButton = !this.state.isSelectedPaymentMethodDefault && Permissions.canUseWallet(this.props.betas) && !isPayPalMeSelected;
 
         // Determines whether or not the modal popup is mounted from the bottom of the screen instead of the side mount on Web or Desktop screens
         const isPopoverBottomMount = this.state.anchorPositionTop === 0 || this.props.isSmallScreenWidth;
@@ -318,7 +322,7 @@ class BasePaymentsPage extends React.Component {
                                     interactive={false}
                                 />
                             )}
-                            {Permissions.canUseWallet(this.props.betas) && !isPayPalMeSelected && (
+                            {shouldShowMakeDefaultButton && (
                                 <TouchableOpacity
                                     onPress={() => {
                                         this.setState({
@@ -356,7 +360,7 @@ class BasePaymentsPage extends React.Component {
                                 style={[
                                     styles.button,
                                     styles.buttonDanger,
-                                    Permissions.canUseWallet(this.props.betas) && !isPayPalMeSelected && styles.mt4,
+                                    shouldShowMakeDefaultButton && styles.mt4,
                                     styles.alignSelfCenter,
                                     styles.w100,
                                 ]}