fix: report title is incorrect for IOU grouped expense in search page

src/libs/SearchUtils.ts

@@ -11,8 +11,19 @@ import type {SearchAdvancedFiltersForm} from '@src/types/form';
 import FILTER_KEYS from '@src/types/form/SearchAdvancedFiltersForm';
 import type * as OnyxTypes from '@src/types/onyx';
 import type SearchResults from '@src/types/onyx/SearchResults';
-import type {ListItemDataType, ListItemType, SearchAccountDetails, SearchDataTypes, SearchPersonalDetails, SearchTransaction} from '@src/types/onyx/SearchResults';
+import type {
+    ListItemDataType,
+    ListItemType,
+    SearchAccountDetails,
+    SearchDataTypes,
+    SearchPersonalDetails,
+    SearchPolicyDetails,
+    SearchReport,
+    SearchTransaction,
+} from '@src/types/onyx/SearchResults';
+import * as CurrencyUtils from './CurrencyUtils';
 import DateUtils from './DateUtils';
+import {translateLocal} from './Localize';
 import navigationRef from './Navigation/navigationRef';
 import type {AuthScreensParamList, BottomTabNavigatorParamList, RootStackParamList, State} from './Navigation/types';
 import * as searchParser from './SearchParser/searchParser';
@@ -173,6 +184,21 @@ function getTransactionsSections(data: OnyxTypes.SearchResults['data'], metadata
         });
 }
 
+function getIOUReportName(data: OnyxTypes.SearchResults['data'], reportItem: SearchTransaction & Record<string, SearchPersonalDetails> & SearchPolicyDetails & SearchReport) {
+    const payerPersonalDetails = data.personalDetailsList?.[reportItem.managerID] as SearchAccountDetails;
+    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+    const payerName = payerPersonalDetails?.name || payerPersonalDetails?.displayName || payerPersonalDetails?.login || translateLocal('common.hidden');
+    const formattedAmount = CurrencyUtils.convertToDisplayString(reportItem.total ?? 0, reportItem?.currency ?? CONST.CURRENCY.USD);
+    if (reportItem.action === CONST.SEARCH.ACTION_TYPES.VIEW) {
+        return translateLocal('iou.payerOwesAmount', {payer: payerName, amount: formattedAmount});
+    }
+
+    return translateLocal('iou.payerPaidAmount', {
+        payer: payerName,
+        amount: formattedAmount,
+    });
+}
+
 function getReportSections(data: OnyxTypes.SearchResults['data'], metadata: OnyxTypes.SearchResults['search']): ReportListItemType[] {
     const shouldShowMerchant = getShouldShowMerchant(data);
 
@@ -185,6 +211,7 @@ function getReportSections(data: OnyxTypes.SearchResults['data'], metadata: Onyx
             const reportKey = `${ONYXKEYS.COLLECTION.REPORT}${reportItem.reportID}`;
             const transactions = reportIDToTransactions[reportKey]?.transactions ?? [];
             const isExpenseReport = reportItem.type === CONST.REPORT.TYPE.EXPENSE;
+            const isIOUReport = reportItem.type === CONST.REPORT.TYPE.IOU;
 
             const to = isExpenseReport
                 ? (data[`${ONYXKEYS.COLLECTION.POLICY}${reportItem.policyID}`] as SearchAccountDetails)
@@ -196,6 +223,7 @@ function getReportSections(data: OnyxTypes.SearchResults['data'], metadata: Onyx
                 from: data.personalDetailsList?.[reportItem.accountID],
                 to,
                 transactions,
+                reportName: isIOUReport ? getIOUReportName(data, reportItem) : reportItem.reportName,
             };
         } else if (key.startsWith(ONYXKEYS.COLLECTION.TRANSACTION)) {
             const transactionItem = {...data[key]};