[$250] Expense - Payment sound triggered prematurely when submitting a held expense.

[lanitochka17]

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: 9.0.46-5 Reproducible in staging?: Y Reproducible in production?: Y If this was caught during regression testing, add the test name, ID and link from TestRail: N/A Email or phone of affected tester (no customers): biruknew45+1482@gmail.com Issue reported by: Applause - Internal Team

Action Performed:

1. Go to https://staging.new.expensify.com/
2. Create a workspace
3. Navigate to the workspace chat
4. Submit an expense
5. Right-click on the submitted expense and select hold
6. Click the green "Pay" button
7. Observe that the payment sound is triggered and an additional "Confirm payment amount" modal appears

Expected Result:

For this case the sound indicating a payment should be triggered after the payment is successfully completed. If the expense is on hold, the sound should be delayed until the confirmation is made and finalized

Actual Result:

The payment sound is triggered when the green pay button is clicked, even though the payment is not yet finalized

Workaround:

Unknown

Platforms:

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

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

Screenshots/Videos

Add any screenshot/video evidence

https://github.com/user-attachments/assets/75f672e8-1b8f-4f9e-ba76-68dc6bd3f297

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021846013804908725875
• Upwork Job ID: 1846013804908725875
• Last Price Increase: 2024-10-15

Issue Owner

Current Issue Owner: @abdulrahuman5196

[melvin-bot[bot]]

Triggered auto assignment to @RachCHopkins (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[mkzie2]

Edited by proposal-police: This proposal was edited at 2023-10-10T10:00:00.

Proposal

Please re-state the problem that we are trying to solve in this issue.

The payment sound is triggered when the green pay button is clicked, even though the payment is not yet finalized

What is the root cause of that problem?

We're play sound when after selecting payment type in SettlementButton regardless of the issue is on hold or not:

https://github.com/Expensify/App/blob/420e780c359d861f7a43fda3441104c42ac39225/src/components/SettlementButton/index.tsx#L210

What changes do you think we should make in order to solve the problem?

We should not play sound in SettlementButton when the expense is on hold but play it after confirming in the hold modal instead.

1. Introduce shouldPlaySound in SettlementButton to determine whether to play sound or not
2. In ReportPreview and MoneyReportHeader, pass shouldPlaySound={isAnyTransactionOnHold}, or hasHeldExpenses:

https://github.com/Expensify/App/blob/5b385166612261772ef26e628c5ad60632914454/src/components/MoneyReportHeader.tsx#L146

https://github.com/Expensify/App/blob/5b385166612261772ef26e628c5ad60632914454/src/components/ReportActionItem/ReportPreview.tsx#L204-L205

3. Play the sound when confirming the hold modal if we PAY the expense:

https://github.com/Expensify/App/blob/c0d26c570c488d7f6bc289996e1c60e30d3bf97f/src/components/ProcessMoneyReportHoldMenu.tsx#L69

[etCoderDysto]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Payment sound triggered prematurely when submitting a held expense.

What is the root cause of that problem?

When user clicks pay button while request is on hold we call playSound(SOUNDS.SUCCESS); before calling confirmPayment (onPress(iouPaymentType);) https://github.com/Expensify/App/blob/517ffaaf4aad021872c8c9f1b7e73ae8366fb5ca/src/components/SettlementButton/index.tsx#L210-L211

Here since request is onhold, instead of calling IOU.payMoneyRequest, hold modal will be opened here https://github.com/Expensify/App/blob/517ffaaf4aad021872c8c9f1b7e73ae8366fb5ca/src/components/ReportActionItem/ReportPreview.tsx#L199-L217

Hence the sound is played but not followed by settling the request

What changes do you think we should make in order to solve the problem?

1. Here we should check if the request is held before playing the sound

   if (!ReportUtils.hasHeldExpenses(iouReport?.reportID)) {
           playSound(SOUNDS.SUCCESS);
       }

https://github.com/Expensify/App/blob/517ffaaf4aad021872c8c9f1b7e73ae8366fb5ca/src/components/SettlementButton/index.tsx#L210-L211

2. Play the sound in HoldMenu when user clicks pay button

   playSound(SOUNDS.SUCCESS);
   IOU.payMoneyRequest(paymentType, chatReport, moneyRequestReport, full);

   https://github.com/Expensify/App/blob/517ffaaf4aad021872c8c9f1b7e73ae8366fb5ca/src/components/ProcessMoneyReportHoldMenu.tsx#L76

What alternative solutions did you explore? (Optional)

[bernhardoj]

Edited by proposal-police: This proposal was edited at 2024-10-10 14:11:07 UTC.

Proposal

Please re-state the problem that we are trying to solve in this issue.

Pressing the pay button plays the sound even though a confirm modal shows.

What is the root cause of that problem?

We always play the sound without checking whether there is a held expenses or not. https://github.com/Expensify/App/blob/517ffaaf4aad021872c8c9f1b7e73ae8366fb5ca/src/components/SettlementButton/index.tsx#L210-L211

What changes do you think we should make in order to solve the problem?

Instead of playing the sound when pressing the SettlementButton, we can play it inside the pay function, such as payMoneyRequest, payInvoice, sendMoneyElsewhere, and sendMoneyWithWallet. We will follow the same pattern as completing a task. https://github.com/Expensify/App/blob/517ffaaf4aad021872c8c9f1b7e73ae8366fb5ca/src/libs/actions/Task.ts#L408-L409

[RachCHopkins]

Easy to repro. It sounds when you hit the green button, not when you confirm.

[melvin-bot[bot]]

Job added to Upwork: https://www.upwork.com/jobs/~021846013804908725875

[melvin-bot[bot]]

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