Implement Send Invoice flow from Global Create by VickyStash · Pull Request #40015 · Expensify/App

VickyStash · 2024-04-10T15:07:29Z

Details

Implementation of invoice creation flow from Global Create

Fixed Issues

$ #40012
PROPOSAL: N/A

Tests

Verify that no errors appear in the JS console

Note (!): Use staging server by turning it on in Settings -> Troubleshoot -> Use Staging Server
Note (!): the backend has a know issue related to the invoice currency. If you want your test results to not be affected by that issue, set the sender workspace and the invoice currencies to be USD.

Flow 1

Sign in to the app with a workspace admin account
Open Global Create and verify Send Invoice appears in Global Create
Click Send invoice in Global Create:
3.1 Verify “Distance” and “Scan" do not appear in the big number pad (BNP) screen.
3.2 Verify the Currency can be modified
Add an amount -> tap Next
Select the participant, and make sure the participant's step works as expected. Press Next.
Verify all of the information on the confirmation screen looks as expected.
6.1 The sender Workspace is displayed as expected.
6.2 The receiver is displayed as expected.
Tap on the Send from workspace, you should be navigated to the Send from the screen.
Select another workspace, and make sure it works as expected.
tap Send $XX.XX invoice, verify all of the necessary data is created in Onyx.

Flow 2

Repeat Flow 1, but select the same sender and receiver.
Make sure you are navigated to the same room after invoice confirmation.

Flow 3

Sign in to the app with an account without workspaces
Confirm you have no Send Invoice option in Global Create

Offline tests

Same as in the Tests section

QA Steps

Verify that no errors appear in the JS console

Same as in the Tests section

PR Author Checklist

Screenshots/Videos

Android: Native

android1.mp4

Android: mWeb Chrome

android_web1.mp4

iOS: Native

ios1.mp4

iOS: mWeb Safari

ios_web1.mp4

MacOS: Chrome / Safari

web1.mp4

MacOS: Desktop

desktop1.mp4

…nvoices

# Conflicts: # src/pages/iou/request/IOURequestStartPage.js # src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js # src/pages/iou/request/step/withWritableReportOrNotFound.tsx

# Conflicts: # src/components/MoneyTemporaryForRefactorRequestConfirmationList.tsx # src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js # src/pages/iou/request/step/withFullTransactionOrNotFound.tsx # src/pages/iou/request/step/withWritableReportOrNotFound.tsx

src/languages/es.ts

src/styles/index.ts

# Conflicts: # src/libs/API/parameters/index.ts # src/libs/API/types.ts # src/libs/Navigation/types.ts # src/libs/ReportUtils.ts # src/pages/iou/request/IOURequestStartPage.tsx # src/pages/iou/request/step/withFullTransactionOrNotFound.tsx

# Conflicts: # src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js

rezkiy37

Left comments.

src/components/MoneyTemporaryForRefactorRequestConfirmationList.tsx

src/libs/actions/IOU.ts

# Conflicts: # src/components/MoneyTemporaryForRefactorRequestConfirmationList.tsx # src/libs/PolicyUtils.ts # src/libs/actions/IOU.ts # src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js # src/pages/iou/request/step/IOURequestStepConfirmation.tsx

…member

puneetlath · 2024-04-29T17:18:47Z

Yes, that's right. Just like workspace chats we'd have the big sender avatar of the sender's workspace with the small payer user avatar.

VickyStash · 2024-04-29T17:40:55Z

@cristipaval Can we please create a follow-up issue to update the invoice room avatars display?
cc @waterim

Similar comment here as the other PR, I think we might not be using the correct room avatars here? cc @puneetlath

I think the idea was to do this for Workspace to Workspace:

And to do this for Workspace to Individual:

Does that sound right Puneet & @davidcardoza ?

danielrvidal · 2024-04-29T22:13:22Z

Can we please create a follow-up issue to update the invoice room avatars display?

I created the issue here: #41261

Let me know if I need to do anything else.

OSBotify · 2024-04-29T23:33:42Z

🚀 Cherry-picked to staging by https://github.com/francoisl in version: 1.4.67-7 🚀

platform	result
🤖 android 🤖	failure ❌
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅

@Expensify/applauseleads please QA this PR and check it off on the deploy checklist if it passes.

OSBotify · 2024-04-30T01:13:39Z

🚀 Deployed to staging by https://github.com/cristipaval in version: 1.4.68-0 🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	failure ❌
🕸 web 🕸	success ✅

OSBotify · 2024-04-30T02:34:27Z

🚀 Cherry-picked to staging by https://github.com/francoisl in version: 1.4.67-7 🚀

platform	result
🤖 android 🤖	failure ❌
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅

@Expensify/applauseleads please QA this PR and check it off on the deploy checklist if it passes.

MonilBhavsar · 2024-04-30T05:48:38Z

There's a bug noted mostly coming from this PR #41287. If anyone can please take a look

OSBotify · 2024-05-01T02:37:49Z

🚀 Deployed to production by https://github.com/francoisl in version: 1.4.68-3 🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅

roryabraham · 2024-06-05T05:04:50Z

src/libs/API/parameters/SendInvoiceParams.ts

+type SendInvoiceParams = {
+    senderWorkspaceID: string;
+    accountID: number;
+    receiverEmail?: string;


Nice little pro tip: either receiverEmail or receiverInvoiceRoomID is required. So I see why you made them both optional, but it later led to a problem here. So what you can do is use RequireAtLeastOne from type-fest.

Pujan92 · 2024-06-05T13:22:57Z

We missed considering the enabled features of the collect workspace to show in the send invoice confirmation screen which raised an issue here.

shubham1206agra · 2024-08-13T12:16:59Z

src/libs/actions/IOU.ts

+    }
+    const reportPreviewAction = ReportUtils.buildOptimisticReportPreview(chatReport, optimisticInvoiceReport, trimmedComment, optimisticTransaction);
+
+    // STEP 6: Build Onyx Data


We forgot to properly link the reportAction and parent report, which led to bug mentioned #43582

rayane-d · 2024-09-10T10:39:41Z

src/libs/API/parameters/SendInvoiceParams.ts

@@ -0,0 +1,19 @@
+type SendInvoiceParams = {


FYI, This PR missed createdIOUReportActionID, createdReportActionIDForThread, reportActionID Send Invoice params and caused these issues: #43797, #43571, #43577, #44992. More info in this proposal: #43797 (comment)

rojiphil · 2024-09-10T17:46:07Z

src/libs/actions/Policy.ts

+ */
+function getPrimaryPolicy(activePolicyID?: string): Policy | undefined {
+    const activeAdminWorkspaces = PolicyUtils.getActiveAdminWorkspaces(allPolicies);
+    const primaryPolicy: Policy | null | undefined = allPolicies?.[activePolicyID ?? ''];


As we did not exclude personal policies while fetching primary policy, this resulted in #46705

rayane-d · 2024-10-06T21:04:01Z

src/pages/iou/request/step/IOURequestStepConfirmation.tsx

FYI, this PR caused this issue: #47922 because it missed updating the logic for invoking openDraftWorkspaceRequest to retrieve the policy details (e.g., categories) when changing the invoice sender policy. More info in this proposal: #47922 (comment)

hoangzinh · 2024-11-10T08:06:29Z

src/libs/actions/IOU.ts

+    if (isNewChatReport) {
+        inviteReportAction = ReportUtils.buildOptimisticInviteReportAction(receiver?.displayName ?? '', receiver.accountID ?? -1);
+    }
+    const reportPreviewAction = ReportUtils.buildOptimisticReportPreview(chatReport, optimisticInvoiceReport, trimmedComment, optimisticTransaction);


We returned an incorrect actorAccountID for the invoice report here. It caused the report preview sender appears and disappears when sending invoices consecutively. More details here #51128 (comment)

mollfpr · 2025-01-06T06:18:15Z

src/libs/actions/IOU.ts

+            key: `${ONYXKEYS.COLLECTION.TRANSACTION}${transaction.transactionID}`,
+            value: {
+                errors: ErrorUtils.getMicroSecondOnyxError('iou.error.genericCreateInvoiceFailureMessage'),
+                pendingAction: null,


✋ Coming from #54035

We already have a logic to delete the transaction if the transaction pending action is ADD when closing the error.

App/src/components/ReportActionItem/MoneyRequestView.tsx

Lines 458 to 472 in d56dfec

onClose={() => {

if (!transaction?.transactionID && linkedTransactionID === '-1') {

return;

}

if (transaction?.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD) {

if (chatReport?.reportID && ReportUtils.getAddWorkspaceRoomOrChatReportErrors(chatReport)) {

Report.navigateToConciergeChatAndDeleteReport(chatReport.reportID, true, true);

return;

}

if (parentReportAction) {

IOU.cleanUpMoneyRequest(transaction?.transactionID ?? linkedTransactionID, parentReportAction, true);

return;

}

}

So, clear the pendingAction makes the report not deleted. We only need to clear the pendingAction on success.

hoangzinh · 2025-06-02T13:52:04Z

src/libs/actions/IOU.ts

+        filename = receipt.name;
+    }
+    const optimisticTransaction = TransactionUtils.buildOptimisticTransaction(
+        amount,


We should multiply by "-1" here before building optimistic data for a transaction in case of sending invoice. Otherwise, it will cause calculating total amount to be incorrect when offline. More details here #61050 (comment)

rojiphil · 2025-06-26T14:12:28Z

src/libs/actions/IOU.ts

+    API.write(WRITE_COMMANDS.SEND_INVOICE, parameters, onyxData);
+
+    Navigation.dismissModal(invoiceRoomReportID);
+    Report.notifyNewAction(invoiceRoomReportID, receiver.accountID);


Sending a new invoice did not scroll down the view as we missed passing the current account id instead of the receiver's account id. We fixed this in #63089

ikevin127 · 2025-08-11T17:15:04Z

src/libs/ReportUtils.ts

+    if (isInvoiceReport(moneyRequestReport) && isManager) {
+        return false;
+    }


This check was missing an additional variable (isManager || isChatReportArchived) which led to this issue:

[HOLD for payment 2025-08-07] [$250] Invoices - Archived invoice report change to original amount when edit second time #65338

we applied the missing variable and fixed the issue by not allowing editing fields of an archived report.

VickyStash added 6 commits April 10, 2024 17:03

Partly update start, participants and confirmation steps to support i…

820276d

…nvoices

Implement send from (select sender) screen

b6689d3

Merge branch 'main' into feature/global-send-invoice

dd8d87b

# Conflicts: # src/pages/iou/request/IOURequestStartPage.js # src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js # src/pages/iou/request/step/withWritableReportOrNotFound.tsx

Implement send invoice functionality

059f946

Fix ts issues after merging main

56e3b9a

VickyStash commented Apr 12, 2024

View reviewed changes

src/languages/es.ts Show resolved Hide resolved

VickyStash commented Apr 12, 2024

View reviewed changes

src/styles/index.ts Outdated Show resolved Hide resolved

VickyStash added 10 commits April 12, 2024 10:41

Code improvements

23be9e4

IOU file updates and lint fixes

36b645e

Implement buildOptimisticInviteReportAction function

f611c60

Fix navigation

c4b0fdb

Fix invoice creation from global in invoice chat room already exists

ad6829b

Minor lint fix

8895b17

Enable add receipt file feature, lint fixes

7526db1

Minor UI fixes

e8f56c4

Fix translation

66e6a31

rezkiy37 mentioned this pull request Apr 15, 2024

[HOLD for payment 2024-05-08] CRITICAL: [Invoice Rooms] Implement Invoice rooms with individual receivers in the App #40013

Closed

VickyStash added 6 commits April 15, 2024 17:10

Fix report preview message

0c2b802

Merge branch 'main' into feature/global-send-invoice

290eeb4

# Conflicts: # src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js

Minor code improvements

d831b0d

Fix canSendInvoice check

531b3c5

Minor code improvements

dafdc75

Put iouCreatedAction to optimistic data

96aa755

rezkiy37 suggested changes Apr 16, 2024

View reviewed changes

rezkiy37 mentioned this pull request Apr 16, 2024

Implement Invoice rooms with individual receivers #40303

Merged

50 tasks

VickyStash added 3 commits April 17, 2024 09:53

Minor improvements

4d872eb

Update optimistic invoice room creation to include current user as a …

75f8b23

…member

danielrvidal mentioned this pull request Apr 29, 2024

[HOLD for payment 2024-05-09] CRITICAL [Invoice Rooms]: Update invoice rooms to use correct avatars #41261

Closed

github-actions bot mentioned this pull request Apr 29, 2024

Deploy Checklist: New Expensify 2024-04-29 #41266

Closed

74 tasks

lanitochka17 mentioned this pull request Apr 30, 2024

[HOLD for payment 2024-05-14][$250] Send invoice - Hide visibility and room name fields in the Settings page of the Invoice room #41280

Closed

6 tasks

marcaaron mentioned this pull request Apr 30, 2024

[HOLD for payment 2024-05-09] [HOLD for payment 2024-05-08] Send invoice - App returns to member list when selecting a workspace via keyboard #41271

Closed

6 tasks

MonilBhavsar mentioned this pull request Apr 30, 2024

[HOLD for payment 2024-05-22] Send invoice - Right caret disappears after editing and saving details several times #41287

Closed

6 tasks

VickyStash mentioned this pull request Apr 30, 2024

Update invoice rooms to use correct avatars and show correct threads subtitles #41316

Merged

50 tasks

roryabraham reviewed Jun 5, 2024

View reviewed changes

Pujan92 mentioned this pull request Jun 5, 2024

[HIGH][$250] Send invoice - Category is missing in confirmation page but it is present in invoice view #41281

Closed

6 tasks

shubham1206agra reviewed Aug 13, 2024

View reviewed changes

shubham1206agra mentioned this pull request Aug 13, 2024

[$250] Send invoice - Invoice thread name can renamed when created offline #43582

Closed

6 tasks

rayane-d reviewed Sep 10, 2024

View reviewed changes

rojiphil reviewed Sep 10, 2024

View reviewed changes

rojiphil mentioned this pull request Sep 10, 2024

[HOLD for Payment 2024-09-02] [$250] Send invoice - Individual workspace is in 'Send from' field #46705

Closed

6 tasks

rayane-d reviewed Oct 6, 2024

View reviewed changes

rayane-d mentioned this pull request Oct 6, 2024

[$250] Invoice - Category field does not show up on confirmation page after relogin #47922

Closed

6 tasks

hoangzinh reviewed Nov 10, 2024

View reviewed changes

mollfpr reviewed Jan 6, 2025

View reviewed changes

ikevin127 mentioned this pull request Jan 23, 2025

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

Closed

8 tasks

hoangzinh reviewed Jun 2, 2025

View reviewed changes

rojiphil reviewed Jun 26, 2025

View reviewed changes

ikevin127 reviewed Aug 11, 2025

View reviewed changes

	onClose={() => {
	if (!transaction?.transactionID && linkedTransactionID === '-1') {
	return;
	}

	if (transaction?.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD) {
	if (chatReport?.reportID && ReportUtils.getAddWorkspaceRoomOrChatReportErrors(chatReport)) {
	Report.navigateToConciergeChatAndDeleteReport(chatReport.reportID, true, true);
	return;
	}
	if (parentReportAction) {
	IOU.cleanUpMoneyRequest(transaction?.transactionID ?? linkedTransactionID, parentReportAction, true);
	return;
	}
	}

Conversation

VickyStash commented Apr 10, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Details

Fixed Issues

Tests

Offline tests

QA Steps

PR Author Checklist

Screenshots/Videos

Uh oh!

Uh oh!

Uh oh!

rezkiy37 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

puneetlath commented Apr 29, 2024

Uh oh!

VickyStash commented Apr 29, 2024

Uh oh!

danielrvidal commented Apr 29, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

OSBotify commented Apr 29, 2024

Uh oh!

OSBotify commented Apr 30, 2024

Uh oh!

OSBotify commented Apr 30, 2024

Uh oh!

MonilBhavsar commented Apr 30, 2024

Uh oh!

OSBotify commented May 1, 2024

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Pujan92 commented Jun 5, 2024

Uh oh!

Choose a reason for hiding this comment

Uh oh!

rayane-d Sep 10, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

19 participants

VickyStash commented Apr 10, 2024 •

edited

Loading

danielrvidal commented Apr 29, 2024 •

edited

Loading

rayane-d Sep 10, 2024 •

edited

Loading