Create new Payment ButtonWithMenu and add it to the Confirm Page #3866

nickmurray47 · 2021-07-02T16:32:43Z

Details

Adds the Send Money option behind a beta to the DM and Global menu. Refactors the use of a string 'send' to be a CONST. Adds a new component ButtonWithMenu to display the list of available payment methods if a user is making a Send Money request.

Fixed Issues

$ https://github.com/Expensify/Expensify/issues/169175

Tests / QA Steps

If testing on staging, then you'll need to be added to the SendMoney Beta

Verify Send money appears in menus

Login to account A with an existing wallet
Click on the global create menu and verify the Send money option appears

Go into a DM with account B, click on the menu and verify the Send money option appears there

Verify dropdown menu includes payment options

From the DM, click the Send Money option, enter an amount, then on the confirmation page, verify that a dropdown button menu appears with at least two options (Pay with Expensify and I'll settle up elsewhere).
From account B in a separate window, add a PayPalMe address.
From account A, attempt to Send Money to account B again and verify that the PayPalMe option appears from the dropdown payment options

(If testing on a real device) Add a phone number to account B, download Venmo from the app store, then verify the Venmo option appears.

Check for regressions
8. (Checking for regressions) From the DM, click the Request option, follow the full flow and make sure the confirmation button says Request $X.

(Checking for regressions) From the global create, click the Split option, follow the full flow and make sure the confirmation button says Split $X

Tested On

Screenshots

Web

See above

Mobile Web

Desktop

iOS

Android

nickmurray47 · 2021-08-05T16:52:46Z

this is ready for review @madmax330 and @mountiny going to add you as a reviewer too

src/libs/Permissions.js

src/components/IOUConfirmationList.js

mountiny

Overall the code looks good to me. I have left couple of comments, but also I was not sure if this is good to review of if it is on HOLD as there is hold mentioned in the PR body.

Let me know if it good for testing and final reviews. Then we can add it to the other PR and test it with it.

…participants personal details

mountiny

Looks great to me! I feel like it will be way easier to test for any regressions together with the other PRs like this: #4329

stitesExpensify · 2021-09-30T17:15:32Z

Some more testing problems,

I can't get PayPal to show up (both accounts I'm testing with have paypal payment methods)
When I choose "send money" it requests money instead

nickmurray47 · 2021-09-30T19:52:58Z

Some more testing problems,

I can't get PayPal to show up (both accounts I'm testing with have paypal payment methods)

When I choose "send money" it requests money instead

I'm re-testing the full flow now. PayPal not showing up might be related to not having updated Auth in a while since we recently included the PayPal username in the personal details that get pulled down.

For 2. if you follow the full flow, it will "request" money at the end if that's what you're referring to. This PR will connect the API command properly and this PR just puts "send money" in as an option.

nickmurray47 · 2021-09-30T20:19:37Z

Found the issue with the PayPal address, updating shortly

…perly set

nickmurray47 · 2021-09-30T20:54:34Z

PayPal appears properly now after adding it to the formatPersonalDetails function.

Also just wanted to make a note on testing makeCancellablePromise for the context in this PR when we check to see if Venmo is installed locally. On a dev simulator, we can't, unfortunately, add Venmo from the App Store so the promise will never successfully complete, but if we add a log line to makeCancellablePromise like so and quickly exit the confirmation page we can see the promise does get cancelled properly when the component unmounts.

nickmurray47 · 2021-09-30T21:41:54Z

Ready for another round! Appreciate the patience, guys!

shawnborton · 2021-10-01T08:14:13Z

Could you update the screenshots in the original comment? For example, this screenshot here:

Looks incorrect - but later on, the screenshot you posted here:

Looks good - as the menu should float above the green button and not overlap it.

stitesExpensify · 2021-10-01T19:50:06Z

Also just wanted to make a note on testing makeCancellablePromise for the context in this PR when we check to see if Venmo is installed locally. On a dev simulator, we can't, unfortunately, add Venmo from the App Store so the promise will never successfully complete, but if we add a log line to makeCancellablePromise like so and quickly exit the confirmation page we can see the promise does get cancelled properly when the component unmounts.

Thanks for confirming this 👍

stitesExpensify · 2021-10-01T20:35:49Z

Tests are 🟢 besides what I mentioned with it actually requesting money.

For 2. if you follow the full flow, it will "request" money at the end if that's what you're referring to. This PR will connect the API command properly and this PR just puts "send money" in as an option.

Should this be behind a beta then since it doesn't actually send money? Or are we just shipping it "broken"

nickmurray47 · 2021-10-01T21:17:50Z

Should this be behind a beta then since it doesn't actually send money? Or are we just shipping it "broken"

Yup, this whole flow is behind a beta flag! Both the global create and DM menus have ...(Permissions.canUseIOUSend(this.props.betas) for the send money option so the flow will only be available to Expensify employees @stitesExpensify

nickmurray47 · 2021-10-01T21:18:59Z

src/pages/home/report/ReportActionCompose.js

@@ -560,6 +560,19 @@ class ReportActionCompose extends React.Component {
                                                                    },
                                                                },
                                                        ] : []),
+                                                    ...(Permissions.canUseIOUSend(this.props.betas) && !hasMultipleParticipants ? [


Beta flag here for the DM menu

nickmurray47 · 2021-10-01T21:19:23Z

src/pages/home/sidebar/SidebarScreen.js

@@ -158,6 +159,13 @@ class SidebarScreen extends Component {
                                    text: this.props.translate('sidebarScreen.newGroup'),
                                    onSelected: () => Navigation.navigate(ROUTES.NEW_GROUP),
                                },
+                                ...(Permissions.canUseIOUSend(this.props.betas) ? [


And the other flag here

stitesExpensify · 2021-10-01T21:24:57Z

lol. I was just going through the code for a final review and realized that :ohnothing: Ignore me!

stitesExpensify · 2021-10-01T21:36:58Z

All you @mountiny @madmax330 !

mountiny

Great job on this one @nickmurray47 and also great learning experience to see your review @stitesExpensify! I don't see anything bad in the code now, so all yours @madmax330!

OSBotify · 2021-10-04T11:03:38Z

✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release.

OSBotify · 2021-10-04T20:07:20Z

🚀 Deployed to staging by @madmax330 in version: 1.1.4-1 🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅

OSBotify · 2021-10-06T17:22:31Z

🚀 Deployed to production by @chiragsalian in version: 1.1.5-1 🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅

luacmartins · 2023-02-14T12:53:40Z

I believe this PR introduced this bug: #14305. We are storing a translated text in state and only updating defaultButtonOption in the constructor, which prevents it to update to the latest selected language.

github-actions · 2023-02-14T12:54:00Z

CLA Assistant Lite bot:
Thank you for your submission, we really appreciate it. Like many open-source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution. You can sign the CLA by just posting a Pull Request Comment same as the below format.

I have read the CLA Document and I hereby sign the CLA

Nicholas Murray seems not to be a GitHub user. You need a GitHub account to be able to sign the CLA. If you have already a GitHub account, please add the email address used for this commit to your account.
_{You can retrigger this bot by commenting recheck in this Pull Request}

Added new ButtonWithMenu component

15e9e45

nickmurray47 requested a review from a team as a code owner July 2, 2021 16:32

nickmurray47 self-assigned this Jul 2, 2021

MelvinBot requested review from madmax330 and removed request for a team July 2, 2021 16:33

nickmurray47 changed the title ~~Create new Payment ButtonWithMenu and add it to the Confirm Page~~ [WIP] Create new Payment ButtonWithMenu and add it to the Confirm Page Jul 2, 2021

Nicholas Murray added 8 commits July 18, 2021 15:50

Add to beta and menus

09e1101

Change ordering

b64b871

Merge branch 'main' into nmurray-buttonwithmenu

98b72b1

Update confirmation page with buttons

33395f0

Merge send money menus

9c6a7f9

Delete extra space

25884f9

Merge main

38ec340

Refactor with CONST

a1468ec

nickmurray47 changed the title ~~[WIP] Create new Payment ButtonWithMenu and add it to the Confirm Page~~ Create new Payment ButtonWithMenu and add it to the Confirm Page Aug 4, 2021

nickmurray47 requested a review from mountiny August 5, 2021 16:53

mountiny requested changes Aug 6, 2021

View reviewed changes

src/libs/Permissions.js Outdated Show resolved Hide resolved

nickmurray47 mentioned this pull request Aug 6, 2021

Adjusting IOUModal and adding createAndPayIOU #4329

Merged

5 tasks

Switch to correct beta

a6398c1

nickmurray47 changed the title ~~Create new Payment ButtonWithMenu and add it to the Confirm Page~~ [HOLD] Create new Payment ButtonWithMenu and add it to the Confirm Page Aug 6, 2021

nickmurray47 changed the title ~~[HOLD] Create new Payment ButtonWithMenu and add it to the Confirm Page~~ Create new Payment ButtonWithMenu and add it to the Confirm Page Sep 14, 2021

Merge main

f55e1d5

mountiny reviewed Sep 18, 2021

View reviewed changes

src/components/IOUConfirmationList.js Outdated Show resolved Hide resolved

mountiny reviewed Sep 19, 2021

View reviewed changes

src/components/IOUConfirmationList.js Outdated Show resolved Hide resolved

mountiny reviewed Sep 19, 2021

View reviewed changes

Nicholas Murray added 4 commits September 20, 2021 10:22

Commenting out extra props

861957b

Change to retrieving PayPal and PhoneNumber submitter variables from …

5b36cff

…participants personal details

Flow works with buttonmenu and paypal

29e2e89

Style and clean-up onyx key

a2d3027

mountiny previously approved these changes Sep 30, 2021

View reviewed changes

Nicholas Murray added 2 commits September 30, 2021 13:34

Add payPal and phoneNumber to formatPersonalDetails

3459cc0

Add trailing comma and make sure checkVenmoAvailabilityPromise is pro…

73688a9

…perly set

nickmurray47 dismissed mountiny’s stale review via 73688a9 September 30, 2021 20:46

nickmurray47 commented Oct 1, 2021

View reviewed changes

stitesExpensify approved these changes Oct 1, 2021

View reviewed changes

mountiny self-requested a review October 4, 2021 06:38

mountiny approved these changes Oct 4, 2021

View reviewed changes

madmax330 approved these changes Oct 4, 2021

View reviewed changes

madmax330 merged commit 612d397 into main Oct 4, 2021

madmax330 deleted the nmurray-buttonwithmenu branch October 4, 2021 11:02

OSBotify mentioned this pull request Oct 4, 2021

Deploy Checklist: New Expensify 2021-10-04 #5636

Closed

13 tasks

nickmurray47 mentioned this pull request Oct 5, 2021

Android - Venmo - Button has dropdown menu with options in the final confirmation page #5655

Closed

luacmartins mentioned this pull request Feb 14, 2023

[HOLD for payment 2023-01-30] Text on Button "I'll settle up elsewhere" on Send Money page not changing to new selected language #14305

Closed

1 task

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Create new Payment ButtonWithMenu and add it to the Confirm Page #3866

Create new Payment ButtonWithMenu and add it to the Confirm Page #3866

nickmurray47 commented Jul 2, 2021 •

edited

Loading

nickmurray47 commented Aug 5, 2021

mountiny left a comment

mountiny left a comment

stitesExpensify commented Sep 30, 2021

nickmurray47 commented Sep 30, 2021 •

edited

Loading

nickmurray47 commented Sep 30, 2021

nickmurray47 commented Sep 30, 2021 •

edited

Loading

nickmurray47 commented Sep 30, 2021

shawnborton commented Oct 1, 2021

stitesExpensify commented Oct 1, 2021

stitesExpensify commented Oct 1, 2021

nickmurray47 commented Oct 1, 2021 •

edited

Loading

nickmurray47 Oct 1, 2021

nickmurray47 Oct 1, 2021

stitesExpensify commented Oct 1, 2021

stitesExpensify commented Oct 1, 2021

mountiny left a comment

OSBotify commented Oct 4, 2021

OSBotify commented Oct 4, 2021

OSBotify commented Oct 6, 2021

luacmartins commented Feb 14, 2023 •

edited

Loading

github-actions bot commented Feb 14, 2023

Create new Payment ButtonWithMenu and add it to the Confirm Page #3866

Create new Payment ButtonWithMenu and add it to the Confirm Page #3866

Conversation

nickmurray47 commented Jul 2, 2021 • edited Loading

Details

Fixed Issues

Tests / QA Steps

Tested On

Screenshots

Web

Mobile Web

Desktop

iOS

Android

nickmurray47 commented Aug 5, 2021

mountiny left a comment

Choose a reason for hiding this comment

mountiny left a comment

Choose a reason for hiding this comment

stitesExpensify commented Sep 30, 2021

nickmurray47 commented Sep 30, 2021 • edited Loading

nickmurray47 commented Sep 30, 2021

nickmurray47 commented Sep 30, 2021 • edited Loading

nickmurray47 commented Sep 30, 2021

shawnborton commented Oct 1, 2021

stitesExpensify commented Oct 1, 2021

stitesExpensify commented Oct 1, 2021

nickmurray47 commented Oct 1, 2021 • edited Loading

nickmurray47 Oct 1, 2021

Choose a reason for hiding this comment

nickmurray47 Oct 1, 2021

Choose a reason for hiding this comment

stitesExpensify commented Oct 1, 2021

stitesExpensify commented Oct 1, 2021

mountiny left a comment

Choose a reason for hiding this comment

OSBotify commented Oct 4, 2021

OSBotify commented Oct 4, 2021

OSBotify commented Oct 6, 2021

luacmartins commented Feb 14, 2023 • edited Loading

github-actions bot commented Feb 14, 2023

nickmurray47 commented Jul 2, 2021 •

edited

Loading

nickmurray47 commented Sep 30, 2021 •

edited

Loading

nickmurray47 commented Sep 30, 2021 •

edited

Loading

nickmurray47 commented Oct 1, 2021 •

edited

Loading

luacmartins commented Feb 14, 2023 •

edited

Loading