[Due for payment 2025-02-18] [$250] Invoice - Owes text is shown briefly in the invoice title header. #55570

IuliiaHerets · 2025-01-21T20:46:39Z

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

Version Number: V9.0.88-4
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: Yes, reproducible on both
Issue reported by: Applause Internal Team
Device used: Redmi note 10s android 13
App Component: Money Requests

Action Performed:

Pre: condition: Have a workspace created with invoice feature enabled

Launch app
Tap fab - send invoice
Complete the flow
Open the invoice created
Note the header text

Expected Result:

Owes text must not be shown briefly in the invoice title header.

Actual Result:

Owes text is shown briefly in the invoice title header.

Workaround:

Unknown

Platforms:

Screenshots/Videos

Bug6720232_1737487992885.Screenrecorder-2025-01-22-00-58-21-619.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

Upwork Job URL: https://www.upwork.com/jobs/~021881899869001116424
Upwork Job ID: 1881899869001116424
Last Price Increase: 2025-01-22
Automatic offers:

shubham1206agra | Reviewer | 105905195

Issue Owner

Current Issue Owner: @stephanieelliott

melvin-bot · 2025-01-21T20:46:47Z

Triggered auto assignment to @stephanieelliott (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.

twilight2294 · 2025-01-21T21:04:21Z

🚨 Edited by proposal-police: This proposal was edited at 2025-01-21 21:05:43 UTC.

Proposal

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

Owes text is shown briefly in the invoice title header

What is the root cause of that problem?

We optimistically set the title to X owes $ here:

App/src/libs/ReportUtils.ts

Lines 4897 to 4898 in f40c622

    
           // We don’t translate reportName because the server response is always in English 
        
           reportName: `${receiverName} owes ${formattedTotal}`,

That is why before BE response we see this message,

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

We need to update this title to match with the BE:

        // We don’t translate reportName because the server response is always in English
        reportName: `Invoice new Date(report.lastVisibleActionCreated)`,

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

We can write a mock data for invoice and check the optimistic value to match what the server responds, or simply check the data created

What alternative solutions did you explore? (Optional)

N/A

melvin-bot · 2025-01-22T03:01:09Z

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

melvin-bot · 2025-01-22T03:01:13Z

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

mkzie2 · 2025-01-22T03:22:40Z

🚨 Edited by proposal-police: This proposal was edited at 2025-01-22 03:25:37 UTC.

Proposal

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

Owes text is shown briefly in the invoice title header.

What is the root cause of that problem?

When we create a new invoice report, the reportName in optimistic data has format ``${receiverName} owes ${formattedTotal}then the backend returns the return name with the formatInvoice ${created}`

App/src/libs/ReportUtils.ts

Lines 4897 to 4898 in f40c622

    
           // We don’t translate reportName because the server response is always in English 
        
           reportName: `${receiverName} owes ${formattedTotal}`,

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

We should update the reportName optimistic data to match the format on the back end.
Note: we need to convert the date with the format yyyy-MM-dd when setting the value for reportName.

const currentTime = DateUtils.getDBTime();

...
reportName: `Invoice ${DateUtils.extractDate(DateUtils.getDBTime())}`,
lastVisibleActionCreated: currentTime,

App/src/libs/ReportUtils.ts

Lines 4897 to 4898 in f40c622

    
           // We don’t translate reportName because the server response is always in English 
        
           reportName: `${receiverName} owes ${formattedTotal}`,

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

We can add a test with SendInvoice API and verify that the optimistic invoice report has the correct reportName format.

What alternative solutions did you explore? (Optional)

NA

Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

ikevin127 · 2025-01-23T02:46:57Z

Proposal

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

When an invoice is created, ${receiverName} owes ${formattedTotal} reportTitle shows briefly in the invoice title header.

What is the root cause of that problem?

The offending PR #40015 added this line in the buildOptimisticInvoiceReport which sets the reportName optimistically as ${receiverName} owes ${formattedTotal}, then when the invoice is created and the OpenReport API call returns data from BE, the report name will change to Invoice {date} -> causing our issue.

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

Inside buildOptimisticInvoiceReport, replace this logic with the following:

// const formattedTotal = convertToDisplayString(total, currency); <- remove this as we don't need it anymore
const dbTime = DateUtils.getDBTime(); // <- add this reusable constant

// in the `invoiceReport` object apply the following changes:
reportName: `Invoice ${DateUtils.extractDate(dbTime)}`, // <- change optimistic `reportName` to match BE response
lastVisibleActionCreated: dbTime, // <- pass `dbTime` constant (unchanged functionality)

this assigns the DateUtils.getDBTime() value to a constant which we'll use in two places:

to extract the date only using DateUtils.extractDate() in order to align the optimistically set reportName with the one returned by BE once OpenReport API call is completed
to pass the raw DateUtils.extractDate() to the lastVisibleActionCreated as it was already passed previously

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

Doesn't apply because we can't sync a FE test with the BE response (which might change without notice).

Result video (before / after)

MacOS: Chrome

Before	After
before.mov	after.mov

kaushiktd · 2025-01-23T14:10:03Z

🚨 Edited by proposal-police: This proposal was edited at 2025-01-23 14:12:37 UTC.

Proposal

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

Owes text is shown briefly in the invoice title header.

What is the root cause of that problem?

The reportName in the optimistic data is initially set as ${receiverName} owes ${formattedTotal} here. However, after creating an invoice, the OpenReport API is called to retrieve the report from the backend. During this process, the reportName will be change

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

Instead of setting the reportName optimistically to ${receiverName} owes ${formattedTotal} default it directly to the expected backend format. You need to replace the logic here by introducing a reusable time constant.

const currentDBTime = DateUtils.getDBTime();

Set the reportName optimistically to match the backend format using the DateUtils utility. also use the same currentDBTime constant to maintain consistency with backend requirements:

reportName: `Invoice ${DateUtils.extractDate(currentDBTime)}`, // Use extracted date for alignment
lastVisibleActionCreated: currentDBTime, // Reuse the constant to preserve existing functionality

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

github-actions · 2025-01-23T14:10:24Z

⚠️ @kaushiktd Thanks for your proposal. Please update it to follow the proposal template, as proposals are only reviewed if they follow that format (note the mandatory sections).

FitseTLT · 2025-01-23T15:50:53Z

🚨 Edited by proposal-police: This proposal was edited at 2025-01-23 16:18:06 UTC.

Proposal

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

Invoice - Owes text is shown briefly in the invoice title header.

What is the root cause of that problem?

In buildOptimisticInvoiceReport we are not setting the reportName to the formula report name setting of the policy

App/src/libs/ReportUtils.ts

Line 4905 in 16d5642

reportName: `${receiverName} owes ${formattedTotal}`,

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

We need to set formula name if the policy is paid group policy same as we do for expense report here

App/src/libs/ReportUtils.ts

Lines 5014 to 5017 in 16d5642

    
           const titleReportField = getTitleReportField(getReportFieldsByPolicyID(policyID) ?? {}); 
        
           if (!!titleReportField && isPaidGroupPolicyExpenseReport(expenseReport)) { 
        
               expenseReport.reportName = populateOptimisticReportFormula(titleReportField.defaultValue, expenseReport, policy); 
        
           }

so in buildOptimisticInvoiceReport

 const policy = getPolicy(policyID);
    const titleReportField = getTitleReportField(getReportFieldsByPolicyID(policyID) ?? {});
    if (!!titleReportField && isPaidGroupPolicy(invoiceReport)) {
        invoiceReport.reportName = populateOptimisticReportFormula(titleReportField.defaultValue, invoiceReport, policy);
    }

And update populateOptimisticReportFormula

App/src/libs/ReportUtils.ts

Line 4871 in 16d5642

.replaceAll('{report:type}', 'Expense Report')

        .replaceAll('{report:type}', isInvoiceReport(report) ? 'Invoice' : 'Expense Report')

On a side note: I see that populateOptimisticReportFormula sets the currency in the long version like (ETB for Br) but the BE is returning the currency in short form so we can use getCurrencySymbol on the currency instead of directly setting the currency here to get the short form

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

We will add test for buildOptimisticInvoiceReport to check that it returns formula reportName for paid group policy.

What alternative solutions did you explore? (Optional)

melvin-bot · 2025-01-27T09:46:49Z

@stephanieelliott, @shubham1206agra Huh... This is 4 days overdue. Who can take care of this?

stephanieelliott · 2025-01-28T06:46:22Z

@shubham1206agra we have some proposals here, can you review when you have a chance?

melvin-bot · 2025-01-29T09:10:03Z

@stephanieelliott, @shubham1206agra 6 days overdue. This is scarier than being forced to listen to Vogon poetry!

shubham1206agra · 2025-01-29T09:17:59Z

@FitseTLT's proposal looks good to me.

🎀👀🎀 C+ reviewed

melvin-bot · 2025-01-29T09:18:11Z

Triggered auto assignment to @cristipaval, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

shubham1206agra · 2025-01-29T09:18:47Z

On a side note: I see that populateOptimisticReportFormula sets the currency in the long version like (ETB for Br) but the BE is returning the currency in short form so we can use getCurrencySymbol on the currency instead of directly setting the currency here to get the short form

@cristipaval Can you help me confirm this from BE side?

cristipaval · 2025-01-29T10:30:17Z

@rezkiy37, is this something that you might want to fix since you worked on this?

rezkiy37 · 2025-01-29T11:09:59Z

@cristipaval, yes. It looks like a regression.

rezkiy37 · 2025-01-29T11:10:12Z

Hi, I am Michael (Mykhailo) from Callstack, an expert agency and I can work on this issue.

FitseTLT · 2025-01-29T11:55:05Z

So @cristipaval what about my proposal I spent time and effort to propose a correct solution because it was Help Wanted issue and now I get ignored on the last step of the process w/o any compensation? It would be bit unfair. WDYT

cristipaval · 2025-01-29T12:08:02Z

So @cristipaval what about my proposal I spent time and effort to propose a correct solution because it was Help Wanted issue and now I get ignored on the last step of the process w/o any compensation? It would be bit unfair. WDYT

@FitseTLT, I truly appreciate your valuable contributions to the Expensify App and encourage you to continue sharing your solutions. I understand that investing time and effort into a proposal without compensation can be frustrating. Unfortunately, based on this guideline, compensation is only provided when a contributor is officially hired for the job. I hope this helps clarify the process, and I’d love to see more of your contributions in the future!

rezkiy37 · 2025-01-29T16:27:42Z

I was able to reproduce the bug. It happens on the frontend side and is generated optimistically. I am working on it.

rezkiy37 · 2025-01-30T10:36:09Z

@cristipaval, I just looked at the PR I had before and found this comment left by you. There was a commit where I've updated the optimistic reportName generation to follow the Invoice AAAA-MM-DD format. However, it was reverted at that moment. I have tested how the backend sets the reportName for newly created invoices. I can see it always utilizes the format. So should we support the legacy one (owes)?

cristipaval · 2025-01-30T11:11:47Z

yes, the backend sets the Invoice AAAA-MM-DD name on all invoice reports. But we do not want to use that one from the backend for the invoices sent over NewDot. We use that only for the invoices created in OldDot (which are not linked to an invoice room.)

rezkiy37 · 2025-01-30T11:17:57Z

Well, I am not sure I understand the expected behavior now. I send invoices from ND and can see the "owes" text briefly before the backend sync-up. It changes to the Invoice AAAA-MM-DD format once it has synced. So what's incorrect then:

The backend always assigns the Invoice AAAA-MM-DD format for ND invoices as well.
The frontend generates the "owes" text optimistically.
The frontend uses and renders the Invoice AAAA-MM-DD format.

@cristipaval does it make sense?

cristipaval · 2025-01-30T12:16:26Z

Yes, thanks for summarizing, it helps!

The backend always assigns the Invoice AAAA-MM-DD format for ND invoices as well.

All good.

The frontend generates the "owes" text optimistically.

This should happen for the invoices sent over NewDot (linked to the invoice room). The optimistic name for the OD invoices should be according to the Invoice AAAA-MM-DD pattern

The frontend uses and renders the Invoice AAAA-MM-DD format.

Front end should

for OD invoices, render what the backend returns as the reportName
for ND invoices, build and render the name according to the "owes" pattern

Let me know if this is clear enough.
Also, cc'ing @davidcardoza

rezkiy37 · 2025-01-30T15:38:56Z

I just realized that ND cannot send the OD invoices. Yeah, it definitely makes sense 🤦 There is a condition for the "Send Invoice" button to check if an invoice room exists. So I am working on this draft PR.

Screenshot

rezkiy37 · 2025-01-31T11:37:40Z

Just opened for review - #56048.

rezkiy37 · 2025-02-06T09:34:45Z

Merged.

melvin-bot · 2025-02-10T23:26:08Z

⚠️ Looks like this issue was linked to a Deploy Blocker here

If you are the assigned CME please investigate whether the linked PR caused a regression and leave a comment with the results.

If a regression has occurred and you are the assigned CM follow the instructions here.

If this regression could have been avoided please consider also proposing a recommendation to the PR checklist so that we can avoid it in the future.

melvin-bot · 2025-02-11T02:18:48Z

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

melvin-bot · 2025-02-11T02:18:55Z

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

Invoice report name ND and OD formats #56048

If no regressions arise, payment will be issued on 2025-02-18. 🎊

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

@rezkiy37 does not require payment (Contractor)
@shubham1206agra requires payment automatic offer (Reviewer)

melvin-bot · 2025-02-11T02:18:56Z

@shubham1206agra @stephanieelliott @shubham1206agra The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed. Please copy/paste the BugZero Checklist from here into a new comment on this GH and complete it. If you have the K2 extension, you can simply click: [this button]

melvin-bot · 2025-02-18T09:03:48Z

@cristipaval @stephanieelliott @rezkiy37 @shubham1206agra this issue is now 4 weeks old, please consider:

Finding a contributor to fix the bug
Closing the issue if BZ has been unable to add the issue to a VIP or Wave project
If you have any questions, don't hesitate to start a discussion in #expensify-open-source

Thanks!

stephanieelliott · 2025-02-19T02:30:14Z

Summarizing payment on this issue:

Contributor: @rezkiy37 (no payment due)
Contributor+: @shubham1206agra -$250 via ND - Please request!

Upwork job closed: https://www.upwork.com/jobs/~021881899869001116424
Offer withdrawn: https://www.upwork.com/jobs/~021881899869001116424

IuliiaHerets added Bug Something is broken. Auto assigns a BugZero manager. Daily KSv2 labels Jan 21, 2025

melvin-bot bot assigned stephanieelliott Jan 21, 2025

stephanieelliott added this to [#whatsnext] #billpay Jan 22, 2025

stephanieelliott added the External Added to denote the issue can be worked on by a contributor label Jan 22, 2025

melvin-bot bot changed the title ~~Invoice - Owes text is shown briefly in the invoice title header.~~ [$250] Invoice - Owes text is shown briefly in the invoice title header. Jan 22, 2025

melvin-bot bot added the Help Wanted Apply this label when an issue is open to proposals by contributors label Jan 22, 2025

melvin-bot bot assigned shubham1206agra Jan 22, 2025

melvin-bot bot added the Overdue label Jan 27, 2025

melvin-bot bot removed the Overdue label Jan 29, 2025

melvin-bot bot assigned cristipaval Jan 29, 2025

cristipaval assigned rezkiy37 Jan 29, 2025

shubham1206agra mentioned this issue Jan 30, 2025

Invoice - Invoice date in header and date section is inconsistent #55997

Closed

8 tasks

rezkiy37 mentioned this issue Jan 30, 2025

Invoice report name ND and OD formats #56048

Merged

50 tasks

melvin-bot bot added Reviewing Has a PR in review Weekly KSv2 and removed Daily KSv2 labels Jan 31, 2025

melvin-bot bot added Weekly KSv2 Awaiting Payment Auto-added when associated PR is deployed to production and removed Weekly KSv2 labels Feb 11, 2025

melvin-bot bot changed the title ~~[$250] Invoice - Owes text is shown briefly in the invoice title header.~~ [Due for payment 2025-02-18] [$250] Invoice - Owes text is shown briefly in the invoice title header. Feb 11, 2025

melvin-bot bot removed the Reviewing Has a PR in review label Feb 11, 2025

melvin-bot bot added Daily KSv2 and removed Weekly KSv2 labels Feb 17, 2025

stephanieelliott closed this as completed Feb 19, 2025

github-project-automation bot moved this to Done in [#whatsnext] #billpay Feb 19, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Due for payment 2025-02-18] [$250] Invoice - Owes text is shown briefly in the invoice title header. #55570

[Due for payment 2025-02-18] [$250] Invoice - Owes text is shown briefly in the invoice title header. #55570

IuliiaHerets commented Jan 21, 2025 •

edited by melvin-bot bot

Loading

melvin-bot bot commented Jan 21, 2025

twilight2294 commented Jan 21, 2025 •

edited by github-actions bot

Loading

melvin-bot bot commented Jan 22, 2025

melvin-bot bot commented Jan 22, 2025

mkzie2 commented Jan 22, 2025 •

edited

Loading

ikevin127 commented Jan 23, 2025

kaushiktd commented Jan 23, 2025 •

edited by github-actions bot

Loading

github-actions bot commented Jan 23, 2025

FitseTLT commented Jan 23, 2025 •

edited by github-actions bot

Loading

melvin-bot bot commented Jan 27, 2025

stephanieelliott commented Jan 28, 2025

melvin-bot bot commented Jan 29, 2025

shubham1206agra commented Jan 29, 2025

melvin-bot bot commented Jan 29, 2025

shubham1206agra commented Jan 29, 2025

cristipaval commented Jan 29, 2025

rezkiy37 commented Jan 29, 2025

rezkiy37 commented Jan 29, 2025

FitseTLT commented Jan 29, 2025

cristipaval commented Jan 29, 2025

rezkiy37 commented Jan 29, 2025

rezkiy37 commented Jan 30, 2025

cristipaval commented Jan 30, 2025

rezkiy37 commented Jan 30, 2025

cristipaval commented Jan 30, 2025 •

edited

Loading

rezkiy37 commented Jan 30, 2025 •

edited

Loading

rezkiy37 commented Jan 31, 2025

rezkiy37 commented Feb 6, 2025

melvin-bot bot commented Feb 10, 2025

melvin-bot bot commented Feb 11, 2025

melvin-bot bot commented Feb 11, 2025

melvin-bot bot commented Feb 11, 2025

melvin-bot bot commented Feb 18, 2025

stephanieelliott commented Feb 19, 2025

[Due for payment 2025-02-18] [$250] Invoice - Owes text is shown briefly in the invoice title header. #55570

[Due for payment 2025-02-18] [$250] Invoice - Owes text is shown briefly in the invoice title header. #55570

Comments

IuliiaHerets commented Jan 21, 2025 • edited by melvin-bot bot Loading

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platforms:

Screenshots/Videos

melvin-bot bot commented Jan 21, 2025

twilight2294 commented Jan 21, 2025 • edited by github-actions bot Loading

Proposal

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

What is the root cause of that problem?

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

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

melvin-bot bot commented Jan 22, 2025

melvin-bot bot commented Jan 22, 2025

mkzie2 commented Jan 22, 2025 • edited Loading

Proposal

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

What is the root cause of that problem?

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

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

ikevin127 commented Jan 23, 2025

Proposal

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

What is the root cause of that problem?

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

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

Result video (before / after)

kaushiktd commented Jan 23, 2025 • edited by github-actions bot Loading

Proposal

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

What is the root cause of that problem?

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

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

github-actions bot commented Jan 23, 2025

FitseTLT commented Jan 23, 2025 • edited by github-actions bot Loading

Proposal

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

What is the root cause of that problem?

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

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

melvin-bot bot commented Jan 27, 2025

stephanieelliott commented Jan 28, 2025

melvin-bot bot commented Jan 29, 2025

shubham1206agra commented Jan 29, 2025

melvin-bot bot commented Jan 29, 2025

shubham1206agra commented Jan 29, 2025

cristipaval commented Jan 29, 2025

rezkiy37 commented Jan 29, 2025

rezkiy37 commented Jan 29, 2025

FitseTLT commented Jan 29, 2025

cristipaval commented Jan 29, 2025

rezkiy37 commented Jan 29, 2025

rezkiy37 commented Jan 30, 2025

cristipaval commented Jan 30, 2025

rezkiy37 commented Jan 30, 2025

cristipaval commented Jan 30, 2025 • edited Loading

rezkiy37 commented Jan 30, 2025 • edited Loading

rezkiy37 commented Jan 31, 2025

rezkiy37 commented Feb 6, 2025

melvin-bot bot commented Feb 10, 2025

melvin-bot bot commented Feb 11, 2025

melvin-bot bot commented Feb 11, 2025

melvin-bot bot commented Feb 11, 2025

melvin-bot bot commented Feb 18, 2025

stephanieelliott commented Feb 19, 2025

IuliiaHerets commented Jan 21, 2025 •

edited by melvin-bot bot

Loading

twilight2294 commented Jan 21, 2025 •

edited by github-actions bot

Loading

mkzie2 commented Jan 22, 2025 •

edited

Loading

kaushiktd commented Jan 23, 2025 •

edited by github-actions bot

Loading

FitseTLT commented Jan 23, 2025 •

edited by github-actions bot

Loading

cristipaval commented Jan 30, 2025 •

edited

Loading

rezkiy37 commented Jan 30, 2025 •

edited

Loading