[HOLD for payment 2024-06-03] [Violations - Pending Receipts] Display the rter Violation with the Pending Pattern

[yuwenmemon]

Design Doc: https://docs.google.com/document/d/1zJqlTe_RajuBtfQYvbMx8PpXgA9CEnUGVyuqZihQ-ok/edit
Tracking GH: https://github.com/Expensify/Expensify/issues/372206

HOLD ON https://github.com/Expensify/Expensify/issues/384996

---

Similar to how we have TransactionUtils.isPending and TransactionUtils.isReceiptBeingScanned in NewDot to help us with other pending UI flows, we'll add a new method: TransactionUtils.hasPendingRTERViolation:

TransactionUtils.hasPendingRTERViolation

This will have a similar structure to the current TransactionUtils methods that check for / retrieve violations.

• Params:
  • transactionID: string
  • transactionViolations: TransactionViolation[] - the set of violations for that specific transaction. For components where we are subscribing to all violations we can use the output of TransactionUtils.getTransactionViolations
• Returns:
  • A boolean: If any of the violations for that transactionID in Onyx are the rter violation, with pendingPattern set to true

Additionally, because this will be called frequently with TransactionUtils.isPending and TransactionUtils.isReceiptBeingScanned let's also make and utilize a method that returns true if any of those return true: hasPendingUI()

We'll outline this in further detail below, but we'll call this method in:

1. MoneyRequestPreviewContent.tsx
2. ReportPreview.tsx
3. MoneyRequestHeader.tsx

The first two already have access to the transactionViolations onyx collection key. However, we will need to add it to MoneyRequestHeader.tsx.

Updates to ReportActionItems: MoneyRequestPreview / ReportPreview

Now that we know if our transaction has the "7-Day Hold" rter violation, we can adjust the UI to reflect that it's "Pending". For ReportActionItem rows, we will do the same thing that was outlined for pending transactions and scanning receipts in the Update how we display / report expenses doc.

We will show the "pending" hover/message/icon UI for these two cases:

• if the action is a Money Request Action and the linked Transaction has the rter violation (hasPendingRTERViolation - in addition to possibly being isScanning || isPending as outlined in that doc).
  • We'll also get the proper preview header text as part of getPreviewHeaderText in the MoneyRequestPreviewContent component.
• if the action is a Report Preview containing a single transaction with the rter violation (hasPendingRTERViolation or similarly, isScanning || isPending).
  • We'll also get the proper message "Receipt pending match with credit card", with the hourglass icon as well, as part of the logic in the ReportPreview component:
    
  • Additionally, we'll set shouldShowSubmitButton to false in this case.

Updates to MoneyReportHeader

Similar to what we're doing for the Report Preview above, if the report contains only transactions with the rter violation (which again, we'll alias as hasPendingRTERViolation) we'll show the Next Steps banner indicating that the receipts are pending match with a credit card.

We'll also hide the Submit/Approve/Pay buttons in this case as well (i.e. all transactions are pending).

In the case of the "One-Expense" Chat, we'll use the same pattern as the MoneyRequestHeader as described below.

Updates to MoneyRequestHeader

If hasPendingRTERViolation is true, we'll show a MoneyRequestHeaderStatusBar in the MoneyRequestHeader here. This will be similar to what we already do for isPending and isScanning. The message will utilize the same hourglass icon and have the copy as seen below.

Let's also refactor this to be a bit less repetitive. We can create a getPendingType() method that checks if the transaction is RTER vs SCANNING vs PENDING and returns the translations keyed by that type.

"Mark as cash" Button

This will be covered in a separate issue

Issue Owner

Current Issue Owner: @mallenexpensify

[melvin-bot]

Triggered auto assignment to @mallenexpensify (NewFeature), see https://stackoverflowteams.com/c/expensify/questions/14418#:~:text=BugZero%20process%20steps%20for%20feature%20requests for more details.

[melvin-bot]

⚠️ It looks like this issue is labelled as a New Feature but not tied to any GitHub Project. Keep in mind that all new features should be tied to GitHub Projects in order to properly track external CAP software time ⚠️

[yuwenmemon]

Removing the HOLD on this

[grgia]

Gonna assign to track if we end up merging this with the other pending changes in this issue

Slack convo in SWM- https://expensify.slack.com/archives/C04878MDF34/p1712273151578619

cc @BrtqKr :)

[grgia]

@BrtqKr could you comment so I can assign you? thanks!

[BrtqKr]

Hey, I'd like to take over this issue

[grgia]

in progress

[melvin-bot]

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

[grgia]

cc @smelaa are you working on this? If so, please comment so I can switch assignments

[smelaa]

Hi, I am Aleksandra Smela from Software Mansion, an expert agency, and I would like to work on this issue

[smelaa]

Hi, as I am diving into the code I have a question to the design.

We will show the "pending" hover/message/icon UI for these two cases:
if the action is a Money Request Action and the linked Transaction has the rter violation…
if the action is a Report Preview containing a single transaction with the rter violation…

From what I understand we need to show „pending” hover/message/icon from the level of ReportActionItem. I was thinking to just add an additional condition here. The problem is that we do not have an access to transaction violations in ReportActionItem.
The solution might be to add Onyx.connect in TransactionUtils for transaction violations as we do for allTransactions and then just filter proper violations by transactionID.
Please let me know if that would be okay or I should find a different approach.

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 1.4.75-1 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• [Violations - Pending Receipts] Display the rter Violation with the Pending Pattern #40354
• [FIX][Violations - Pending Receipts] Bug in Display the rter Violation with the Pending Pattern #42420

If no regressions arise, payment will be issued on 2024-06-03. 🎊

For reference, here are some details about the assignees on this issue:

• @ishpaul777 requires payment (Needs manual offer from BZ)
• @smelaa does not require payment (Contractor)

[melvin-bot]

BugZero Checklist: The PR adding this new feature has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@ishpaul777] Please propose regression test steps to ensure the new feature will work correctly on production in further releases.
• [@mallenexpensify] Link the GH issue for creating/updating the regression test once above steps have been agreed upon.

[melvin-bot]

Payment Summary

Upwork Job

• ROLE: @ishpaul777 paid $(AMOUNT) via Upwork (LINK)
• Contributor: @smelaa is from an agency-contributor and not due payment

BugZero Checklist (@mallenexpensify)

• I have verified the correct assignees and roles are listed above and updated the neccesary manual offers
• I have verified that there are no duplicate or incorrect contracts on Upwork for this job (https://www.upwork.com/ab/applicants//hired)
• I have paid out the Upwork contracts or cancelled the ones that are incorrect
• I have verified the payment summary above is correct

[mallenexpensify]

@ishpaul777 can you propose regression test steps plz?
Also... how much are you due here? If this is due more than the standard $250, please provide reasoning.

[ishpaul777]

i dont have the full context for the feature (like how to get the rter Violation with a real user account). I am pretty sure the design doc in the issue Description should have the testing steps for whole feature. @mallenexpensify Can you please confirm i dont have access to docs

[ishpaul777]

The issue misses the priorty tag, but we worked on this one as a HIGH priorty ticket so i think it should be $500 @yuwenmemon Can you please help in evaluatuion

[yuwenmemon]

Yeah, that's accurate @ishpaul777 👍

[mallenexpensify]

Yeah, that's accurate @ishpaul777 👍

I'm assuming this is related to us not needing regression steps here cuz it'll be covered in testing steps as part of the design doc.

@ishpaul777 , I posted this in #expensify-open-source yesterday

There have been questions about what constitutes a job being auto-increased to $500. These jobs are only the ones that have the High Priority label added to them (ie. issue with HIGH or CRITICAL in the title or project status/priority are not auto-increased to $500).

So the default amount here would be $250. if you believe compensation should be higher, follow the process here

[ishpaul777]

@mallenexpensify Well the issue was created before April 5th so isn't the default still be $500 ?

https://expensify.slack.com/archives/C02NK2DQWUX/p1715196549664219?thread_ts=1715190852.677769&cid=C02NK2DQWUX

[mallenexpensify]

Thanks for the link @ishpaul777 , for this instance, you are correct. I commented on that thread to state this shouldn't be the practice for any future price updates.

In the future, when we have price changes or, if there are other instances where we're deciding what the price should be, we shouldn't always default to the created date. We have closed issues from when we paid $2k for a job, if we reopened one today, we'd want the default price to be $250. Same goes for old issues where we haven't marked external yet, also for one's that needed reliable reproduction steps before making external.

[melvin-bot]

Current assignee @mallenexpensify is eligible for the Bug assigner, not assigning anyone new.

[mallenexpensify]

@ishpaul777 can you please accept the job and reply here once you have?
https://www.upwork.com/ab/applicants/1798501240605888788/job-details

[ishpaul777]

Accepted 😄

[mallenexpensify]

Contributor+: @ishpaul777 paid $500 via Upwork.

Thanks all!