From c5cfe64787dd66131cac177ae073f45876717538 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Fri, 28 Jul 2023 21:50:04 +0700 Subject: [PATCH 1/5] disable go to profile page for optimistic user --- src/components/MoneyRequestConfirmationList.js | 7 ++++++- src/components/OptionsList/BaseOptionsList.js | 2 +- src/components/ReportWelcomeText.js | 16 ++++++++++------ src/libs/OptionsListUtils.js | 1 + src/libs/ReportUtils.js | 10 ++++++++++ src/libs/actions/Report.js | 1 + src/pages/ReportParticipantsPage.js | 5 ++++- src/pages/home/HeaderView.js | 3 ++- 8 files changed, 35 insertions(+), 10 deletions(-) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index b376e02b1095..02f8d3871ac4 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -3,6 +3,7 @@ import PropTypes from 'prop-types'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import styles from '../styles/styles'; +import * as ReportUtils from '../libs/ReportUtils'; import * as OptionsListUtils from '../libs/OptionsListUtils'; import OptionsSelector from './OptionsSelector'; import ONYXKEYS from '../ONYXKEYS'; @@ -164,9 +165,13 @@ function MoneyRequestConfirmationList(props) { }, ); } else { + const formattedSelectedParticipants = _.map(props.selectedParticipants, (participant) => ({ + ...participant, + isDisabled: ReportUtils.isOptimisticPersonalDetail(participant.accountID), + })); sections.push({ title: translate('common.to'), - data: props.selectedParticipants, + data: formattedSelectedParticipants, shouldShow: true, indexOffset: 0, }); diff --git a/src/components/OptionsList/BaseOptionsList.js b/src/components/OptionsList/BaseOptionsList.js index 9c5777e222c9..28c9b1e70940 100644 --- a/src/components/OptionsList/BaseOptionsList.js +++ b/src/components/OptionsList/BaseOptionsList.js @@ -160,7 +160,7 @@ class BaseOptionsList extends Component { * @return {Component} */ renderItem({item, index, section}) { - const isDisabled = this.props.isDisabled || section.isDisabled; + const isDisabled = this.props.isDisabled || section.isDisabled || !!item.isDisabled; return ( ( - Navigation.navigate(ROUTES.getProfileRoute(accountID))} - > - {displayName} - + {ReportUtils.isOptimisticPersonalDetail(accountID) ? ( + {displayName} + ) : ( + Navigation.navigate(ROUTES.getProfileRoute(accountID))} + > + {displayName} + + )} {!_.isEmpty(pronouns) && {` (${pronouns})`}} {index === displayNamesWithTooltips.length - 1 && .} diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index 31ebab0ea0d2..55d0e07e16a3 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -920,6 +920,7 @@ function getIOUConfirmationOptionsFromParticipants(participants, amountText) { return _.map(participants, (participant) => ({ ...participant, descriptiveText: amountText, + isDisabled: ReportUtils.isOptimisticPersonalDetail(participant.accountID), })); } diff --git a/src/libs/ReportUtils.js b/src/libs/ReportUtils.js index a96de9cc02c6..0dff0407031c 100644 --- a/src/libs/ReportUtils.js +++ b/src/libs/ReportUtils.js @@ -403,6 +403,15 @@ function getBankAccountRoute(report) { return isPolicyExpenseChat(report) ? ROUTES.getBankAccountRoute('', report.policyID) : ROUTES.SETTINGS_ADD_BANK_ACCOUNT; } +/** + * Check if personal detail of accountID is empty or optimistic data + * @param {String} accountID user accountID + * @returns {Boolean} + */ +function isOptimisticPersonalDetail(accountID) { + return _.isEmpty(allPersonalDetails[accountID]) || !!allPersonalDetails[accountID].isOptimisticPersonalDetail; +} + /** * Checks if a report is a task report from a policy expense chat. * @@ -2841,6 +2850,7 @@ export { getAllPolicyReports, getIOUReportActionMessage, getDisplayNameForParticipant, + isOptimisticPersonalDetail, isChatReport, isCurrentUserSubmitter, isExpenseReport, diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index c42abfe2d067..ebd5e32d1ad2 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -475,6 +475,7 @@ function openReport(reportID, participantLoginList = [], newReportObject = {}, p accountID, avatar: UserUtils.getDefaultAvatarURL(accountID), displayName: login, + isOptimisticPersonalDetail: true, }; failurePersonalDetails[accountID] = allPersonalDetails[accountID] || null; diff --git a/src/pages/ReportParticipantsPage.js b/src/pages/ReportParticipantsPage.js index 86a841c2cd27..aa7f5f840086 100755 --- a/src/pages/ReportParticipantsPage.js +++ b/src/pages/ReportParticipantsPage.js @@ -86,7 +86,10 @@ const getAllParticipants = (report, personalDetails, translate) => { }; function ReportParticipantsPage(props) { - const participants = getAllParticipants(props.report, props.personalDetails, props.translate); + const participants = _.map(getAllParticipants(props.report, props.personalDetails, props.translate), (participant) => ({ + ...participant, + isDisabled: ReportUtils.isOptimisticPersonalDetail(participant.accountID), + })); return ( diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.js index 7622a0e73f18..9925153293df 100644 --- a/src/pages/home/HeaderView.js +++ b/src/pages/home/HeaderView.js @@ -134,6 +134,7 @@ function HeaderView(props) { const icons = ReportUtils.getIcons(reportHeaderData, props.personalDetails); const brickRoadIndicator = ReportUtils.hasReportNameError(props.report) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : ''; const shouldShowBorderBottom = !isTaskReport || !props.isSmallScreenWidth; + const isOptimisticDetail = !isMultipleParticipant && ReportUtils.isOptimisticPersonalDetail(participants[0]) && !props.report.parentReportID; return ( ReportUtils.navigateToDetailsPage(props.report)} style={[styles.flexRow, styles.alignItemsCenter, styles.flex1]} - disabled={isTaskReport && !ReportUtils.isOpenTaskReport(props.report)} + disabled={(isTaskReport && !ReportUtils.isOpenTaskReport(props.report)) || isOptimisticDetail} accessibilityLabel={title} accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON} > From 9241de7022870ba7f95676b34bbb6b7a8c8b637c Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Fri, 28 Jul 2023 22:16:27 +0700 Subject: [PATCH 2/5] fix lint --- src/components/MoneyRequestConfirmationList.js | 6 +++--- src/pages/ReportParticipantsPage.js | 6 +++--- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index 02f8d3871ac4..7a296376cc04 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -166,9 +166,9 @@ function MoneyRequestConfirmationList(props) { ); } else { const formattedSelectedParticipants = _.map(props.selectedParticipants, (participant) => ({ - ...participant, - isDisabled: ReportUtils.isOptimisticPersonalDetail(participant.accountID), - })); + ...participant, + isDisabled: ReportUtils.isOptimisticPersonalDetail(participant.accountID), + })); sections.push({ title: translate('common.to'), data: formattedSelectedParticipants, diff --git a/src/pages/ReportParticipantsPage.js b/src/pages/ReportParticipantsPage.js index aa7f5f840086..c1008c9cd46d 100755 --- a/src/pages/ReportParticipantsPage.js +++ b/src/pages/ReportParticipantsPage.js @@ -87,9 +87,9 @@ const getAllParticipants = (report, personalDetails, translate) => { function ReportParticipantsPage(props) { const participants = _.map(getAllParticipants(props.report, props.personalDetails, props.translate), (participant) => ({ - ...participant, - isDisabled: ReportUtils.isOptimisticPersonalDetail(participant.accountID), - })); + ...participant, + isDisabled: ReportUtils.isOptimisticPersonalDetail(participant.accountID), + })); return ( From d77ff1a3eed2c480fac84d8ab61a9a677cf209b2 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Mon, 31 Jul 2023 17:04:09 +0700 Subject: [PATCH 3/5] disable go to profile page for avatar of action item created --- src/libs/ReportUtils.js | 12 ++++++++++++ src/pages/home/HeaderView.js | 4 ++-- src/pages/home/report/ReportActionItemCreated.js | 2 ++ 3 files changed, 16 insertions(+), 2 deletions(-) diff --git a/src/libs/ReportUtils.js b/src/libs/ReportUtils.js index 341febe6a9f8..8d6a4462d7ad 100644 --- a/src/libs/ReportUtils.js +++ b/src/libs/ReportUtils.js @@ -412,6 +412,17 @@ function isOptimisticPersonalDetail(accountID) { return _.isEmpty(allPersonalDetails[accountID]) || !!allPersonalDetails[accountID].isOptimisticPersonalDetail; } +/** + * Check if report is a DM and personal detail of participant is optimistic data + * @param {String} report + * @returns {Boolean} + */ +function shouldDisableDetailPage(report) { + const participants = lodashGet(report, 'participantAccountIDs', []); + const isMultipleParticipant = participants.length > 1; + return !isMultipleParticipant && isOptimisticPersonalDetail(participants[0]) && !report.parentReportID; +} + /** * Checks if a report is a task report from a policy expense chat. * @@ -2849,6 +2860,7 @@ export { getIOUReportActionMessage, getDisplayNameForParticipant, isOptimisticPersonalDetail, + shouldDisableDetailPage, isChatReport, isCurrentUserSubmitter, isExpenseReport, diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.js index 9925153293df..1816e5a39caf 100644 --- a/src/pages/home/HeaderView.js +++ b/src/pages/home/HeaderView.js @@ -134,7 +134,7 @@ function HeaderView(props) { const icons = ReportUtils.getIcons(reportHeaderData, props.personalDetails); const brickRoadIndicator = ReportUtils.hasReportNameError(props.report) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : ''; const shouldShowBorderBottom = !isTaskReport || !props.isSmallScreenWidth; - const isOptimisticDetail = !isMultipleParticipant && ReportUtils.isOptimisticPersonalDetail(participants[0]) && !props.report.parentReportID; + const shouldDisableDetailPage = ReportUtils.shouldDisableDetailPage(props.report); return ( ReportUtils.navigateToDetailsPage(props.report)} style={[styles.flexRow, styles.alignItemsCenter, styles.flex1]} - disabled={(isTaskReport && !ReportUtils.isOpenTaskReport(props.report)) || isOptimisticDetail} + disabled={(isTaskReport && !ReportUtils.isOpenTaskReport(props.report)) || shouldDisableDetailPage} accessibilityLabel={title} accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON} > diff --git a/src/pages/home/report/ReportActionItemCreated.js b/src/pages/home/report/ReportActionItemCreated.js index c4dad05beb3b..b7716e22a851 100644 --- a/src/pages/home/report/ReportActionItemCreated.js +++ b/src/pages/home/report/ReportActionItemCreated.js @@ -53,6 +53,7 @@ function ReportActionItemCreated(props) { } const icons = ReportUtils.getIcons(props.report, props.personalDetails); + const shouldDisableDetailPage = ReportUtils.shouldDisableDetailPage(props.report); return ( Date: Mon, 31 Jul 2023 17:24:15 +0700 Subject: [PATCH 4/5] disable for actor's avatar of action --- src/pages/home/report/ReportActionItemSingle.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/pages/home/report/ReportActionItemSingle.js b/src/pages/home/report/ReportActionItemSingle.js index fe2b1406b148..8a6502c7a0a3 100644 --- a/src/pages/home/report/ReportActionItemSingle.js +++ b/src/pages/home/report/ReportActionItemSingle.js @@ -1,5 +1,5 @@ import lodashGet from 'lodash/get'; -import React, {useCallback} from 'react'; +import React, {useCallback, useMemo} from 'react'; import {View} from 'react-native'; import PropTypes from 'prop-types'; import _ from 'underscore'; @@ -113,6 +113,11 @@ function ReportActionItemSingle(props) { } }, [isWorkspaceActor, props.report.reportID, actorAccountID, props.action.delegateAccountID]); + const shouldDisableDetailPage = useMemo( + () => !isWorkspaceActor && ReportUtils.isOptimisticPersonalDetail(props.action.delegateAccountID ? props.action.delegateAccountID : actorAccountID), + [props.action, isWorkspaceActor, actorAccountID], + ); + return ( @@ -158,6 +164,7 @@ function ReportActionItemSingle(props) { onPressIn={ControlSelection.block} onPressOut={ControlSelection.unblock} onPress={showActorDetails} + disabled={shouldDisableDetailPage} accessibilityLabel={actorHint} accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON} > From 7d25e64540588c9cb9f528c04d9692dcdd082d16 Mon Sep 17 00:00:00 2001 From: dukenv0307 Date: Tue, 1 Aug 2023 15:40:06 +0700 Subject: [PATCH 5/5] fix split bill option --- src/components/MoneyRequestConfirmationList.js | 10 +++++++++- src/libs/OptionsListUtils.js | 1 - 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index 7a296376cc04..4beffba09436 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -141,7 +141,14 @@ function MoneyRequestConfirmationList(props) { const unselectedParticipants = _.filter(props.selectedParticipants, (participant) => !participant.selected); if (props.hasMultipleParticipants) { const formattedSelectedParticipants = getParticipantsWithAmount(selectedParticipants); - const formattedParticipantsList = _.union(formattedSelectedParticipants, unselectedParticipants); + let formattedParticipantsList = _.union(formattedSelectedParticipants, unselectedParticipants); + + if (!canModifyParticipants) { + formattedParticipantsList = _.map(formattedParticipantsList, (participant) => ({ + ...participant, + isDisabled: ReportUtils.isOptimisticPersonalDetail(participant.accountID), + })); + } const myIOUAmount = IOUUtils.calculateAmount(selectedParticipants.length, props.iouAmount, true); const formattedPayeeOption = OptionsListUtils.getIOUConfirmationOptionsFromPayeePersonalDetail( @@ -187,6 +194,7 @@ function MoneyRequestConfirmationList(props) { payeePersonalDetails, translate, shouldDisablePaidBySection, + canModifyParticipants, ]); const selectedOptions = useMemo(() => { diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index 640d31be4610..7eff3904ea16 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -923,7 +923,6 @@ function getIOUConfirmationOptionsFromParticipants(participants, amountText) { return _.map(participants, (participant) => ({ ...participant, descriptiveText: amountText, - isDisabled: ReportUtils.isOptimisticPersonalDetail(participant.accountID), })); }