[$250] Invoice preview avatar in Reports > Chats does not change to B2B after paying as business

[lanitochka17]

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.1.85-3
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: https://test-management.browserstack.com/projects/2148171/test-runs/TR-186/folder/12015329/39318020/801699079
Email or phone of affected tester (no customers): sdjoinsjosidnjsdo@gmail.com
Issue reported by: Applause - Internal Team

Action Performed:

Precondition:

• User A has a workspace with invoice feature enabled.
• User B has no workspace.

1. Go to staging.expensify.com
2. [User A] Open FAB > Send invoice.
3. [User A] Send an invoice to User B.
4. [User B] Open the invoice room.
5. [User B] Click Pay button > Pay as a business > Pay elsewhere.
6. [User B] Go to Reports > Chats.
7. [User B] Look for the invoice preview.

Expected Result:

The invoice preview avatar in Reports > Chats will change to B2B invoice avatar (with two workspace avatars) after paying as business

Actual Result:

The invoice preview avatar in Reports > Chats does not change to B2B invoice avatar (with two workspace avatars) after paying as business

Workaround:

Unknown

Platforms:

Select the officially supported platforms where the issue was reproduced:

• Android: App
• Android: mWeb Chrome
• iOS: App
• iOS: mWeb Safari
• iOS: mWeb Chrome
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Platforms Tested:

On which of our officially supported platforms was this issue tested:

• Android: App
• Android: mWeb Chrome
• iOS: App
• iOS: mWeb Safari
• iOS: mWeb Chrome
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Bug6897572_1753370478239.20250724_231700.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021950424021604652716
• Upwork Job ID: 1950424021604652716
• Last Price Increase: 2025-07-30

Issue Owner

Current Issue Owner: @Beamanator

[melvin-bot]

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

[bernhardoj]

Proposal

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

The invoice room avatar doesn't change to both WS avatar in Reports page.

What is the root cause of that problem?

The avatar is from useReportAvatarDetails. In ReportScreen, displayAllActors is true and it already has a logic to show WS avatar when the invoice receiver is WS.

App/src/hooks/useReportAvatarDetails.ts

Lines 155 to 175 in d4dd40a

	if (displayAllActors) {
	const secondaryAccountId = ownerAccountID === actorAccountID || isInvoiceReport ? actorAccountID : ownerAccountID;
	const secondaryUserAvatar = personalDetails?.[secondaryAccountId ?? -1]?.avatar ?? FallbackAvatar;
	const secondaryDisplayName = getDisplayNameForParticipant({accountID: secondaryAccountId});
	const secondaryPolicyAvatar = invoiceReceiverPolicy?.avatarURL ?? getDefaultWorkspaceAvatar(invoiceReceiverPolicy?.name);
	const isWorkspaceInvoice = isInvoiceRoom(report) && !isIndividualInvoiceRoom(report);
	return isWorkspaceInvoice
	? {
	source: secondaryPolicyAvatar,
	type: CONST.ICON_TYPE_WORKSPACE,
	name: invoiceReceiverPolicy?.name,
	id: invoiceReceiverPolicy?.id,
	}
	: {
	source: secondaryUserAvatar,
	type: CONST.ICON_TYPE_AVATAR,
	name: secondaryDisplayName ?? '',
	id: secondaryAccountId,
	};
	}

But in search page, displayAllActors is false and inside this if block, we always show the user avatar.

App/src/hooks/useReportAvatarDetails.ts

Lines 185 to 196 in d4dd40a

	if (isInvoiceReportUtils(iouReport)) {
	const secondaryAccountId = iouReport?.managerID ?? CONST.DEFAULT_NUMBER_ID;
	const secondaryUserAvatar = personalDetails?.[secondaryAccountId ?? -1]?.avatar ?? FallbackAvatar;
	const secondaryDisplayName = getDisplayNameForParticipant({accountID: secondaryAccountId});
	return {
	source: secondaryUserAvatar,
	type: CONST.ICON_TYPE_AVATAR,
	name: secondaryDisplayName,
	id: secondaryAccountId,
	};
	}

displayAllActors is true in report screen because reportPreviewSenderID is undefined.

App/src/hooks/useReportAvatarDetails.ts

Line 92 in 76e3fe5

const displayAllActors = isReportPreviewAction && !isTripRoom && !isPolicyExpenseChat(report) && !reportPreviewSenderID;

reportPreviewSenderID value is from singleAvatarAccountID if isThereOnlyOneAttendee.

App/src/hooks/useReportAvatarDetails.ts

Line 272 in 76e3fe5

const reportPreviewSenderID = areAmountsSignsTheSame && isThereOnlyOneAttendee ? singleAvatarAccountID : undefined;

App/src/hooks/useReportAvatarDetails.ts

Line 270 in 76e3fe5

const singleAvatarAccountID = isSendMoneyFlow ? action.childManagerAccountID : action?.childOwnerAccountID;

In report screen, the action doesn't have childOwnerAccountID, but in search page it has. If we look at the hook getIconDetails function, we get the owner account ID from the IOU report and fallback to the action childOwnerAccountID.

App/src/hooks/useReportAvatarDetails.ts

Line 82 in 76e3fe5

const ownerAccountID = iouReport?.ownerAccountID ?? action?.childOwnerAccountID;

If we apply this to the hook too, then both report screen and search page will show user avatar instead of workspace.

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

We need to check for workspace invoice receiver for invoice report case too.

if (isInvoiceReportUtils(iouReport)) {
    const secondaryAccountId = iouReport?.managerID ?? CONST.DEFAULT_NUMBER_ID;
    const secondaryUserAvatar = personalDetails?.[secondaryAccountId ?? -1]?.avatar ?? FallbackAvatar;
    const secondaryDisplayName = getDisplayNameForParticipant({accountID: secondaryAccountId});
    const secondaryPolicyAvatar = invoiceReceiverPolicy?.avatarURL ?? getDefaultWorkspaceAvatar(invoiceReceiverPolicy?.name);
    const isWorkspaceInvoice = isInvoiceRoom(report) && !isIndividualInvoiceRoom(report);

    return isWorkspaceInvoice
        ? {
                source: secondaryPolicyAvatar,
                type: CONST.ICON_TYPE_WORKSPACE,
                name: invoiceReceiverPolicy?.name,
                id: invoiceReceiverPolicy?.id,
            }
        : {
                source: secondaryUserAvatar,
                type: CONST.ICON_TYPE_AVATAR,
                name: secondaryDisplayName ?? '',
                id: secondaryAccountId,
            };
}

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

Test the useReporAvatarDetails hook to verify that the secondary avatar is the WS avatar when the invoice receiver is WS.

[melvin-bot]

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

[melvin-bot]

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

[jayeshmangwani]

@bernhardoj 's proposal #67084 (comment) works well, we can move forward with adding the workspace invoice condition for getting a secondary avatar.

🎀 👀 🎀 C+ reviewed