Invoices - Receipt appears on invoice confirmation page if receipt is added from track expense

[IuliiaHerets]

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.45-2 Reproducible in staging?: Y Reproducible in production?: Y Email or phone of affected tester (no customers): applausetester+pso@applause.expensifail.com Issue reported by: Applause Internal Team

Action Performed:

1. Go to staging.new.expensify.com
2. Go to FAB > Send invoices.
3. Enter amount and select a receiver.
4. Note that there is no receipt option on the confirmation page.
5. Click back button.
6. Click Just track it (don’t submit it).
7. Add a receipt from the 3-dot menu.
8. Click back button.
9. Select a receiver.

Expected Result:

Receipt will not appear on the invoice confirmation page because invoice does not support receipt (evident from Step 4).

Actual Result:

Receipt appears on invoice confirmation page if receipt is added from track expense first.

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

https://github.com/user-attachments/assets/168c937c-07c0-42e9-b299-eeecd8f24a08

View all open jobs on GitHub

[melvin-bot[bot]]

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

[IuliiaHerets]

We think that this bug might be related to #vip-bills

[IuliiaHerets]

@trjExpensify FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

[Nodebrute]

Edited by proposal-police: This proposal was edited at 2024-10-06 17:29:32 UTC.

Proposal

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

Receipt appears on invoice confirmation page if receipt is added from track expense

What is the root cause of that problem?

When we add the receipt it gets added to this transaction and then we move back to send invoice we can see the receipt. https://github.com/Expensify/App/blob/99f280b0edae75ff59614a1c5e98c47b39800aa5/src/pages/iou/request/step/IOURequestStepConfirmation.tsx#L624

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

You can see that if we add categories during the invoice flow and then go back to start the track expense flow, the categories will still be present in the transaction object. However, we don’t see the categories on the screen because we hide them using this check. https://github.com/Expensify/App/blob/99f280b0edae75ff59614a1c5e98c47b39800aa5/src/components/MoneyRequestConfirmationList.tsx#L261

The same we can do with receipts. We can add another check here !isTypeInvoice https://github.com/Expensify/App/blob/99f280b0edae75ff59614a1c5e98c47b39800aa5/src/components/MoneyRequestConfirmationListFooter.tsx#L636

What alternative solutions did you explore? (Optional)

We can pass the shouldDisplayReceipt={iouType !== CONST.IOU.TYPE.INVOICE} https://github.com/Expensify/App/blob/99f280b0edae75ff59614a1c5e98c47b39800aa5/src/pages/iou/request/step/IOURequestStepConfirmation.tsx#L623 and then we can use it here to hide the receipt https://github.com/Expensify/App/blob/99f280b0edae75ff59614a1c5e98c47b39800aa5/src/components/MoneyRequestConfirmationListFooter.tsx#L636

Alternative 2 Or we can use setMoneyRequestReceipt to clear the receipt details from transaction object. We can do something like in IOURequestStepConfirmation.tsx

pseudo-code

   useEffect(() => {
        console.log(transaction)
        if (iouType !== CONST.IOU.TYPE.INVOICE && !transaction?.receipt) {
            return;
        }
       IOU.setMoneyRequestReceipt(transactionID, '','',true);

    }, [transactionID, iouType]);

Optional: We can also add !isTypeInvoice check too to hide receipt. Optional 2: we can also use null instead of ''

[Nodebrute]

Proposal updated Added alternative solution 2

[cretadn22]

Proposal

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

Receipt appears on invoice confirmation page if receipt is added from track expense

What is the root cause of that problem?

In this case, we have two separate flows: "Send Invoice" and "Track Expense." However, both flows save their data in the same place, "transactionsDraft_1." This results in the receipt from the "Track Expense" flow also being added to the "Send Invoice" flow

A similar issue occurs with the category field, which only exists in the "Send Invoice" flow. If a value is added to category and then "Track Expense" is executed, the category field still appears in the payload of the "Track Expense" API

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

"transactionsDraft_1" can be used to share common information like description, amount, and merchant,... as these exist in both flows. However, if we continue saving receipt information and the category field in "transactionsDraft_1" as we do now, we will need to make some adjustments:

• For the "Track Expense" flow: We need to hide the category field on the confirmation page and remove it from the API payload.
• For the "Send Invoice" flow: We need to hide the receipt information on the confirmation page and remove it from the API payload.

What alternative solutions did you explore? (Optional)

We can save the "Track Expense" information to a new ONYX state (transactionDraft_sideFlow), keeping the data for both flows completely separate. However, the downside of this approach is that any shared information between the two flows will not be available in both.

[trjExpensify]

I think we want to put this one in #f1 as it's a bug from there. @grgia, who's working on this with you? I don't think we should show the "just track it" option in the Send invoice flow. CC: @anmurali

[trjExpensify]

I'll hold off on Help wanted for now, as we might want to route this back to whoever is working on that project as a regression.

[trjExpensify]

Bumped in thread: https://expensify.slack.com/archives/C07HPDRELLD/p1728580440064929?thread_ts=1728363084.092579&cid=C07HPDRELLD

Doesn't look like @fabioh8010 has access to that channel though, so tagging you here!

[fabioh8010]

Hi @trjExpensify Could you assign me here so I can work on the fix? Thanks!

[trjExpensify]

Done!

[grgia]

@fabioh8010 are you able to prioritize this one this week? Thanks!

[fabioh8010]

Created a Draft PR -> https://github.com/Expensify/App/pull/50732

[trjExpensify]

Excellent! When do you think you can have it in review?

[fabioh8010]

I asked for Georgia's feedback in DM but no answer yet, so I think I will just proceed into opening the PR today with screenshots / test videos and tag her again

[trjExpensify]

That would be great, thanks!