Merge pull request #49158 from software-mansion-labs/kicu/48582-fix-r…

…eport-fake Stop displaying User info in SearchResults row if user missing or fake
Expensify · Sep 16, 2024 · 3b850e8 · 3b850e8
2 parents 6eb9396 + 77bc236
commit 3b850e8
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 10 deletions.
diff --git a/src/components/SelectionList/Search/ExpenseItemHeaderNarrow.tsx b/src/components/SelectionList/Search/ExpenseItemHeaderNarrow.tsx
@@ -7,6 +7,7 @@ import {PressableWithFeedback} from '@components/Pressable';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
+import * as SearchUtils from '@libs/SearchUtils';
 import variables from '@styles/variables';
 import CONST from '@src/CONST';
 import type {SearchPersonalDetails, SearchTransactionAction} from '@src/types/onyx/SearchResults';
@@ -48,6 +49,9 @@ function ExpenseItemHeaderNarrow({
     const StyleUtils = useStyleUtils();
     const theme = useTheme();
 
+    // It might happen that we are missing display names for `From` or `To`, we only display arrow icon if both names exist
+    const shouldDisplayArrowIcon = SearchUtils.isCorrectSearchUserName(participantFromDisplayName) && SearchUtils.isCorrectSearchUserName(participantToDisplayName);
+
     return (
         <View style={[styles.flex1, styles.flexRow, styles.alignItemsCenter, styles.justifyContentBetween, styles.mb3, styles.gap2, containerStyle]}>
             <View style={[styles.flexRow, styles.alignItemsCenter, styles.gap2, styles.flex1]}>
@@ -77,12 +81,14 @@ function ExpenseItemHeaderNarrow({
                         displayName={participantFromDisplayName}
                     />
                 </View>
-                <Icon
-                    src={Expensicons.ArrowRightLong}
-                    width={variables.iconSizeXXSmall}
-                    height={variables.iconSizeXXSmall}
-                    fill={theme.icon}
-                />
+                {shouldDisplayArrowIcon && (
+                    <Icon
+                        src={Expensicons.ArrowRightLong}
+                        width={variables.iconSizeXXSmall}
+                        height={variables.iconSizeXXSmall}
+                        fill={theme.icon}
+                    />
+                )}
                 <View style={[styles.flex1, styles.mw50]}>
                     <UserInfoCell
                         participant={participantTo}

diff --git a/src/components/SelectionList/Search/UserInfoCell.tsx b/src/components/SelectionList/Search/UserInfoCell.tsx
@@ -4,6 +4,7 @@ import Avatar from '@components/Avatar';
 import Text from '@components/Text';
 import useResponsiveLayout from '@hooks/useResponsiveLayout';
 import useThemeStyles from '@hooks/useThemeStyles';
+import * as SearchUtils from '@libs/SearchUtils';
 import CONST from '@src/CONST';
 import type {SearchPersonalDetails} from '@src/types/onyx/SearchResults';
 
@@ -17,6 +18,10 @@ function UserInfoCell({participant, displayName}: UserInfoCellProps) {
     const {isLargeScreenWidth} = useResponsiveLayout();
     const avatarURL = participant?.avatar;
 
+    if (!SearchUtils.isCorrectSearchUserName(displayName)) {
+        return null;
+    }
+
     return (
         <View style={[styles.flexRow, styles.alignItemsCenter]}>
             <Avatar

diff --git a/src/libs/SearchUtils.ts b/src/libs/SearchUtils.ts
@@ -58,6 +58,13 @@ const operatorToSignMap = {
     [CONST.SEARCH.SYNTAX_OPERATORS.OR]: ' ' as const,
 };
 
+const emptyPersonalDetails = {
+    accountID: CONST.REPORT.OWNER_ACCOUNT_ID_FAKE,
+    avatar: '',
+    displayName: undefined,
+    login: undefined,
+};
+
 /**
  * @private
  */
@@ -177,7 +184,7 @@ function getTransactionsSections(data: OnyxTypes.SearchResults['data'], metadata
         .map((key) => {
             const transactionItem = data[key];
             const from = data.personalDetailsList?.[transactionItem.accountID];
-            const to = data.personalDetailsList?.[transactionItem.managerID];
+            const to = transactionItem.managerID ? data.personalDetailsList?.[transactionItem.managerID] : emptyPersonalDetails;
 
             const {formattedFrom, formattedTo, formattedTotal, formattedMerchant, date} = getTransactionItemCommonFormattedProperties(transactionItem, from, to);
 
@@ -225,7 +232,7 @@ function getReportActionsSections(data: OnyxTypes.SearchResults['data']): Report
 }
 
 function getIOUReportName(data: OnyxTypes.SearchResults['data'], reportItem: SearchReport) {
-    const payerPersonalDetails = data.personalDetailsList?.[reportItem.managerID ?? 0];
+    const payerPersonalDetails = reportItem.managerID ? data.personalDetailsList?.[reportItem.managerID] : emptyPersonalDetails;
     const payerName = 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) {
@@ -262,7 +269,7 @@ function getReportSections(data: OnyxTypes.SearchResults['data'], metadata: Onyx
                 ...reportItem,
                 keyForList: reportItem.reportID,
                 from: data.personalDetailsList?.[reportItem.accountID ?? -1],
-                to: data.personalDetailsList?.[reportItem.managerID ?? -1],
+                to: reportItem.managerID ? data.personalDetailsList?.[reportItem.managerID] : emptyPersonalDetails,
                 transactions,
                 reportName: isIOUReport ? getIOUReportName(data, reportItem) : reportItem.reportName,
             };
@@ -271,7 +278,7 @@ function getReportSections(data: OnyxTypes.SearchResults['data'], metadata: Onyx
             const reportKey = `${ONYXKEYS.COLLECTION.REPORT}${transactionItem.reportID}`;
 
             const from = data.personalDetailsList?.[transactionItem.accountID];
-            const to = data.personalDetailsList?.[transactionItem.managerID];
+            const to = transactionItem.managerID ? data.personalDetailsList?.[transactionItem.managerID] : emptyPersonalDetails;
 
             const {formattedFrom, formattedTo, formattedTotal, formattedMerchant, date} = getTransactionItemCommonFormattedProperties(transactionItem, from, to);
 
@@ -801,6 +808,10 @@ function isCannedSearchQuery(queryJSON: SearchQueryJSON) {
     return !queryJSON.filters;
 }
 
+function isCorrectSearchUserName(displayName?: string) {
+    return displayName && displayName.toUpperCase() !== CONST.REPORT.OWNER_EMAIL_FAKE;
+}
+
 export {
     buildQueryStringFromFilterValues,
     buildSearchQueryJSON,
@@ -823,4 +834,5 @@ export {
     isCannedSearchQuery,
     getExpenseTypeTranslationKey,
     getOverflowMenu,
+    isCorrectSearchUserName,
 };