[HOLD for payment 2022-03-22] Payment method preview is clickable for bottom docked modal - reported by @Tushu17

@Tushu17

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

Action Performed:

Open app in mobile/ use expensify in desktop web and decrease the screen size
Go to Settings -> Payment
Add paypal account in add payment method
Select Paypal.me
Click on Paypal.me above delete button.

Expected Result:

Text shouldn't be clickable as it doesn't perform any function.

Actual Result:

It is clickable in small screen and in desktop small screen, cursor is shown as pointer over it.

Workaround:

unknown

Platform:

Where is this issue occurring?

Web
iOS
Android
Desktop App
Mobile Web

Version Number: 1.1.41-0
Reproducible in staging?: Y
Reproducible in production?: Y
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos: Any additional supporting documentation

WhatsApp.Video.2022-02-17.at.4.29.50.PM.mp4

screen-rec3.mp4

Expensify/Expensify Issue URL:
Issue reported by: @Tushu17
Slack conversation: https://expensify.slack.com/archives/C01GTK53T8Q/p1645098315409679

View all open jobs on GitHub

@laurenreidexpensify

Triggered auto assignment to @laurenreidexpensify (AutoAssignerTriage), see https://stackoverflow.com/c/expensify/questions/4749 for more details.

Proposal

We need to pass disabled and interactive={false} to MenuItem below -

App/src/pages/settings/Payments/PaymentsPage/BasePaymentsPage.js

Lines 294 to 299 in 5dab0ff

    
           {isPopoverBottomMount && ( 
        
               <MenuItem 
        
                   title={this.state.formattedSelectedPaymentMethod.title} 
        
                   icon={this.state.formattedSelectedPaymentMethod.icon} 
        
                   description={this.state.formattedSelectedPaymentMethod.description} 
        
                   wrapperStyle={[styles.pv0, styles.ph0, styles.mb4]}

   <MenuItem
       title={this.state.formattedSelectedPaymentMethod.title}
       icon={this.state.formattedSelectedPaymentMethod.icon}
       description={this.state.formattedSelectedPaymentMethod.description}
       wrapperStyle={[styles.pv0, styles.ph0, styles.mb4]}
+      disabled
+      interactive={false}
   />

https://www.upwork.com/jobs/~01a5afd1f614dd5d18

@laurenreidexpensify

Current assignee @laurenreidexpensify is eligible for the External assigner, not assigning anyone new.

@parasharrajat

Triggered auto assignment to Contributor-plus team member for initial proposal review - @parasharrajat (Exported)

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.1.42-6 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

make payment method preview non interactive #8025

If no regressions arise, payment will be issued on 2022-03-22. 🎊

@Tushu17

@Tushu17 sorry I missed this, but as soon as you accept offer I will issue payment in Upwork for $500 for reporting and implementing solution

@laurenreidexpensify

@laurenreidexpensify ok done, I've accepted the offer.

All C and C+ payments have been issued in Upwork 👍🏽

Navigation Menu

Repository navigation

[HOLD for payment 2022-03-22] Payment method preview is clickable for bottom docked modal - reported by @Tushu17 #7972

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platform:

Proposal

15 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

	{isPopoverBottomMount && (
	<MenuItem
	title={this.state.formattedSelectedPaymentMethod.title}
	icon={this.state.formattedSelectedPaymentMethod.icon}
	description={this.state.formattedSelectedPaymentMethod.description}
	wrapperStyle={[styles.pv0, styles.ph0, styles.mb4]}

[HOLD for payment 2022-03-22] Payment method preview is clickable for bottom docked modal - reported by @Tushu17 #7972

Description

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platform:

Activity

MelvinBot commented on Mar 2, 2022

Tushu17 commented on Mar 2, 2022

Proposal

laurenreidexpensify commented on Mar 3, 2022

MelvinBot commented on Mar 3, 2022

MelvinBot commented on Mar 3, 2022

15 remaining items

botify commented on Mar 15, 2022

laurenreidexpensify commented on Mar 22, 2022

Tushu17 commented on Mar 22, 2022

laurenreidexpensify commented on Mar 23, 2022

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions