From d6c7de8c66e76573fcc17af571d32eead803f76c Mon Sep 17 00:00:00 2001 From: SP Singh <19812199+spcheema@users.noreply.github.com> Date: Wed, 16 Aug 2023 22:36:20 +1000 Subject: [PATCH 1/8] Display participants list when there are multiple avatars for IOU report preview --- src/pages/ReportParticipantsPage.js | 7 ++++++- src/pages/home/report/ReportActionItemSingle.js | 7 ++++++- 2 files changed, 12 insertions(+), 2 deletions(-) diff --git a/src/pages/ReportParticipantsPage.js b/src/pages/ReportParticipantsPage.js index 267e7f7b60a5..7920bb33ffa6 100755 --- a/src/pages/ReportParticipantsPage.js +++ b/src/pages/ReportParticipantsPage.js @@ -55,7 +55,12 @@ const defaultProps = { * @return {Array} */ const getAllParticipants = (report, personalDetails, translate) => { - const {participantAccountIDs} = report; + let participantAccountIDs = report.participantAccountIDs; + + // Append report owner when the given report is IOU + if (ReportUtils.isIOUReport(report)) { + participantAccountIDs = [...participantAccountIDs, report.ownerAccountID]; + } return _.chain(participantAccountIDs) .map((accountID, index) => { diff --git a/src/pages/home/report/ReportActionItemSingle.js b/src/pages/home/report/ReportActionItemSingle.js index c00f98c613e4..1a30cae89756 100644 --- a/src/pages/home/report/ReportActionItemSingle.js +++ b/src/pages/home/report/ReportActionItemSingle.js @@ -144,9 +144,14 @@ function ReportActionItemSingle(props) { if (isWorkspaceActor) { showWorkspaceDetails(props.report.reportID); } else { + // Show participants page IOU report preview + if (displayAllActors) { + Navigation.navigate(ROUTES.getReportParticipantsRoute(props.iouReport.reportID)); + return; + } showUserDetails(props.action.delegateAccountID ? props.action.delegateAccountID : actorAccountID); } - }, [isWorkspaceActor, props.report.reportID, actorAccountID, props.action.delegateAccountID]); + }, [isWorkspaceActor, props.report.reportID, actorAccountID, props.action.delegateAccountID, props.iouReport.reportID, displayAllActors]); const shouldDisableDetailPage = useMemo( () => !isWorkspaceActor && ReportUtils.isOptimisticPersonalDetail(props.action.delegateAccountID ? props.action.delegateAccountID : actorAccountID), From d162c915a5b8606ed0aebecdc09cca2d2eb56635 Mon Sep 17 00:00:00 2001 From: SP Singh <19812199+spcheema@users.noreply.github.com> Date: Thu, 17 Aug 2023 18:32:21 +1000 Subject: [PATCH 2/8] Memoized dependency variable --- src/pages/home/report/ReportActionItemSingle.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/report/ReportActionItemSingle.js b/src/pages/home/report/ReportActionItemSingle.js index 1a30cae89756..872ac6f8adbe 100644 --- a/src/pages/home/report/ReportActionItemSingle.js +++ b/src/pages/home/report/ReportActionItemSingle.js @@ -111,7 +111,7 @@ function ReportActionItemSingle(props) { // If this is a report preview, display names and avatars of both people involved let secondaryAvatar = {}; - const displayAllActors = props.action.actionName === CONST.REPORT.ACTIONS.TYPE.REPORTPREVIEW && props.iouReport; + const displayAllActors = useMemo(() => props.action.actionName === CONST.REPORT.ACTIONS.TYPE.REPORTPREVIEW && props.iouReport, [props.action.actionName, props.iouReport]); const primaryDisplayName = displayName; if (displayAllActors) { const secondaryUserDetails = props.personalDetailsList[props.iouReport.ownerAccountID] || {}; From b84c560ff90c9854da2620cc43fd4534e6702e70 Mon Sep 17 00:00:00 2001 From: SP Singh <19812199+spcheema@users.noreply.github.com> Date: Fri, 18 Aug 2023 07:36:56 +1000 Subject: [PATCH 3/8] Buld participants list --- src/pages/ReportParticipantsPage.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/pages/ReportParticipantsPage.js b/src/pages/ReportParticipantsPage.js index 7920bb33ffa6..0a8b8843f0d6 100755 --- a/src/pages/ReportParticipantsPage.js +++ b/src/pages/ReportParticipantsPage.js @@ -57,9 +57,11 @@ const defaultProps = { const getAllParticipants = (report, personalDetails, translate) => { let participantAccountIDs = report.participantAccountIDs; - // Append report owner when the given report is IOU + // Build participants list for IOU report - there is a possibility that participantAccountIDs may be empty if (ReportUtils.isIOUReport(report)) { - participantAccountIDs = [...participantAccountIDs, report.ownerAccountID]; + const managerID = report.managerID || ''; + const ownerAccountID = report.ownerAccountID || ''; + participantAccountIDs = [managerID, ownerAccountID]; } return _.chain(participantAccountIDs) From 085f9726699615136921f30f8d00c6cafdebbbbd Mon Sep 17 00:00:00 2001 From: SP Singh <19812199+spcheema@users.noreply.github.com> Date: Fri, 18 Aug 2023 07:49:20 +1000 Subject: [PATCH 4/8] Update comment --- src/pages/ReportParticipantsPage.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/ReportParticipantsPage.js b/src/pages/ReportParticipantsPage.js index 0a8b8843f0d6..6ccb7a0c2e87 100755 --- a/src/pages/ReportParticipantsPage.js +++ b/src/pages/ReportParticipantsPage.js @@ -57,7 +57,7 @@ const defaultProps = { const getAllParticipants = (report, personalDetails, translate) => { let participantAccountIDs = report.participantAccountIDs; - // Build participants list for IOU report - there is a possibility that participantAccountIDs may be empty + // Build participants list for IOU report - there is a possibility that participantAccountIDs may be undefined/empty if (ReportUtils.isIOUReport(report)) { const managerID = report.managerID || ''; const ownerAccountID = report.ownerAccountID || ''; From 85ad12e8f9e82df4b9c4d05724447c8dd353af0f Mon Sep 17 00:00:00 2001 From: SP Singh <19812199+spcheema@users.noreply.github.com> Date: Sat, 19 Aug 2023 03:54:01 +1000 Subject: [PATCH 5/8] Display participants list on clicking avatars on IOU report header --- src/components/AvatarWithDisplayName.js | 33 +++++++++++++++++++++---- src/libs/ReportUtils.js | 3 ++- 2 files changed, 30 insertions(+), 6 deletions(-) diff --git a/src/components/AvatarWithDisplayName.js b/src/components/AvatarWithDisplayName.js index 0f1300ebf03d..b548ffa6c47a 100644 --- a/src/components/AvatarWithDisplayName.js +++ b/src/components/AvatarWithDisplayName.js @@ -18,6 +18,7 @@ import * as OptionsListUtils from '../libs/OptionsListUtils'; import Text from './Text'; import * as StyleUtils from '../styles/StyleUtils'; import ParentNavigationSubtitle from './ParentNavigationSubtitle'; +import PressableWithoutFeedback from './Pressable/PressableWithoutFeedback'; const propTypes = { /** The report currently being looked at */ @@ -61,6 +62,32 @@ function AvatarWithDisplayName(props) { const shouldShowSubscriptAvatar = ReportUtils.shouldReportShowSubscript(props.report); const isExpenseRequest = ReportUtils.isExpenseRequest(props.report); const defaultSubscriptSize = isExpenseRequest ? CONST.AVATAR_SIZE.SMALL_NORMAL : props.size; + const isExpenseReport = ReportUtils.isExpenseReport(props.report); + const getAvatars = () => { + if (isExpenseReport) { + return ( + + ); + } + return ( + ReportUtils.navigateToDetailsPage(props.report)} + accessibilityLabel={title} + accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON} + > + + + ); + }; + return ( {Boolean(props.report && title) && ( @@ -73,11 +100,7 @@ function AvatarWithDisplayName(props) { size={defaultSubscriptSize} /> ) : ( - + getAvatars() )} Date: Sun, 20 Aug 2023 00:18:11 +1000 Subject: [PATCH 6/8] Remove report util changes --- src/components/AvatarWithDisplayName.js | 4 +++- src/libs/ReportUtils.js | 3 +-- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/src/components/AvatarWithDisplayName.js b/src/components/AvatarWithDisplayName.js index b548ffa6c47a..f53328f4b762 100644 --- a/src/components/AvatarWithDisplayName.js +++ b/src/components/AvatarWithDisplayName.js @@ -19,6 +19,8 @@ import Text from './Text'; import * as StyleUtils from '../styles/StyleUtils'; import ParentNavigationSubtitle from './ParentNavigationSubtitle'; import PressableWithoutFeedback from './Pressable/PressableWithoutFeedback'; +import Navigation from "../libs/Navigation/Navigation"; +import ROUTES from "../ROUTES"; const propTypes = { /** The report currently being looked at */ @@ -75,7 +77,7 @@ function AvatarWithDisplayName(props) { } return ( ReportUtils.navigateToDetailsPage(props.report)} + onPress={() => Navigation.navigate(ROUTES.getReportParticipantsRoute(props.report.reportID))} accessibilityLabel={title} accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON} > diff --git a/src/libs/ReportUtils.js b/src/libs/ReportUtils.js index 31e68e24a8b1..452913795161 100644 --- a/src/libs/ReportUtils.js +++ b/src/libs/ReportUtils.js @@ -1525,8 +1525,7 @@ function navigateToDetailsPage(report) { Navigation.navigate(ROUTES.getReportDetailsRoute(report.reportID)); return; } - - if (!isIOUReport(report) && participantAccountIDs.length === 1) { + if (participantAccountIDs.length === 1) { Navigation.navigate(ROUTES.getProfileRoute(participantAccountIDs[0])); return; } From 001b04a759a4c72d376f72e963920f03164ad43b Mon Sep 17 00:00:00 2001 From: SP Singh <19812199+spcheema@users.noreply.github.com> Date: Sun, 20 Aug 2023 00:23:54 +1000 Subject: [PATCH 7/8] Code lint --- src/components/AvatarWithDisplayName.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/AvatarWithDisplayName.js b/src/components/AvatarWithDisplayName.js index f53328f4b762..eafb2148a2f0 100644 --- a/src/components/AvatarWithDisplayName.js +++ b/src/components/AvatarWithDisplayName.js @@ -19,8 +19,8 @@ import Text from './Text'; import * as StyleUtils from '../styles/StyleUtils'; import ParentNavigationSubtitle from './ParentNavigationSubtitle'; import PressableWithoutFeedback from './Pressable/PressableWithoutFeedback'; -import Navigation from "../libs/Navigation/Navigation"; -import ROUTES from "../ROUTES"; +import Navigation from '../libs/Navigation/Navigation'; +import ROUTES from '../ROUTES'; const propTypes = { /** The report currently being looked at */ From 9c476bbbe815190a80c9b24e6c399f05ee4246d5 Mon Sep 17 00:00:00 2001 From: SP Singh <19812199+spcheema@users.noreply.github.com> Date: Tue, 22 Aug 2023 12:00:57 +1000 Subject: [PATCH 8/8] Show details/profile on clicking request money header avatars --- src/components/AvatarWithDisplayName.js | 69 ++++++++++++------------- 1 file changed, 34 insertions(+), 35 deletions(-) diff --git a/src/components/AvatarWithDisplayName.js b/src/components/AvatarWithDisplayName.js index eafb2148a2f0..2fe1b3b7c57f 100644 --- a/src/components/AvatarWithDisplayName.js +++ b/src/components/AvatarWithDisplayName.js @@ -53,6 +53,20 @@ const defaultProps = { size: CONST.AVATAR_SIZE.DEFAULT, }; +const showActorDetails = (report) => { + if (ReportUtils.isExpenseReport(report)) { + Navigation.navigate(ROUTES.getProfileRoute(report.ownerAccountID)); + return; + } + + if (!ReportUtils.isIOUReport(report) && report.participantAccountIDs.length === 1) { + Navigation.navigate(ROUTES.getProfileRoute(report.participantAccountIDs[0])); + return; + } + + Navigation.navigate(ROUTES.getReportParticipantsRoute(report.reportID)); +}; + function AvatarWithDisplayName(props) { const title = ReportUtils.getReportName(props.report); const subtitle = ReportUtils.getChatRoomSubtitle(props.report); @@ -64,46 +78,31 @@ function AvatarWithDisplayName(props) { const shouldShowSubscriptAvatar = ReportUtils.shouldReportShowSubscript(props.report); const isExpenseRequest = ReportUtils.isExpenseRequest(props.report); const defaultSubscriptSize = isExpenseRequest ? CONST.AVATAR_SIZE.SMALL_NORMAL : props.size; - const isExpenseReport = ReportUtils.isExpenseReport(props.report); - const getAvatars = () => { - if (isExpenseReport) { - return ( - - ); - } - return ( - Navigation.navigate(ROUTES.getReportParticipantsRoute(props.report.reportID))} - accessibilityLabel={title} - accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON} - > - - - ); - }; return ( {Boolean(props.report && title) && ( - {shouldShowSubscriptAvatar ? ( - - ) : ( - getAvatars() - )} + showActorDetails(props.report)} + accessibilityLabel={title} + accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON} + > + {shouldShowSubscriptAvatar ? ( + + ) : ( + + )} +