From 4a8cdc2cc6965a4fb06c15a2f812dab0ef5637e1 Mon Sep 17 00:00:00 2001 From: VickyStash Date: Tue, 30 Apr 2024 12:52:14 +0200 Subject: [PATCH 1/3] Update invoice rooms to use correct avatars --- src/libs/ReportUtils.ts | 25 +++++++++++++++++-- .../home/report/ReportActionItemCreated.tsx | 6 ++++- .../home/report/ReportActionItemSingle.tsx | 16 ++++++------ 3 files changed, 37 insertions(+), 10 deletions(-) diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts index 038357c86cbc..27b072c295e4 100644 --- a/src/libs/ReportUtils.ts +++ b/src/libs/ReportUtils.ts @@ -874,6 +874,14 @@ function isInvoiceRoom(report: OnyxEntry): boolean { return getChatType(report) === CONST.REPORT.CHAT_TYPE.INVOICE; } +function isCurrentUserInvoiceReceiver(report: OnyxEntry): boolean { + if (report?.invoiceReceiver?.type === CONST.REPORT.INVOICE_RECEIVER_TYPE.INDIVIDUAL) { + return currentUserAccountID === report.invoiceReceiver.accountID; + } + + return false; +} + /** * Whether the provided report belongs to a Control policy and is an expense chat */ @@ -1929,8 +1937,20 @@ function getIcons( return [domainIcon]; } if (isAdminRoom(report) || isAnnounceRoom(report) || isChatRoom(report) || isArchivedRoom(report)) { - const workspaceIcon = getWorkspaceIcon(report, policy); - return [workspaceIcon]; + const icons = [getWorkspaceIcon(report, policy)]; + + if (isInvoiceRoom(report)) { + if (report?.invoiceReceiver?.type === CONST.REPORT.INVOICE_RECEIVER_TYPE.INDIVIDUAL) { + icons.push(...getIconsForParticipants([report?.invoiceReceiver.accountID], personalDetails)); + } else { + const receiverPolicy = getPolicy(report?.invoiceReceiver?.policyID); + if (!isEmptyObject(receiverPolicy)) { + icons.push(getWorkspaceIcon(report, receiverPolicy)); + } + } + } + + return icons; } if (isPolicyExpenseChat(report) || isExpenseReport(report)) { const workspaceIcon = getWorkspaceIcon(report, policy); @@ -6673,6 +6693,7 @@ export { buildOptimisticInvoiceReport, buildOptimisticInviteReportAction, getInvoiceChatByParticipants, + isCurrentUserInvoiceReceiver, }; export type { diff --git a/src/pages/home/report/ReportActionItemCreated.tsx b/src/pages/home/report/ReportActionItemCreated.tsx index 5446cd35e835..2af71cb40e4c 100644 --- a/src/pages/home/report/ReportActionItemCreated.tsx +++ b/src/pages/home/report/ReportActionItemCreated.tsx @@ -47,9 +47,13 @@ function ReportActionItemCreated(props: ReportActionItemCreatedProps) { return null; } - const icons = ReportUtils.getIcons(props.report, props.personalDetails); + let icons = ReportUtils.getIcons(props.report, props.personalDetails); const shouldDisableDetailPage = ReportUtils.shouldDisableDetailPage(props.report); + if (ReportUtils.isInvoiceRoom(props.report) && ReportUtils.isCurrentUserInvoiceReceiver(props.report)) { + icons = [...icons].reverse(); + } + return ( action?.actionName === CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW && iouReport && !ReportUtils.isInvoiceReport(iouReport), - [action?.actionName, iouReport], - ); - const isWorkspaceActor = ReportUtils.isInvoiceReport(iouReport ?? {}) || (ReportUtils.isPolicyExpenseChat(report) && (!actorAccountID || displayAllActors)); + const displayAllActors = useMemo(() => action?.actionName === CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW && iouReport, [action?.actionName, iouReport]); + const isInvoiceReport = ReportUtils.isInvoiceReport(iouReport ?? {}); + const isWorkspaceActor = isInvoiceReport || (ReportUtils.isPolicyExpenseChat(report) && (!actorAccountID || displayAllActors)); let avatarSource = UserUtils.getAvatar(avatar ?? '', actorAccountID); if (isWorkspaceActor) { @@ -110,10 +108,14 @@ function ReportActionItemSingle({ const primaryDisplayName = displayName; if (displayAllActors) { // The ownerAccountID and actorAccountID can be the same if the a user submits an expense back from the IOU's original creator, in that case we need to use managerID to avoid displaying the same user twice - const secondaryAccountId = iouReport?.ownerAccountID === actorAccountID ? iouReport?.managerID : iouReport?.ownerAccountID; + const secondaryAccountId = iouReport?.ownerAccountID === actorAccountID || isInvoiceReport ? iouReport?.managerID : iouReport?.ownerAccountID; const secondaryUserAvatar = personalDetails?.[secondaryAccountId ?? -1]?.avatar ?? ''; const secondaryDisplayName = ReportUtils.getDisplayNameForParticipant(secondaryAccountId); - displayName = `${primaryDisplayName} & ${secondaryDisplayName}`; + + if (!isInvoiceReport) { + displayName = `${primaryDisplayName} & ${secondaryDisplayName}`; + } + secondaryAvatar = { source: UserUtils.getAvatar(secondaryUserAvatar, secondaryAccountId), type: CONST.ICON_TYPE_AVATAR, From 2182e9a2a1901b64d2b7662fcd23490f90ff4c5b Mon Sep 17 00:00:00 2001 From: VickyStash Date: Tue, 30 Apr 2024 17:18:50 +0200 Subject: [PATCH 2/3] Hide receipt empty state for invoices --- .../ReportActionItem/MoneyRequestView.tsx | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx index a26c368ae170..751b06a4c685 100644 --- a/src/components/ReportActionItem/MoneyRequestView.tsx +++ b/src/components/ReportActionItem/MoneyRequestView.tsx @@ -134,6 +134,7 @@ function MoneyRequestView({ const isCardTransaction = TransactionUtils.isCardTransaction(transaction); const cardProgramName = isCardTransaction && transactionCardID !== undefined ? CardUtils.getCardDescription(transactionCardID) : ''; const isApproved = ReportUtils.isReportApproved(moneyRequestReport); + const isInvoice = ReportUtils.isInvoiceReport(moneyRequestReport); const taxRates = policy?.taxRates; const formattedTaxAmount = CurrencyUtils.convertToDisplayString(transactionTaxAmount, transactionCurrency); @@ -332,7 +333,7 @@ function MoneyRequestView({ ); const shouldShowMapOrReceipt = showMapAsImage || hasReceipt; - const shouldShowReceiptEmptyState = !hasReceipt && (canEditReceipt || isAdmin || isApprover); + const shouldShowReceiptEmptyState = !hasReceipt && !isInvoice && (canEditReceipt || isAdmin || isApprover); const noticeTypeViolations = transactionViolations?.filter((violation) => violation.type === 'notice').map((v) => ViolationsUtils.getViolationTranslation(v, translate)) ?? []; const shouldShowNotesViolations = !isReceiptBeingScanned && canUseViolations && ReportUtils.isPaidGroupPolicy(report); @@ -340,10 +341,12 @@ function MoneyRequestView({ {shouldShowAnimatedBackground && } - + {!isInvoice && ( + + )} {shouldShowMapOrReceipt && ( Date: Tue, 30 Apr 2024 18:17:17 +0200 Subject: [PATCH 3/3] Fix invoice room thread header --- src/libs/ReportUtils.ts | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts index 27b072c295e4..c1d572c46e26 100644 --- a/src/libs/ReportUtils.ts +++ b/src/libs/ReportUtils.ts @@ -3181,15 +3181,15 @@ function getPayeeName(report: OnyxEntry): string | undefined { * Get either the policyName or domainName the chat is tied to */ function getChatRoomSubtitle(report: OnyxEntry): string | undefined { - if (isInvoiceRoom(report)) { - return Localize.translateLocal('workspace.common.invoices'); - } if (isChatThread(report)) { return ''; } if (isSelfDM(report)) { return Localize.translateLocal('reportActionsView.yourSpace'); } + if (isInvoiceRoom(report)) { + return Localize.translateLocal('workspace.common.invoices'); + } if (!isDefaultRoom(report) && !isUserCreatedPolicyRoom(report) && !isPolicyExpenseChat(report)) { return ''; } @@ -3203,9 +3203,6 @@ function getChatRoomSubtitle(report: OnyxEntry): string | undefined { if (isArchivedRoom(report)) { return report?.oldPolicyName ?? ''; } - if (isInvoiceRoom(report)) { - return Localize.translateLocal('workspace.common.invoices'); - } return getPolicyName(report); } @@ -3226,7 +3223,7 @@ function getParentNavigationSubtitle(report: OnyxEntry): ParentNavigatio return {}; } - if (isInvoiceReport(report)) { + if (isInvoiceReport(report) || isInvoiceRoom(parentReport)) { return {reportName: `${getPolicyName(parentReport)} & ${getInvoicePayerName(parentReport)}`}; }