[$500] Inconsistent Usage of 'Paid' and 'Spent' in Request Money Details

[m-natarajan]

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: 1.3.85-0
Reproducible in staging?: y
Reproducible in production?: y
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: @tranvantoan-qn
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1697547094539339

Action Performed:

1. Login to any Account A
2. Click on the FAB button >> select "Send Money"
3. Send Money to any contact using the "Pay elsewhere" option.
4. Observe that on the LHN, the request is displayed as "A paid X"
5. Click on the request to view its details.
6. Observe that the request now shows as "A spent X" - which is inconsistent with the IOU preview.

Expected Result:

The labels 'Paid' or 'Spent' should remain the same both before and after viewing the details

Actual Result:

Inconsistent Usage of 'Paid' and 'Spent' in Request Money Details

Workaround:

unknown

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

Screenshots/Videos

Android: Native

Android.-.Native.mov

Android: mWeb Chrome

Android.-.Chrome.mov

iOS: Native

iOS.-.Native.MP4

iOS: mWeb Safari

MacOS: Chrome / Safari

MacOS.-.Chrome.mp4

Recording.110.mp4

MacOS.-.Safari.mov

MacOS: Desktop

MacOS.-.Desktop.mov

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01c684e7bddef28b1a
• Upwork Job ID: 1714321363006427136
• Last Price Increase: 2023-10-31

[melvin-bot]

Triggered auto assignment to @maddylewis (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[melvin-bot]

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

[melvin-bot]

Bug0 Triage Checklist (Main S/O)

• This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[melvin-bot]

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

[Charan-hs]

Hi @grgia you recently worked on this functionality #29287
I would like to know, is this expected behaviour i'e. it should be like this "A paid x" or "A spent x"

[brunovjk]

Proposal

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

Inconsistent Usage of 'Paid' and 'Spent' in Request Money Details.

What is the root cause of that problem?

When using iou.payerSpentAmount in src/components/ReportActionItem/ReportPreview.js, we are not consistent with the same function:

In getMoneyRequestReportName we return the payerPaidAmountMesssage, but in this case:

App/src/libs/ReportUtils.js

Lines 1436 to 1438 in a24e6a0

	if (hasNonReimbursableTransactions(report.reportID)) {
	return Localize.translateLocal('iou.payerSpentAmount', {payer: payerName, amount: formattedAmount});
	}

We are returning the payerSpentAmount as message.

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

Return iou.payerpaidAmount in order to standardize.

What alternative solutions did you explore? (Optional)

N/A

[melvin-bot]

📣 @brunovjk! 📣
Hey, it seems we don’t have your contributor details yet! You'll only have to do this once, and this is how we'll hire you on Upwork.
Please follow these steps:

1. Make sure you've read and understood the contributing guidelines.
2. Get the email address used to login to your Expensify account. If you don't already have an Expensify account, create one here. If you have multiple accounts (e.g. one for testing), please use your main account email.
3. Get the link to your Upwork profile. It's necessary because we only pay via Upwork. You can access it by logging in, and then clicking on your name. It'll look like this. If you don't already have an account, sign up for one here.
4. Copy the format below and paste it in a comment on this issue. Replace the placeholder text with your actual details.
   
   Format:

Contributor details
Your Expensify account email: <REPLACE EMAIL HERE>
Upwork Profile Link: <REPLACE LINK HERE>

[brunovjk]

Contributor details
Your Expensify account email: brunovjk@gmail.com
Upwork Profile Link: https://www.upwork.com/freelancers/~014c57bd327ebd58f4

[melvin-bot]

✅ Contributor details stored successfully. Thank you for contributing to Expensify!

[tranvantoan-qn]

@Charan-hs the PR you mentioned is related to the Request Money feature, so using Spent seems to be fine

But, In the context of the function Send Money, the word Paid is more appropriate as it signifies a transaction between two accounts, while Spent has a broader, more general meaning. More importantly, it should be used consistently between the IOU preview and the header of the chat report.

[grgia]

More importantly, it should be used consistently between the IOU preview and the header of the chat report.
This was an accurate description!

This is an intentional change. Any IOUs containing non-reimbursable transactions will display "A Spent X". In our use case though, Spent is actually an alternative for Owes not Paid. So Both the LHN and Report Preview should display Paid in this case.

That said, it looks like there's a minor bug where the LHN is displaying the wrong message. I think the problem is somewhere in this logic, though I can't look too deep into it at this moment

App/src/libs/ReportUtils.js

Line 1607 in 6d937cc

if (isSettled(report.reportID)) {

App/src/libs/ReportUtils.js

Line 1619 in 6d937cc

if (report.isWaitingOnBankAccount) {

versus

App/src/components/ReportActionItem/ReportPreview.js

Lines 170 to 172 in 6d937cc

	if (iouSettled || props.iouReport.isWaitingOnBankAccount) {
	paymentVerb = 'iou.payerPaid';
	}

Though you can see in the linked PR where we update these headers. Perhaps we need to create a single function for the name or rename/use getReportPreviewMessage in all cases (LHN, Header, Report Preview, etc)

[Charan-hs]

Proposal

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

Inconsistent Usage of 'Paid' and 'Spent' in Request Money Details

What is the root cause of that problem?

here we are not properly checking for the report like weather it's settled or not then we should check for the Reimbursable. getMoneyRequestReportName set's it message to paid but after checking for other parameters we are modifying it.

Along with this, I think there is a BE problem because
yesterday I tested the same

From the above image, we can notice that the IOU preview is not Loading now and also in the console logged allTransactions for this ReportId. If we notice there reimbursable is set to false.
Again today I tested the same. For now, this issue is not reproducible but

here we can notice that reimbursable is set true so

App/src/libs/ReportUtils.js

Line 1436 in a24e6a0

if (hasNonReimbursableTransactions(report.reportID)) {

this condition is not validated it to true so getMoneyRequestReportName returned message as Paid

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

As here #29796 (comment) mentioned right, we should do the same logic/validatation to check for all Parameters. here we should add new constion to check for the isSettled(report.iouReportID), if it's return true then we should not update this to sent. I also think the same we should extract all this similar flow into one common function or modify this function getMoneyRequestReportName and use it as a common function.

[Charan-hs]

@tranvantoan-qn, @grgia Thanks for the valuable insights

[melvin-bot]

@Ollyws, @grgia, @maddylewis Huh... This is 4 days overdue. Who can take care of this?

[grgia]

@Ollyws do any of the proposals look good to you?

[melvin-bot]

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸

[Ollyws]

Will get to this one asap.

[melvin-bot]

@Ollyws, @grgia, @maddylewis Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[Ollyws]

I can't reproduce this on the latest staging. The labels in the report action item and the header both say "paid" rather than "spent".

[melvin-bot]

@Ollyws @grgia @maddylewis this issue was created 2 weeks ago. Are we close to approving a proposal? If not, what's blocking us from getting this issue assigned? Don't hesitate to create a thread in #expensify-open-source to align faster in real time. Thanks!

[melvin-bot]

📣 It's been a week! Do we have any satisfactory proposals yet? Do we need to adjust the bounty for this issue? 💸

[grgia]

Let's close out then!

[tranvantoan-qn]

Based on the comments above, there was obviously an issue with that label and I should be eligible for a reporting bonus.
So, what do you think @Ollyws @grgia?