From 649b4e1704759907c21c161159fb6fb0e55001bd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lucien=20Akchot=C3=A9?= <lucien@expensify.com>
Date: Thu, 10 Oct 2024 13:21:56 +0200
Subject: [PATCH] Revert "[ReportPreview / Text] When showing two avatars, also
 show both display names with tooltip"

---
 .../home/report/ReportActionItemSingle.tsx    | 125 ++++--------------
 1 file changed, 26 insertions(+), 99 deletions(-)

diff --git a/src/pages/home/report/ReportActionItemSingle.tsx b/src/pages/home/report/ReportActionItemSingle.tsx
index 0ed4ae66578..88955766c99 100644
--- a/src/pages/home/report/ReportActionItemSingle.tsx
+++ b/src/pages/home/report/ReportActionItemSingle.tsx
@@ -150,40 +150,24 @@ function ReportActionItemSingle({
     } else {
         secondaryAvatar = {name: '', source: '', type: 'avatar'};
     }
-    const icon = useMemo(
-        () => ({
-            source: avatarSource ?? FallbackAvatar,
-            type: isWorkspaceActor ? CONST.ICON_TYPE_WORKSPACE : CONST.ICON_TYPE_AVATAR,
-            name: primaryDisplayName ?? '',
-            id: avatarId,
-        }),
-        [avatarSource, isWorkspaceActor, primaryDisplayName, avatarId],
-    );
+    const icon = {
+        source: avatarSource ?? FallbackAvatar,
+        type: isWorkspaceActor ? CONST.ICON_TYPE_WORKSPACE : CONST.ICON_TYPE_AVATAR,
+        name: primaryDisplayName ?? '',
+        id: avatarId,
+    };
 
     // Since the display name for a report action message is delivered with the report history as an array of fragments
     // we'll need to take the displayName from personal details and have it be in the same format for now. Eventually,
     // we should stop referring to the report history items entirely for this information.
-    const personArray = useMemo(() => {
-        const baseArray = displayName
-            ? [
-                  {
-                      type: 'TEXT',
-                      text: displayName,
-                  },
-              ]
-            : [action?.person?.at(0)] ?? [];
-
-        if (displayAllActors && secondaryAvatar?.name) {
-            return [
-                ...baseArray,
-                {
-                    type: 'TEXT',
-                    text: secondaryAvatar?.name ?? '',
-                },
-            ];
-        }
-        return baseArray;
-    }, [displayName, action?.person, displayAllActors, secondaryAvatar?.name]);
+    const personArray = displayName
+        ? [
+              {
+                  type: 'TEXT',
+                  text: displayName,
+              },
+          ]
+        : action?.person;
 
     const reportID = report?.reportID;
     const iouReportID = iouReport?.reportID;
@@ -247,74 +231,6 @@ function ReportActionItemSingle({
             </UserDetailsTooltip>
         );
     };
-
-    const getHeading = useCallback(() => {
-        return () => {
-            if (displayAllActors && personArray.length === 2 && isReportPreviewAction) {
-                return (
-                    <View style={[styles.flexRow]}>
-                        <ReportActionItemFragment
-                            style={[styles.flex1]}
-                            key={`person-${action?.reportActionID}-${0}`}
-                            accountID={actorAccountID ?? -1}
-                            fragment={{...personArray.at(0), type: 'TEXT', text: displayName ?? ''}}
-                            delegateAccountID={action?.delegateAccountID}
-                            isSingleLine
-                            actorIcon={icon}
-                            moderationDecision={getReportActionMessage(action)?.moderationDecision?.decision}
-                        />
-                        <Text
-                            numberOfLines={1}
-                            style={[styles.chatItemMessageHeaderSender, styles.pre]}
-                        >
-                            {` & `}
-                        </Text>
-                        <ReportActionItemFragment
-                            style={[styles.flex1]}
-                            key={`person-${action?.reportActionID}-${1}`}
-                            accountID={parseInt(`${secondaryAvatar?.id ?? -1}`, 10)}
-                            fragment={{...personArray.at(1), type: 'TEXT', text: secondaryAvatar.name ?? ''}}
-                            delegateAccountID={action?.delegateAccountID}
-                            isSingleLine
-                            actorIcon={secondaryAvatar}
-                            moderationDecision={getReportActionMessage(action)?.moderationDecision?.decision}
-                        />
-                    </View>
-                );
-            }
-            return (
-                <View>
-                    {personArray.map((fragment, index) => (
-                        <ReportActionItemFragment
-                            style={[styles.flex1]}
-                            // eslint-disable-next-line react/no-array-index-key
-                            key={`person-${action?.reportActionID}-${index}`}
-                            accountID={actorAccountID ?? -1}
-                            fragment={{...fragment, type: fragment?.type ?? '', text: fragment?.text ?? ''}}
-                            delegateAccountID={action?.delegateAccountID}
-                            isSingleLine
-                            actorIcon={icon}
-                            moderationDecision={getReportActionMessage(action)?.moderationDecision?.decision}
-                        />
-                    ))}
-                </View>
-            );
-        };
-    }, [
-        displayAllActors,
-        secondaryAvatar,
-        isReportPreviewAction,
-        personArray,
-        styles.flexRow,
-        styles.flex1,
-        styles.chatItemMessageHeaderSender,
-        styles.pre,
-        action,
-        actorAccountID,
-        displayName,
-        icon,
-    ]);
-
     const hasEmojiStatus = !displayAllActors && status?.emojiCode;
     const formattedDate = DateUtils.getStatusUntilDate(status?.clearAfter ?? '');
     const statusText = status?.text ?? '';
@@ -345,7 +261,18 @@ function ReportActionItemSingle({
                             accessibilityLabel={actorHint}
                             role={CONST.ROLE.BUTTON}
                         >
-                            {getHeading()}
+                            {personArray?.map((fragment, index) => (
+                                <ReportActionItemFragment
+                                    // eslint-disable-next-line react/no-array-index-key
+                                    key={`person-${action?.reportActionID}-${index}`}
+                                    accountID={actorAccountID ?? -1}
+                                    fragment={{...fragment, type: fragment.type ?? '', text: fragment.text ?? ''}}
+                                    delegateAccountID={action?.delegateAccountID}
+                                    isSingleLine
+                                    actorIcon={icon}
+                                    moderationDecision={getReportActionMessage(action)?.moderationDecision?.decision}
+                                />
+                            ))}
                         </PressableWithoutFeedback>
                         {!!hasEmojiStatus && (
                             <Tooltip text={statusTooltipText}>