From 29af1cd59a4de40f179ad053cad38ec5141a90eb Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 26 Feb 2024 09:25:13 +0700 Subject: [PATCH 1/3] fix private note option does not appear --- src/libs/ReportUtils.ts | 4 ++-- src/pages/ProfilePage.js | 27 ++++++++++++++++++++++++--- 2 files changed, 26 insertions(+), 5 deletions(-) diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts index 2daf337ddb80..a57f061d2794 100644 --- a/src/libs/ReportUtils.ts +++ b/src/libs/ReportUtils.ts @@ -4005,10 +4005,10 @@ function shouldReportBeInOptionList({ /** * Attempts to find a report in onyx with the provided list of participants. Does not include threads, task, money request, room, and policy expense chat. */ -function getChatByParticipants(newParticipantList: number[]): OnyxEntry { +function getChatByParticipants(newParticipantList: number[], reports = allReports): OnyxEntry { const sortedNewParticipantList = newParticipantList.sort(); return ( - Object.values(allReports ?? {}).find((report) => { + Object.values(reports ?? {}).find((report) => { // If the report has been deleted, or there are no participants (like an empty #admins room) then skip it if ( !report || diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js index 68bd3d76888d..5248194d7d94 100755 --- a/src/pages/ProfilePage.js +++ b/src/pages/ProfilePage.js @@ -135,7 +135,7 @@ function ProfilePage(props) { const shouldShowNotificationPreference = !_.isEmpty(props.report) && props.report.notificationPreference !== CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN; const notificationPreference = shouldShowNotificationPreference ? props.translate(`notificationPreferencesPage.notificationPreferences.${props.report.notificationPreference}`) : ''; - + // eslint-disable-next-line rulesdir/prefer-early-return useEffect(() => { if (ValidationUtils.isValidAccountRoute(accountID) && !hasMinimumDetails) { @@ -271,9 +271,30 @@ ProfilePage.propTypes = propTypes; ProfilePage.defaultProps = defaultProps; ProfilePage.displayName = 'ProfilePage'; +/** + * This function narrow down the data from Onyx to just the properties that we want to trigger a re-render of the component. This helps minimize re-rendering + * and makes the entire component more performant because it's not re-rendering when a bunch of properties change which aren't ever used in the UI. + * @param {Object} [report] + * @returns {Object|undefined} + */ +const chatReportSelector = (report) => + report && { + reportID: report.reportID, + participantAccountIDs: report.participantAccountIDs, + parentReportID: report.parentReportID, + parentReportActionID: report.parentReportActionID, + type: report.type, + chatType: report.chatType, + isPolicyExpenseChat: report.isPolicyExpenseChat, + }; + export default compose( withLocalize, withOnyx({ + reports: { + key: ONYXKEYS.COLLECTION.REPORT, + selector: chatReportSelector, + }, personalDetails: { key: ONYXKEYS.PERSONAL_DETAILS_LIST, }, @@ -281,9 +302,9 @@ export default compose( key: ONYXKEYS.SESSION, }, report: { - key: ({route, session}) => { + key: ({route, session, reports}) => { const accountID = Number(lodashGet(route.params, 'accountID', 0)); - const reportID = lodashGet(ReportUtils.getChatByParticipants([accountID]), 'reportID', ''); + const reportID = lodashGet(ReportUtils.getChatByParticipants([accountID], reports), 'reportID', ''); if ((session && Number(session.accountID) === accountID) || Session.isAnonymousUser() || !reportID) { return null; } From c01e5a764c486c3ba1ba5b52bd080b46e2e93960 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 26 Feb 2024 09:57:20 +0700 Subject: [PATCH 2/3] fix lint --- src/libs/ReportUtils.ts | 2 +- src/pages/ProfilePage.js | 1 - 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts index a57f061d2794..725d085f96e8 100644 --- a/src/libs/ReportUtils.ts +++ b/src/libs/ReportUtils.ts @@ -4005,7 +4005,7 @@ function shouldReportBeInOptionList({ /** * Attempts to find a report in onyx with the provided list of participants. Does not include threads, task, money request, room, and policy expense chat. */ -function getChatByParticipants(newParticipantList: number[], reports = allReports): OnyxEntry { +function getChatByParticipants(newParticipantList: number[], reports: OnyxCollection = allReports): OnyxEntry { const sortedNewParticipantList = newParticipantList.sort(); return ( Object.values(reports ?? {}).find((report) => { diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js index 5248194d7d94..899edf7e52cf 100755 --- a/src/pages/ProfilePage.js +++ b/src/pages/ProfilePage.js @@ -135,7 +135,6 @@ function ProfilePage(props) { const shouldShowNotificationPreference = !_.isEmpty(props.report) && props.report.notificationPreference !== CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN; const notificationPreference = shouldShowNotificationPreference ? props.translate(`notificationPreferencesPage.notificationPreferences.${props.report.notificationPreference}`) : ''; - // eslint-disable-next-line rulesdir/prefer-early-return useEffect(() => { if (ValidationUtils.isValidAccountRoute(accountID) && !hasMinimumDetails) { From b62c3e17503e1f48195272684d50e7366f0b8ea8 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 26 Feb 2024 10:04:40 +0700 Subject: [PATCH 3/3] fix remove redundant change --- src/pages/ProfilePage.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js index 899edf7e52cf..c505758e80f8 100755 --- a/src/pages/ProfilePage.js +++ b/src/pages/ProfilePage.js @@ -135,6 +135,7 @@ function ProfilePage(props) { const shouldShowNotificationPreference = !_.isEmpty(props.report) && props.report.notificationPreference !== CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN; const notificationPreference = shouldShowNotificationPreference ? props.translate(`notificationPreferencesPage.notificationPreferences.${props.report.notificationPreference}`) : ''; + // eslint-disable-next-line rulesdir/prefer-early-return useEffect(() => { if (ValidationUtils.isValidAccountRoute(accountID) && !hasMinimumDetails) {