HIGH [$750]: Clean up the payment options on Pay button in New Dot

[MitchExpensify]

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

---

Version Number: v1.4.39-7 Reproducible in staging?: Y Reproducible in production?: Y Expensify/Expensify Issue URL: https://github.com/Expensify/App/issues/33967 Issue reported by: @anmurali Slack conversation: NA -

Action Performed:

1. Submit a request as User A to User B
2. As User B click "Pay with Expensify" on the request (Do nothing)
3. As User B click the “⌄” down chevron beside "Pay with Expensify" (Do nothing)

Expected Result:

The same options should be presented when clicking "Pay with Expensify" or the “⌄” down chevron beside it.

This is the new design we want to implement lifted from https://github.com/Expensify/App/issues/33967:

Pull all the options into one single dropdown labeled Pay <currency><amount>, which when pressed opens for the user to choose:

Pay with business bank account Pay with personal bank account Pay with debit card Pay elsewhere

• Let's remember payment preference based on the first payment by request type. E.g. IOUs vs Expenses.

Said another way, if you paid an IOU using a debit card, then next time you pay an IOU, unless you pressed on the down caret (dropdown), we assume you mean the same payment device and process the payment with the debit card. But if you then pay an expense in a workspace, we don't assume but ask you to choose a payment method.

• When defaulting payment method for expenses, use the workspace default if one is set in workspace settings.

If there is a default at the workspace level, and the admin has access to that, use that.

• When defaulting payment method for expenses, make it workspace specific.

Said another way, if you pay an expense on workspace A, we default you to that payment device the next time (unless you press the dropdown). But then if you go to pay an expense on workspace B for the first time, we do not assume.

Actual Result:

Two different sets of options are presented to the user:

A:

B:

Workaround:

None

Platforms:

Which of our officially supported platforms is this issue occurring on?

• [x] Android: Native
• [x] Android: mWeb Chrome
• [x] iOS: Native
• [x] iOS: mWeb Safari
• [x] MacOS: Chrome / Safari
• [x] MacOS: Desktop

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~016cb0dade2c28979f
• Upwork Job ID: 1758260187340271616
• Last Price Increase: 2024-06-11

[brandonhenry]

@shawnborton that makes sense to me. I had it like that prior to my recent change. @allroundexperts are you aligned with always showing the option to pay, whether you have payment option added or not

[shawnborton]

Sounds great! Also want to get a gut check from @anmurali and @puneetlath and @Expensify/design that they are on board with this approach too

[brandonhenry]

@expensify/design @anmurali @puneetlath any thoughts on the above comments before I continue implementation?

Cc. @allroundexperts

[shawnborton]

Seems like we have a lot of thumbs, let's do it

[brandonhenry]

Thanks shawn! updating today - still need some type of test card / bank account though

[brandonhenry]

reached out to #expensify-open-source in slack to see if anyone has any ideas: https://expensify.slack.com/archives/C01GTK53T8Q/p1713819425837679

[joekaufmanexpensify]

TY! I'll bump the message to other channels if it doesn't get any traction.

[joekaufmanexpensify]

@allroundexperts @brandonhenry are we close to getting this merged you think?

[allroundexperts]

@joekaufmanexpensify Most of my urgent issues are finished so I should be able to speed things up. Hoping to get this in by this week.

[brandonhenry]

Still awaiting review on this

[joekaufmanexpensify]

Hey @brandonhenry , we were discussing this one internally a bit, and want to make sure our understanding of all of the cases is correct. Could you please outline screenshots/video showing someone paying (both the big part of the pay button, and the arrow options), for the following cases in the issue:

1. No payment method.
2. Has payment method but has never paid before
3. Has payment method and has paid before.

LMK if you have any Q's. TY!

[brandonhenry]

Will do!

[joekaufmanexpensify]

TY!

[joekaufmanexpensify]

@brandonhenry any update on this? I'd like to pass this to the rest of the team as soon as I can.

[davidcardoza]

@brandonhenry Can you please provide an update here?

[brandonhenry]

@davidcardoza @joekaufmanexpensify sorry team. I was affected by the recent natural disaster in NW Houston. I have been without power for 7 days straight and was told ETA for restoration is today. I'm praying I can be back online by tomorrow. Cell service has also been very spotty

Source: https://www.centerpointenergy.com/en-us/corporate/about-us/news/1751

[joekaufmanexpensify]

Sorry to hear that, and hope you're okay! Good luck with everything!

[davidcardoza]

Wow, hope you and your family are doing okay.

[joekaufmanexpensify]

Hey @brandonhenry, checking in. Hope you're doing okay! Are you still working on settling everything related to the natural disaster in Houston? No worries at all, if so, just wanted to see where you're at.

[brandonhenry]

@joekaufmanexpensify yes I am! finally gotten back into the swing of things. Had to catch back up on a lot but I will have updates for this ticket today. Thank you for the patience!

[joekaufmanexpensify]

Course, and thanks for confirming!

[davidcardoza]

@brandonhenry any update on this one?

[brandonhenry]

@davidcardoza update coming here soon.. unfortunately haven't caught a break as my eldest cat got deathly sick out of the blue and had to do emergency vet trip ..

[brandonhenry]

@joekaufmanexpensify @davidcardoza i cannot seem to bypass the identity verification when it comes to adding any payment method? Tried to do a test video for #2 as described here, but I am constantly redirect to identity verification. Any ideas how to test?

https://github.com/Expensify/App/assets/15656774/4f4b0f0e-5b6a-40f0-9fac-e7a873e46822

cc. @mallenexpensify

[brandonhenry]

going to just try to verify my real identity i suppose

[brandonhenry]

looks like there is another ticket that altered the pay button as well?? it was merged before this one.. https://github.com/Expensify/App/pull/41859

How will design change based on this, curious how to proceed? @allroundexperts @davidcardoza @joekaufmanexpensify

Part of me ffeels like we should have made a new button, or not altered the structure of the base settlementbutton because now, the PR changes alter the button everywhere, even if you are not "the receiver on the invoice report preview" as stated in the pull request. curious of thoughts. also tagging @waterim for assistance

[allroundexperts]

@brandonhenry That seems more of a product question. @joekaufmanexpensify Can we clarify the expected behaviour after #41859 got merged?

[joekaufmanexpensify]

Asked internally

[brandonhenry]

i was able to change code to force my wallet enabled. will get videos soon as functionality is confirmed 👍🏿

[davidcardoza]

@brandonhenry, can you explain why you believe the invoice PR you linked will impact all payment buttons everywhere? Our intent of the invoice PR is to isolate the payment experience to invoicing; it won't touch elsewhere.

[brandonhenry]

@davidcardoza i do see the conditional now. I think it is just how i changed the typing of buttonOptions. i reverted that and am not seeing any issues now - good callout.

[brandonhenry]

I'm just going to have to make sure my updates also work with your changes 🍡

[brandonhenry]

@joekaufmanexpensify will get you multiple screens today

Also, as a side note, I think that there has been a lot of new additions and discussion points on this ticket. I'd like to request an increase for the payment just based on complexity and subsequent amount of testing to ensure this works

[brandonhenry]

@joekaufmanexpensify @mallenexpensify @allroundexperts unfortunately, I am still not able to verify functionality here. i even tried to add my real debit card and verify my real info, i am still not able to enable my wallet to test this...

[joekaufmanexpensify]

Also, as a side note, I think that there has been a lot of new additions and discussion points on this ticket. I'd like to request an increase for the payment just based on complexity and subsequent amount of testing to ensure this works

Sure, I can look into this and report back.

[joekaufmanexpensify]

unfortunately, I am still not able to verify functionality here. i even tried to add my real debit card and verify my real info, i am still not able to enable my wallet to test this...

Is this impacting you testing only certain parts of the flow, or basically everything?

[brandonhenry]

@joekaufmanexpensify just certain parts of the flow - specifically my ability to test the changes in this PR. I'd like to record myself making a payment using bank/debit but I can't with my wallet not working..

[joekaufmanexpensify]

Hmmm, got it. If it's only a certain part of the flow, maybe it would be easiest if the internal assigned engineer (@bondydaa) just makes sure that this piece works while reviewing? LMK if you're cool with that Bondy.

I feel like it could be more work to bypass the wallet verification process.

[joekaufmanexpensify]

Also, as a side note, I think that there has been a lot of new additions and discussion points on this ticket. I'd like to request an increase for the payment just based on complexity and subsequent amount of testing to ensure this works

Chatted about this internally, and we landed on bumping the price here to $750!

[melvin-bot[bot]]

Upwork job price has been updated to $750

[joekaufmanexpensify]

As an FYI, I am about to go OOO until 2024-06-25. I don't think payment will be due before then, so not adding an additional BZ assignee. However, if you need anything before then, @davidcardoza or @bondydaa should be able to help.

[davidcardoza]

@brandonhenry Can you please provide ab update when you have a minute?

[brandonhenry]

Working through the last issue on this item today!

[joekaufmanexpensify]

@brandonhenry before we finish the PR, is it possible still to send these screenshots/videos so I can share them with the rest of the team? TY!

[brandonhenry]

@joekaufmanexpensify were you able to find an internal member with access to test purchase details who could assist us here?

[joekaufmanexpensify]

Is that in reference to this?

[davidcardoza]

I am not certain that the need to process a payment is necessary to complete this issue. The pay button experience is used pre-purchase.

[brandonhenry]

@davidcardoza @joekaufmanexpensify yeah i can get 1 and 2, but #3 i can't since i wont be able to make a purchase. will get those screens now

[brandonhenry]

@joekaufmanexpensify @davidcardoza @allroundexperts

1. https://github.com/Expensify/App/assets/15656774/b1cc581c-a801-4ba2-9d9b-454b559e3b73

2. https://github.com/Expensify/App/assets/15656774/3945e1d9-95a1-4c76-93b1-ebba546e3862

Extra:

When viewing an expense report (wallet shouldn't be allowed here based on code in staging):

https://github.com/Expensify/App/assets/15656774/d3156615-067e-447b-9c33-ddf730564e7b

[shawnborton]

Are we able to align the popover to the right-edge of the button below it?