Merge pull request Expensify#63985 from software-mansion-labs/@szymczak/fix-showing-expense-recipent-on-narrow-reports-page

Show expense recipent even when recipent is the same as submitter

Author: mountiny

src/components/SelectionList/Search/UserInfoAndActionButtonRow.tsx

@@ -24,8 +24,7 @@ function UserInfoAndActionButtonRow({
     const hasToRecipient = !!item?.to && !!item?.to?.accountID && !!item?.to?.displayName;
     const participantFromDisplayName = item?.from?.displayName ?? item?.from?.login ?? translate('common.hidden');
     const participantToDisplayName = item?.to?.displayName ?? item?.to?.login ?? translate('common.hidden');
-    const shouldShowToRecipient =
-        hasFromSender && hasToRecipient && !!item?.to?.accountID && item?.from?.accountID !== item?.to?.accountID && !!isCorrectSearchUserName(participantToDisplayName);
+    const shouldShowToRecipient = hasFromSender && hasToRecipient && !!item?.to?.accountID && !!isCorrectSearchUserName(participantToDisplayName);
 
     return (
         <View style={[styles.pt0, styles.flexRow, styles.alignItemsCenter, shouldShowUserInfo ? styles.justifyContentBetween : styles.justifyContentEnd, styles.gap2, styles.ph3]}>

tests/ui/ReportListItemHeaderTest.tsx

@@ -138,13 +138,13 @@ describe('ReportListItemHeader', () => {
                 expect(screen.queryByTestId('ArrowRightLong Icon')).not.toBeOnTheScreen();
             });
 
-            it('should only display submitter if submitter and recipient are the same', async () => {
+            it('should display submitter and receiver, even if submitter and recipient are the same', async () => {
                 const reportItem = createReportListItem(CONST.REPORT.TYPE.IOU, 'john', 'john');
                 renderReportListItemHeader(reportItem);
                 await waitForBatchedUpdates();
 
-                expect(screen.getByText('John Doe')).toBeOnTheScreen();
-                expect(screen.queryByTestId('ArrowRightLong Icon')).not.toBeOnTheScreen();
+                expect(screen.getAllByText('John Doe')).toHaveLength(2);
+                expect(screen.getByTestId('ArrowRightLong Icon')).toBeOnTheScreen();
             });
 
             it('should not render anything if neither submitter nor recipient is present', async () => {
@@ -184,13 +184,13 @@ describe('ReportListItemHeader', () => {
                 expect(screen.queryByTestId('ArrowRightLong Icon')).not.toBeOnTheScreen();
             });
 
-            it('should only display submitter if submitter and recipient are the same', async () => {
+            it('should display submitter and receiver, even if submitter and recipient are the same', async () => {
                 const reportItem = createReportListItem(CONST.REPORT.TYPE.EXPENSE, 'john', 'john');
                 renderReportListItemHeader(reportItem);
                 await waitForBatchedUpdates();
 
-                expect(screen.getByText('John Doe')).toBeOnTheScreen();
-                expect(screen.queryByTestId('ArrowRightLong Icon')).not.toBeOnTheScreen();
+                expect(screen.getAllByText('John Doe')).toHaveLength(2);
+                expect(screen.getByTestId('ArrowRightLong Icon')).toBeOnTheScreen();
             });
 
             it('should not render anything if no participants are present', async () => {