App: HIGH [$500]: Clean up the payment options on Pay button in New Dot
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:
- Submit a request as User A to User B
- As User B click “Pay with Expensify” on the request (Do nothing)
- 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 accountPay with personal bank accountPay with debit cardPay 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?
- Android: Native
- Android: mWeb Chrome
- iOS: Native
- iOS: mWeb Safari
- MacOS: Chrome / Safari
- MacOS: Desktop
Upwork Automation - Do Not Edit
- Upwork Job URL: https://www.upwork.com/jobs/~016cb0dade2c28979f
- Upwork Job ID: 1758260187340271616
- Last Price Increase: 2024-02-15
About this issue
- Original URL
- State: open
- Created 5 months ago
- Comments: 57 (43 by maintainers)
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
TY! I’ll bump the message to other channels if it doesn’t get any traction.
Looking into the proposals today 👀
reached out to
#expensify-open-sourcein slack to see if anyone has any ideas: https://expensify.slack.com/archives/C01GTK53T8Q/p1713819425837679Seems like we have a lot of thumbs, let’s do it
My thinking is that if you have never added a payment option, we could just use a generic phrase like “Pay $XX” and tapping that part of the button, or the arrow, would launch the same menu of all options. Does that make sense and sound like a good idea?
@shawnborton Yeah I think so.
The only thing I would add is: do we want to clarify the specific payment method used last vs just
Pay with Expensify? So perhaps something likePay with Bortibank (1234)orPay with Visa (5678)? Or would tappingPay with Expensifyjust bring up any of those options you already have stored?Yeah, based on what we are discussing, the idea is that the large part of the Split button is for the last used option, and the arrow shows all available options. In the case where it’s a first time user, both parts of the button show the same drop down menu but perhaps the big part’s label just says “Pay $XX”
So to make that more clear:
Does that capture it correctly @anmurali @dannymcclain?
I’m not sure I understand the question (or the system enough maybe 😅). feel free to tag @allroundexperts in a comment on your PR if you did something but aren’t sure about it and we can discuss it there.
Generally, we want PRs to be very thorough. But curious what @allroundexperts and @bondydaa think about this specific question , as I’m not exactly sure of the implications of the two options here.
📣 @brandonhenry You have been assigned to this job! Please apply to the Upwork job and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑💻 Once you apply to this job, your Upwork ID will be stored and you will be automatically hired for future jobs! Keep in mind: Code of Conduct | Contributing 📖
Thanks for your proposals everyone. While @ikevin127 seems to be moving on in the right direction, I feel like his proposal is too abstract.
@brandonhenry’s proposal on the other hand has a lot more detail on how he’ll be achieving the unification of the payment options. As such, let’s go with them.
🎀 👀 🎀 C+ reviewed
@all for your proposals, please be sure you have looked at the code and understand how the
KYCPaywallis used and what refactorings are necessary to have all options be in a single dropdown. You can see my comments in https://github.com/Expensify/App/issues/33967#issuecomment-1915035254 for a little more context.