From 1d602e45c2ff6a97290edf08d33f3b9da2fd372f Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Thu, 6 Apr 2023 16:59:35 +0300 Subject: [PATCH 01/27] Rename participants to selectedOptions in MoneyRequestModal.js --- src/pages/iou/MoneyRequestModal.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index 00e92b26cecc..edea5a945d27 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -130,7 +130,7 @@ const MoneyRequestModal = (props) => { const [previousStepIndex, setPreviousStepIndex] = useState(0); const [currentStepIndex, setCurrentStepIndex] = useState(0); - const [participants, setParticipants] = useState(participantsWithDetails); + const [selectedOptions, setSelectedOptions] = useState(participantsWithDetails); const [amount, setAmount] = useState(''); const [comment, setComment] = useState(''); @@ -257,7 +257,7 @@ const MoneyRequestModal = (props) => { const amountInDollars = Math.round(amount * 100); const currency = props.iou.selectedCurrencyCode; const trimmedComment = comment.trim(); - const participant = participants[0]; + const participant = selectedOptions[0]; if (paymentMethodType === CONST.IOU.PAYMENT_TYPE.ELSEWHERE) { IOU.sendMoneyElsewhere( @@ -293,7 +293,7 @@ const MoneyRequestModal = (props) => { participant, ); } - }, [amount, comment, participants, props.currentUserPersonalDetails.login, props.iou.selectedCurrencyCode, props.report]); + }, [amount, comment, selectedOptions, props.currentUserPersonalDetails.login, props.iou.selectedCurrencyCode, props.report]); /** * @param {Array} selectedParticipants @@ -377,9 +377,9 @@ const MoneyRequestModal = (props) => { > {modalHeader} setParticipants(selectedParticipants)} + onAddParticipants={selectedParticipants => setSelectedOptions(selectedParticipants)} onStepComplete={navigateToNextStep} safeAreaPaddingBottomStyle={safeAreaPaddingBottomStyle} /> @@ -403,7 +403,7 @@ const MoneyRequestModal = (props) => { ReportScrollManager.scrollToBottom(); }} hasMultipleParticipants={props.hasMultipleParticipants} - participants={_.filter(participants, email => props.currentUserPersonalDetails.login !== email.login)} + participants={_.filter(selectedOptions, email => props.currentUserPersonalDetails.login !== email.login)} iouAmount={amount} comment={comment} onUpdateComment={value => setComment(value)} From bddf4b0592a154b7986aa05396c48be3c01bf4ea Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Thu, 6 Apr 2023 17:29:44 +0300 Subject: [PATCH 02/27] set optiotPropTypes as the prop type for participants --- src/components/IOUConfirmationList.js | 17 ++--------------- src/pages/iou/steps/IOUConfirmPage.js | 18 ++---------------- .../IOUParticipantsPage/IOUParticipantsPage.js | 16 ++-------------- 3 files changed, 6 insertions(+), 45 deletions(-) diff --git a/src/components/IOUConfirmationList.js b/src/components/IOUConfirmationList.js index 40439bfd39f6..5d1078b92e67 100755 --- a/src/components/IOUConfirmationList.js +++ b/src/components/IOUConfirmationList.js @@ -16,7 +16,7 @@ import SettlementButton from './SettlementButton'; import ROUTES from '../ROUTES'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsPropTypes, withCurrentUserPersonalDetailsDefaultProps} from './withCurrentUserPersonalDetails'; import * as IOUUtils from '../libs/IOUUtils'; -import avatarPropTypes from './avatarPropTypes'; +import optionPropTypes from './optionPropTypes'; const propTypes = { /** Callback to inform parent modal of success */ @@ -41,20 +41,7 @@ const propTypes = { iouType: PropTypes.string, /** Selected participants from MoneyRequestModal with login */ - participants: PropTypes.arrayOf(PropTypes.shape({ - login: PropTypes.string.isRequired, - alternateText: PropTypes.string, - hasDraftComment: PropTypes.bool, - icons: PropTypes.arrayOf(avatarPropTypes), - searchText: PropTypes.string, - text: PropTypes.string, - keyForList: PropTypes.string, - reportID: PropTypes.string, - // eslint-disable-next-line react/forbid-prop-types - participantsList: PropTypes.arrayOf(PropTypes.object), - payPalMeAddress: PropTypes.string, - phoneNumber: PropTypes.string, - })).isRequired, + participants: PropTypes.arrayOf(optionPropTypes).isRequired, /** Can the participants be modified or not */ canModifyParticipants: PropTypes.bool, diff --git a/src/pages/iou/steps/IOUConfirmPage.js b/src/pages/iou/steps/IOUConfirmPage.js index f176f73f93fb..d3bc4f0570d1 100644 --- a/src/pages/iou/steps/IOUConfirmPage.js +++ b/src/pages/iou/steps/IOUConfirmPage.js @@ -2,7 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import IOUConfirmationList from '../../../components/IOUConfirmationList'; import CONST from '../../../CONST'; -import avatarPropTypes from '../../../components/avatarPropTypes'; +import optionPropTypes from '../../../components/optionPropTypes'; const propTypes = { /** Callback to inform parent modal of success */ @@ -24,21 +24,7 @@ const propTypes = { iouAmount: PropTypes.string.isRequired, /** Selected participants from MoneyRequestModal with login */ - participants: PropTypes.arrayOf(PropTypes.shape({ - login: PropTypes.string.isRequired, - alternateText: PropTypes.string, - hasDraftComment: PropTypes.bool, - icons: PropTypes.arrayOf(avatarPropTypes), - searchText: PropTypes.string, - text: PropTypes.string, - keyForList: PropTypes.string, - isPinned: PropTypes.bool, - reportID: PropTypes.string, - // eslint-disable-next-line react/forbid-prop-types - participantsList: PropTypes.arrayOf(PropTypes.object), - payPalMeAddress: PropTypes.string, - phoneNumber: PropTypes.string, - })).isRequired, + participants: PropTypes.arrayOf(optionPropTypes).isRequired, /** IOU type */ iouType: PropTypes.string, diff --git a/src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsPage.js b/src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsPage.js index 93a27f88946f..65b04394ee1a 100644 --- a/src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsPage.js +++ b/src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsPage.js @@ -7,7 +7,7 @@ import IOUParticipantsSplit from './IOUParticipantsSplit'; import IOUParticipantsRequest from './IOUParticipantsRequest'; import styles from '../../../../styles/styles'; import FullScreenLoadingIndicator from '../../../../components/FullscreenLoadingIndicator'; -import avatarPropTypes from '../../../../components/avatarPropTypes'; +import optionPropTypes from '../../../../components/optionPropTypes'; const propTypes = { /** Callback to inform parent modal of success */ @@ -20,19 +20,7 @@ const propTypes = { onAddParticipants: PropTypes.func.isRequired, /** Selected participants from MoneyRequestModal with login */ - participants: PropTypes.arrayOf(PropTypes.shape({ - login: PropTypes.string.isRequired, - alternateText: PropTypes.string, - hasDraftComment: PropTypes.bool, - icons: PropTypes.arrayOf(avatarPropTypes), - searchText: PropTypes.string, - text: PropTypes.string, - keyForList: PropTypes.string, - isPinned: PropTypes.bool, - reportID: PropTypes.string, - phoneNumber: PropTypes.string, - payPalMeAddress: PropTypes.string, - })), + participants: PropTypes.arrayOf(optionPropTypes), /* Onyx Props */ From 80efa65ebe12070150d117f7f0b6466dca943f8a Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Thu, 6 Apr 2023 22:12:59 +0300 Subject: [PATCH 03/27] Rename steps in MoneyRequestModal --- src/pages/iou/MoneyRequestModal.js | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index edea5a945d27..1f6c9cc4b181 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -99,9 +99,9 @@ const defaultProps = { // Determines type of step to display within Modal, value provides the title for that page. const Steps = { - IOUAmount: 'iou.amount', - IOUParticipants: 'iou.participants', - IOUConfirm: 'iou.confirm', + MoneyRequestAmount: 'moneyRequest.amount', + MoneyRequestParticipants: 'moneyRequest.participants', + MoneyRequestConfirm: 'moneyRequest.confirm', }; const MoneyRequestModal = (props) => { @@ -123,7 +123,7 @@ const MoneyRequestModal = (props) => { })); // Skip IOUParticipants step if participants are passed in - const steps = reportParticipants.length ? [Steps.IOUAmount, Steps.IOUConfirm] : [Steps.IOUAmount, Steps.IOUParticipants, Steps.IOUConfirm]; + const steps = reportParticipants.length ? [Steps.MoneyRequestAmount, Steps.MoneyRequestConfirm] : [Steps.MoneyRequestAmount, Steps.MoneyRequestParticipants, Steps.MoneyRequestConfirm]; const prevCreatingIOUTransactionStatusRef = useRef(lodashGet(props.iou, 'creatingIOUTransaction')); const prevNetworkStatusRef = useRef(props.network.isOffline); @@ -351,7 +351,7 @@ const MoneyRequestModal = (props) => { {!didScreenTransitionEnd && } {didScreenTransitionEnd && ( <> - {currentStep === Steps.IOUAmount && ( + {currentStep === Steps.MoneyRequestAmount && ( { /> )} - {currentStep === Steps.IOUParticipants && ( + {currentStep === Steps.MoneyRequestParticipants && ( { /> )} - {currentStep === Steps.IOUConfirm && ( + {currentStep === Steps.MoneyRequestConfirm && ( Date: Thu, 6 Apr 2023 22:50:01 +0300 Subject: [PATCH 04/27] Rename IOUAmountPage to MoneyRequestAmountPage --- src/pages/iou/MoneyRequestModal.js | 4 ++-- .../steps/{IOUAmountPage.js => MoneyRequestAmountPage.js} | 8 ++++---- 2 files changed, 6 insertions(+), 6 deletions(-) rename src/pages/iou/steps/{IOUAmountPage.js => MoneyRequestAmountPage.js} (98%) diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index 1f6c9cc4b181..b1ee87a748ff 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -7,7 +7,7 @@ import PropTypes from 'prop-types'; import lodashGet from 'lodash/get'; import {withOnyx} from 'react-native-onyx'; import Str from 'expensify-common/lib/str'; -import IOUAmountPage from './steps/IOUAmountPage'; +import MoneyRequestAmountPage from './steps/MoneyRequestAmountPage'; import IOUParticipantsPage from './steps/IOUParticipantsPage/IOUParticipantsPage'; import IOUConfirmPage from './steps/IOUConfirmPage'; import ModalHeader from './ModalHeader'; @@ -357,7 +357,7 @@ const MoneyRequestModal = (props) => { style={[styles.flex1, safeAreaPaddingBottomStyle]} > {modalHeader} - { setAmount(value); navigateToNextStep(); diff --git a/src/pages/iou/steps/IOUAmountPage.js b/src/pages/iou/steps/MoneyRequestAmountPage.js similarity index 98% rename from src/pages/iou/steps/IOUAmountPage.js rename to src/pages/iou/steps/MoneyRequestAmountPage.js index 98112ff9d33d..4a562f25fab2 100755 --- a/src/pages/iou/steps/IOUAmountPage.js +++ b/src/pages/iou/steps/MoneyRequestAmountPage.js @@ -48,7 +48,7 @@ const defaultProps = { selectedCurrencyCode: CONST.CURRENCY.USD, }, }; -class IOUAmountPage extends React.Component { +class MoneyRequestAmountPage extends React.Component { constructor(props) { super(props); @@ -336,12 +336,12 @@ class IOUAmountPage extends React.Component { } } -IOUAmountPage.propTypes = propTypes; -IOUAmountPage.defaultProps = defaultProps; +MoneyRequestAmountPage.propTypes = propTypes; +MoneyRequestAmountPage.defaultProps = defaultProps; export default compose( withLocalize, withOnyx({ iou: {key: ONYXKEYS.IOU}, }), -)(IOUAmountPage); +)(MoneyRequestAmountPage); From 964c5ce45cfb28faed3aee32b60ae5c8574417d0 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Thu, 6 Apr 2023 22:53:31 +0300 Subject: [PATCH 05/27] Rename IOUConfirmPage to MoneyRequestConfirmPage --- ...tionList.js => MoneyRequestConfirmationList.js} | 8 ++++---- src/pages/iou/MoneyRequestModal.js | 4 ++-- ...OUConfirmPage.js => MoneyRequestConfirmPage.js} | 14 +++++++------- 3 files changed, 13 insertions(+), 13 deletions(-) rename src/components/{IOUConfirmationList.js => MoneyRequestConfirmationList.js} (98%) rename src/pages/iou/steps/{IOUConfirmPage.js => MoneyRequestConfirmPage.js} (81%) diff --git a/src/components/IOUConfirmationList.js b/src/components/MoneyRequestConfirmationList.js similarity index 98% rename from src/components/IOUConfirmationList.js rename to src/components/MoneyRequestConfirmationList.js index 5d1078b92e67..761872570e46 100755 --- a/src/components/IOUConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -84,7 +84,7 @@ const defaultProps = { ...withCurrentUserPersonalDetailsDefaultProps, }; -class IOUConfirmationList extends Component { +class MoneyRequestConfirmationList extends Component { constructor(props) { super(props); @@ -314,8 +314,8 @@ class IOUConfirmationList extends Component { } } -IOUConfirmationList.propTypes = propTypes; -IOUConfirmationList.defaultProps = defaultProps; +MoneyRequestConfirmationList.propTypes = propTypes; +MoneyRequestConfirmationList.defaultProps = defaultProps; export default compose( withLocalize, @@ -327,4 +327,4 @@ export default compose( key: ONYXKEYS.SESSION, }, }), -)(IOUConfirmationList); +)(MoneyRequestConfirmationList); diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index b1ee87a748ff..04fb3020cbfc 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -9,7 +9,7 @@ import {withOnyx} from 'react-native-onyx'; import Str from 'expensify-common/lib/str'; import MoneyRequestAmountPage from './steps/MoneyRequestAmountPage'; import IOUParticipantsPage from './steps/IOUParticipantsPage/IOUParticipantsPage'; -import IOUConfirmPage from './steps/IOUConfirmPage'; +import MoneyRequestConfirmPage from './steps/MoneyRequestConfirmPage'; import ModalHeader from './ModalHeader'; import styles from '../../styles/styles'; import * as IOU from '../../libs/actions/IOU'; @@ -391,7 +391,7 @@ const MoneyRequestModal = (props) => { direction={direction} > {modalHeader} - { // TODO: ADD HANDLING TO DISABLE BUTTON FUNCTIONALITY WHILE REQUEST IS IN FLIGHT createTransaction(selectedParticipants); diff --git a/src/pages/iou/steps/IOUConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js similarity index 81% rename from src/pages/iou/steps/IOUConfirmPage.js rename to src/pages/iou/steps/MoneyRequestConfirmPage.js index d3bc4f0570d1..c8732c977d0e 100644 --- a/src/pages/iou/steps/IOUConfirmPage.js +++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js @@ -1,6 +1,6 @@ import React from 'react'; import PropTypes from 'prop-types'; -import IOUConfirmationList from '../../../components/IOUConfirmationList'; +import MoneyRequestConfirmationList from '../../../components/MoneyRequestConfirmationList'; import CONST from '../../../CONST'; import optionPropTypes from '../../../components/optionPropTypes'; @@ -40,8 +40,8 @@ const defaultProps = { canModifyParticipants: false, }; -const IOUConfirmPage = props => ( - ( + ( /> ); -IOUConfirmPage.displayName = 'IOUConfirmPage'; -IOUConfirmPage.propTypes = propTypes; -IOUConfirmPage.defaultProps = defaultProps; +MoneyRequestConfirmPage.displayName = 'IOUConfirmPage'; +MoneyRequestConfirmPage.propTypes = propTypes; +MoneyRequestConfirmPage.defaultProps = defaultProps; -export default IOUConfirmPage; +export default MoneyRequestConfirmPage; From b31fb44dacee91fd06cb90f7d01b59775dfa5fa7 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Thu, 6 Apr 2023 23:04:30 +0300 Subject: [PATCH 06/27] Rename IOUParticipantsPage to MoneyRequestParticipantsPage --- src/pages/iou/MoneyRequestModal.js | 4 ++-- .../MoneyRequestParticipantsPage.js} | 18 +++++++++--------- .../MoneyRequestParticipantsRequest.js} | 8 ++++---- .../MoneyRequestParticipantsSplit.js} | 8 ++++---- 4 files changed, 19 insertions(+), 19 deletions(-) rename src/pages/iou/steps/{IOUParticipantsPage/IOUParticipantsPage.js => MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js} (81%) rename src/pages/iou/steps/{IOUParticipantsPage/IOUParticipantsRequest.js => MoneyRequstParticipantsPage/MoneyRequestParticipantsRequest.js} (96%) rename src/pages/iou/steps/{IOUParticipantsPage/IOUParticipantsSplit.js => MoneyRequstParticipantsPage/MoneyRequestParticipantsSplit.js} (97%) diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index 04fb3020cbfc..24316e730064 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -8,7 +8,7 @@ import lodashGet from 'lodash/get'; import {withOnyx} from 'react-native-onyx'; import Str from 'expensify-common/lib/str'; import MoneyRequestAmountPage from './steps/MoneyRequestAmountPage'; -import IOUParticipantsPage from './steps/IOUParticipantsPage/IOUParticipantsPage'; +import MoneyRequestParticipantsPage from './steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage'; import MoneyRequestConfirmPage from './steps/MoneyRequestConfirmPage'; import ModalHeader from './ModalHeader'; import styles from '../../styles/styles'; @@ -376,7 +376,7 @@ const MoneyRequestModal = (props) => { direction={direction} > {modalHeader} - setSelectedOptions(selectedParticipants)} diff --git a/src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsPage.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js similarity index 81% rename from src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsPage.js rename to src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js index 65b04394ee1a..71d4cbf6a908 100644 --- a/src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsPage.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js @@ -3,8 +3,8 @@ import PropTypes from 'prop-types'; import {withOnyx} from 'react-native-onyx'; import {View} from 'react-native'; import ONYXKEYS from '../../../../ONYXKEYS'; -import IOUParticipantsSplit from './IOUParticipantsSplit'; -import IOUParticipantsRequest from './IOUParticipantsRequest'; +import MoneyRequestParticipantsSplit from './MoneyRequestParticipantsSplit'; +import MoneyRequestParticipantsRequest from './MoneyRequestParticipantsRequest'; import styles from '../../../../styles/styles'; import FullScreenLoadingIndicator from '../../../../components/FullscreenLoadingIndicator'; import optionPropTypes from '../../../../components/optionPropTypes'; @@ -44,7 +44,7 @@ const defaultProps = { safeAreaPaddingBottomStyle: {}, }; -const IOUParticipantsPage = (props) => { +const MoneyRequestParticipantsPage = (props) => { if (props.iou.loading) { return ( @@ -55,7 +55,7 @@ const IOUParticipantsPage = (props) => { return (props.hasMultipleParticipants ? ( - { /> ) : ( - { ); }; -IOUParticipantsPage.displayName = 'IOUParticipantsPage'; -IOUParticipantsPage.propTypes = propTypes; -IOUParticipantsPage.defaultProps = defaultProps; +MoneyRequestParticipantsPage.displayName = 'IOUParticipantsPage'; +MoneyRequestParticipantsPage.propTypes = propTypes; +MoneyRequestParticipantsPage.defaultProps = defaultProps; export default withOnyx({ iou: {key: ONYXKEYS.IOU}, -})(IOUParticipantsPage); +})(MoneyRequestParticipantsPage); diff --git a/src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsRequest.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsRequest.js similarity index 96% rename from src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsRequest.js rename to src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsRequest.js index 8929889884e7..0dd2efa5c82b 100755 --- a/src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsRequest.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsRequest.js @@ -43,7 +43,7 @@ const defaultProps = { betas: [], }; -class IOUParticipantsRequest extends Component { +class MoneyRequestParticipantsRequest extends Component { constructor(props) { super(props); @@ -160,8 +160,8 @@ class IOUParticipantsRequest extends Component { } } -IOUParticipantsRequest.propTypes = propTypes; -IOUParticipantsRequest.defaultProps = defaultProps; +MoneyRequestParticipantsRequest.propTypes = propTypes; +MoneyRequestParticipantsRequest.defaultProps = defaultProps; export default compose( withLocalize, @@ -176,4 +176,4 @@ export default compose( key: ONYXKEYS.BETAS, }, }), -)(IOUParticipantsRequest); +)(MoneyRequestParticipantsRequest); diff --git a/src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsSplit.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSplit.js similarity index 97% rename from src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsSplit.js rename to src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSplit.js index 4d7c05c461e1..57a819833866 100755 --- a/src/pages/iou/steps/IOUParticipantsPage/IOUParticipantsSplit.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSplit.js @@ -60,7 +60,7 @@ const defaultProps = { safeAreaPaddingBottomStyle: {}, }; -class IOUParticipantsSplit extends Component { +class MoneyRequestParticipantsSplit extends Component { constructor(props) { super(props); @@ -244,8 +244,8 @@ class IOUParticipantsSplit extends Component { } } -IOUParticipantsSplit.propTypes = propTypes; -IOUParticipantsSplit.defaultProps = defaultProps; +MoneyRequestParticipantsSplit.propTypes = propTypes; +MoneyRequestParticipantsSplit.defaultProps = defaultProps; export default compose( withLocalize, @@ -260,4 +260,4 @@ export default compose( key: ONYXKEYS.BETAS, }, }), -)(IOUParticipantsSplit); +)(MoneyRequestParticipantsSplit); From 1d9f7be7bd870e08898f834d4d689602eaafcaf5 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Fri, 7 Apr 2023 15:49:44 +0300 Subject: [PATCH 07/27] WIP. --- src/libs/OptionsListUtils.js | 29 +++++++++++++++++++++++++++++ src/pages/iou/MoneyRequestModal.js | 2 +- 2 files changed, 30 insertions(+), 1 deletion(-) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index f2fe2df57914..34595d9e4f64 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -2,6 +2,7 @@ import _ from 'underscore'; import Onyx from 'react-native-onyx'; import lodashOrderBy from 'lodash/orderBy'; +import lodashGet from 'lodash/get'; import Str from 'expensify-common/lib/str'; import ONYXKEYS from '../ONYXKEYS'; import CONST from '../CONST'; @@ -77,6 +78,32 @@ Onyx.connect({ }, }); +const reports = {}; +Onyx.connect({ + key: ONYXKEYS.COLLECTION.REPORT, + callback: (report, key) => { + reports[key] = report; + }, +}); + +function getPolicyExpenseReportOptions(report) { + if (!ReportUtils.isPolicyExpenseChat(report)) { + return []; + } + const policyID = report.policyID; + return _.filter(reports, (report) => { + if (report.policyID === policyID) { + return true; + } + return false; + }); +} + +function getParticipantsOptions(report, personalDetails) { + const participants = lodashGet(report, 'participants', []); + return getPersonalDetailsForLogins(participants, personalDetails); +} + /** * Adds expensify SMS domain (@expensify.sms) if login is a phone number and if it's not included yet * @@ -806,4 +833,6 @@ export { getIOUConfirmationOptionsFromParticipants, getSearchText, getAllReportErrors, + getPolicyExpenseReportOptions, + getParticipantsOptions, }; diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index 24316e730064..d37d6be1a24c 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -106,7 +106,7 @@ const Steps = { const MoneyRequestModal = (props) => { const reportParticipants = lodashGet(props, 'report.participants', []); - const participantsWithDetails = _.map(OptionsListUtils.getPersonalDetailsForLogins(reportParticipants, props.personalDetails), personalDetails => ({ + const participantsWithDetails = _.map(ReportUtils.isPolicyExpenseChat(props.report) ? OptionsListUtils.getPolicyExpenseReportOptions(props.report) : OptionsListUtils.getPersonalDetailsForLogins(reportParticipants, props.personalDetails), personalDetails => ({ login: personalDetails.login, text: personalDetails.displayName, firstName: lodashGet(personalDetails, 'firstName', ''), From dd7da6ade425ffae52c27570858eb74ae479d7cf Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Sat, 8 Apr 2023 01:25:15 +0300 Subject: [PATCH 08/27] MoneyRequestModal now supports workspaces. --- src/libs/OptionsListUtils.js | 21 ++++++++++++++++----- src/pages/iou/MoneyRequestModal.js | 9 ++++++--- 2 files changed, 22 insertions(+), 8 deletions(-) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index 33db581d945e..2dcb1040af35 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -78,11 +78,14 @@ Onyx.connect({ }, }); -const reports = {}; +const policyExpenseReports = {}; Onyx.connect({ key: ONYXKEYS.COLLECTION.REPORT, callback: (report, key) => { - reports[key] = report; + if (!ReportUtils.isPolicyExpenseChat(report)) { + return; + } + policyExpenseReports[key] = report; }, }); @@ -90,13 +93,21 @@ function getPolicyExpenseReportOptions(report) { if (!ReportUtils.isPolicyExpenseChat(report)) { return []; } - const policyID = report.policyID; - return _.filter(reports, (report) => { - if (report.policyID === policyID) { + const filteredReports = _.filter(policyExpenseReports, (policyExpenseReport) => { + if (policyExpenseReport.policyID === report.policyID) { return true; } return false; }); + return filteredReports; + // return _.map(filteredReports, (report) => { + // const policyExpenseChatAvatarSource = lodashGet(policies, [ + // `${ONYXKEYS.COLLECTION.POLICY}${report.policyID}`, 'avatar', + // ]) || getDefaultWorkspaceAvatar(workspaceName); + // return { + // ...report, + // }; + // }); } function getParticipantsOptions(report, personalDetails) { diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index d75cafad61a4..08e2f9458d02 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -106,12 +106,15 @@ const Steps = { const MoneyRequestModal = (props) => { const reportParticipants = lodashGet(props, 'report.participants', []); - const participantsWithDetails = _.map(ReportUtils.isPolicyExpenseChat(props.report) ? OptionsListUtils.getPolicyExpenseReportOptions(props.report) : OptionsListUtils.getPersonalDetailsForLogins(reportParticipants, props.personalDetails), personalDetails => ({ + const participantsWithDetails = _.map(ReportUtils.isPolicyExpenseChat(props.report) ? OptionsListUtils.getPolicyExpenseReportOptions(props.report) : OptionsListUtils.getPersonalDetailsForLogins(reportParticipants, props.personalDetails), personalDetails => { + console.debug('careful!'); + console.debug(personalDetails); + return ({ login: personalDetails.login, text: personalDetails.displayName, firstName: lodashGet(personalDetails, 'firstName', ''), lastName: lodashGet(personalDetails, 'lastName', ''), - alternateText: Str.isSMSLogin(personalDetails.login) ? Str.removeSMSDomain(personalDetails.login) : personalDetails.login, + alternateText: 'Something', icons: [{ source: ReportUtils.getAvatar(personalDetails.avatar, personalDetails.login), name: personalDetails.login, @@ -120,7 +123,7 @@ const MoneyRequestModal = (props) => { keyForList: personalDetails.login, payPalMeAddress: lodashGet(personalDetails, 'payPalMeAddress', ''), phoneNumber: lodashGet(personalDetails, 'phoneNumber', ''), - })); + });}); // Skip IOUParticipants step if participants are passed in const steps = reportParticipants.length ? [Steps.MoneyRequestAmount, Steps.MoneyRequestConfirm] : [Steps.MoneyRequestAmount, Steps.MoneyRequestParticipants, Steps.MoneyRequestConfirm]; From ca7d9c7908878de6a3de04d7ea616e30315ae236 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Sat, 8 Apr 2023 01:36:38 +0300 Subject: [PATCH 09/27] Rename personalDetails to option --- src/pages/iou/MoneyRequestModal.js | 26 ++++++++++---------------- 1 file changed, 10 insertions(+), 16 deletions(-) diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index 08e2f9458d02..251ba7ba1b8c 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -106,23 +106,17 @@ const Steps = { const MoneyRequestModal = (props) => { const reportParticipants = lodashGet(props, 'report.participants', []); - const participantsWithDetails = _.map(ReportUtils.isPolicyExpenseChat(props.report) ? OptionsListUtils.getPolicyExpenseReportOptions(props.report) : OptionsListUtils.getPersonalDetailsForLogins(reportParticipants, props.personalDetails), personalDetails => { - console.debug('careful!'); - console.debug(personalDetails); + const participantsWithDetails = _.map(ReportUtils.isPolicyExpenseChat(props.report) ? OptionsListUtils.getPolicyExpenseReportOptions(props.report) : OptionsListUtils.getParticipantsOptions(props.report, props.personalDetails), option => { return ({ - login: personalDetails.login, - text: personalDetails.displayName, - firstName: lodashGet(personalDetails, 'firstName', ''), - lastName: lodashGet(personalDetails, 'lastName', ''), - alternateText: 'Something', - icons: [{ - source: ReportUtils.getAvatar(personalDetails.avatar, personalDetails.login), - name: personalDetails.login, - type: CONST.ICON_TYPE_AVATAR, - }], - keyForList: personalDetails.login, - payPalMeAddress: lodashGet(personalDetails, 'payPalMeAddress', ''), - phoneNumber: lodashGet(personalDetails, 'phoneNumber', ''), + login: option.login, + text: option.displayName, + firstName: lodashGet(option, 'firstName', ''), + lastName: lodashGet(option, 'lastName', ''), + alternateText: option.alternateText, + icons: option.icons, + keyForList: option.login, + payPalMeAddress: lodashGet(option, 'payPalMeAddress', ''), + phoneNumber: lodashGet(option, 'phoneNumber', ''), });}); // Skip IOUParticipants step if participants are passed in From 13ff8e3f09900dab9c932058d26507ea892aecf7 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Sat, 8 Apr 2023 01:39:00 +0300 Subject: [PATCH 10/27] handle option icons and alternateText --- src/libs/OptionsListUtils.js | 33 +++++++++++++++++++++++---------- 1 file changed, 23 insertions(+), 10 deletions(-) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index 2dcb1040af35..7f9eb0b1a909 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -99,20 +99,33 @@ function getPolicyExpenseReportOptions(report) { } return false; }); - return filteredReports; - // return _.map(filteredReports, (report) => { - // const policyExpenseChatAvatarSource = lodashGet(policies, [ - // `${ONYXKEYS.COLLECTION.POLICY}${report.policyID}`, 'avatar', - // ]) || getDefaultWorkspaceAvatar(workspaceName); - // return { - // ...report, - // }; - // }); + return _.map(filteredReports, (report) => { + const policyExpenseChatAvatarSource = lodashGet(policies, [ + `${ONYXKEYS.COLLECTION.POLICY}${report.policyID}`, 'avatar', + ]) || ReportUtils.getDefaultWorkspaceAvatar(report.displayName); + return { + ...report, + alternateText: Localize.translateLocal('workspace.common.workspace'), + icons: [{ + source: policyExpenseChatAvatarSource, + name: report.displayName, + type: CONST.ICON_TYPE_WORKSPACE, + }], + }; + }); } function getParticipantsOptions(report, personalDetails) { const participants = lodashGet(report, 'participants', []); - return getPersonalDetailsForLogins(participants, personalDetails); + return _.map(getPersonalDetailsForLogins(participants, personalDetails), details => ({ + ...details, + alternateText: Str.isSMSLogin(details.login) ? Str.removeSMSDomain(details.login) : details.login, + icons: [{ + source: ReportUtils.getAvatar(details.avatar, details.login), + name: details.login, + type: CONST.ICON_TYPE_AVATAR, + }], + })); } /** From b1654c587853854952b31b227e124b1ed5a2c54e Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Sat, 8 Apr 2023 01:55:16 +0300 Subject: [PATCH 11/27] Make Lint happy --- src/libs/OptionsListUtils.js | 38 +++++++++++++++--------------- src/pages/iou/MoneyRequestModal.js | 31 +++++++++++++----------- 2 files changed, 36 insertions(+), 33 deletions(-) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index 7f9eb0b1a909..64a913074b6d 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -93,41 +93,28 @@ function getPolicyExpenseReportOptions(report) { if (!ReportUtils.isPolicyExpenseChat(report)) { return []; } - const filteredReports = _.filter(policyExpenseReports, (policyExpenseReport) => { + const filteredPolicyExpenseReports = _.filter(policyExpenseReports, (policyExpenseReport) => { if (policyExpenseReport.policyID === report.policyID) { return true; } return false; }); - return _.map(filteredReports, (report) => { + return _.map(filteredPolicyExpenseReports, (expenseReport) => { const policyExpenseChatAvatarSource = lodashGet(policies, [ - `${ONYXKEYS.COLLECTION.POLICY}${report.policyID}`, 'avatar', - ]) || ReportUtils.getDefaultWorkspaceAvatar(report.displayName); + `${ONYXKEYS.COLLECTION.POLICY}${expenseReport.policyID}`, 'avatar', + ]) || ReportUtils.getDefaultWorkspaceAvatar(expenseReport.displayName); return { - ...report, + ...expenseReport, alternateText: Localize.translateLocal('workspace.common.workspace'), icons: [{ source: policyExpenseChatAvatarSource, - name: report.displayName, + name: expenseReport.displayName, type: CONST.ICON_TYPE_WORKSPACE, }], }; }); } -function getParticipantsOptions(report, personalDetails) { - const participants = lodashGet(report, 'participants', []); - return _.map(getPersonalDetailsForLogins(participants, personalDetails), details => ({ - ...details, - alternateText: Str.isSMSLogin(details.login) ? Str.removeSMSDomain(details.login) : details.login, - icons: [{ - source: ReportUtils.getAvatar(details.avatar, details.login), - name: details.login, - type: CONST.ICON_TYPE_AVATAR, - }], - })); -} - /** * Adds expensify SMS domain (@expensify.sms) if login is a phone number and if it's not included yet * @@ -177,6 +164,19 @@ function getPersonalDetailsForLogins(logins, personalDetails) { return personalDetailsForLogins; } +function getParticipantsOptions(report, personalDetails) { + const participants = lodashGet(report, 'participants', []); + return _.map(getPersonalDetailsForLogins(participants, personalDetails), details => ({ + ...details, + alternateText: Str.isSMSLogin(details.login) ? Str.removeSMSDomain(details.login) : details.login, + icons: [{ + source: ReportUtils.getAvatar(details.avatar, details.login), + name: details.login, + type: CONST.ICON_TYPE_AVATAR, + }], + })); +} + /** * Constructs a Set with all possible names (displayName, firstName, lastName, email) for all participants in a report, * to be used in isSearchStringMatch. diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index 251ba7ba1b8c..6c427d7eb77d 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -6,7 +6,6 @@ import {View} from 'react-native'; import PropTypes from 'prop-types'; import lodashGet from 'lodash/get'; import {withOnyx} from 'react-native-onyx'; -import Str from 'expensify-common/lib/str'; import MoneyRequestAmountPage from './steps/MoneyRequestAmountPage'; import MoneyRequestParticipantsPage from './steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage'; import MoneyRequestConfirmPage from './steps/MoneyRequestConfirmPage'; @@ -105,21 +104,25 @@ const Steps = { }; const MoneyRequestModal = (props) => { - const reportParticipants = lodashGet(props, 'report.participants', []); - const participantsWithDetails = _.map(ReportUtils.isPolicyExpenseChat(props.report) ? OptionsListUtils.getPolicyExpenseReportOptions(props.report) : OptionsListUtils.getParticipantsOptions(props.report, props.personalDetails), option => { - return ({ - login: option.login, - text: option.displayName, - firstName: lodashGet(option, 'firstName', ''), - lastName: lodashGet(option, 'lastName', ''), - alternateText: option.alternateText, - icons: option.icons, - keyForList: option.login, - payPalMeAddress: lodashGet(option, 'payPalMeAddress', ''), - phoneNumber: lodashGet(option, 'phoneNumber', ''), - });}); + const participantsWithDetails = _.map( + ReportUtils.isPolicyExpenseChat(props.report) + ? OptionsListUtils.getPolicyExpenseReportOptions(props.report) + : OptionsListUtils.getParticipantsOptions(props.report, props.personalDetails), + option => ({ + login: option.login, + text: option.displayName, + firstName: lodashGet(option, 'firstName', ''), + lastName: lodashGet(option, 'lastName', ''), + alternateText: option.alternateText, + icons: option.icons, + keyForList: option.login, + payPalMeAddress: lodashGet(option, 'payPalMeAddress', ''), + phoneNumber: lodashGet(option, 'phoneNumber', ''), + }), + ); // Skip IOUParticipants step if participants are passed in + const reportParticipants = lodashGet(props, 'report.participants', []); const steps = reportParticipants.length ? [Steps.MoneyRequestAmount, Steps.MoneyRequestConfirm] : [Steps.MoneyRequestAmount, Steps.MoneyRequestParticipants, Steps.MoneyRequestConfirm]; const prevCreatingIOUTransactionStatusRef = useRef(lodashGet(props.iou, 'creatingIOUTransaction')); From c59279a6870799c6e42187428412392fff6b40d7 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Mon, 10 Apr 2023 22:17:06 +0300 Subject: [PATCH 12/27] Do not request money if the participant is a workspace. --- src/pages/iou/MoneyRequestModal.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index 6c427d7eb77d..62211804a178 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -329,6 +329,11 @@ const MoneyRequestModal = (props) => { ); return; } + console.debug(selectedParticipants); + if (!selectedParticipants[0].login) { + // TODO - request to the policy expense chat. Not implemented yet! + return; + } IOU.requestMoney( props.report, Math.round(amount * 100), From ba9741a565b588ffeda8f897a3653553189e63ad Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Wed, 12 Apr 2023 17:07:47 +0300 Subject: [PATCH 13/27] Add issue in the comment. --- src/pages/iou/MoneyRequestModal.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index 62211804a178..a86b53a17e8f 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -332,6 +332,7 @@ const MoneyRequestModal = (props) => { console.debug(selectedParticipants); if (!selectedParticipants[0].login) { // TODO - request to the policy expense chat. Not implemented yet! + // Will be implemented here: https://github.com/Expensify/Expensify/issues/270581 return; } IOU.requestMoney( From 33969d7c43ed44cae45c89df4bc2d5e88b595750 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Wed, 12 Apr 2023 17:25:23 +0300 Subject: [PATCH 14/27] Update src/libs/OptionsListUtils.js Co-authored-by: Fedi Rajhi --- src/libs/OptionsListUtils.js | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index 2f7e5d68cb55..0b80a1662610 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -93,12 +93,7 @@ function getPolicyExpenseReportOptions(report) { if (!ReportUtils.isPolicyExpenseChat(report)) { return []; } - const filteredPolicyExpenseReports = _.filter(policyExpenseReports, (policyExpenseReport) => { - if (policyExpenseReport.policyID === report.policyID) { - return true; - } - return false; - }); + const filteredPolicyExpenseReports = _.filter(policyExpenseReports, policyExpenseReport => policyExpenseReport.policyID === report.policyID); return _.map(filteredPolicyExpenseReports, (expenseReport) => { const policyExpenseChatAvatarSource = lodashGet(policies, [ `${ONYXKEYS.COLLECTION.POLICY}${expenseReport.policyID}`, 'avatar', From fcda6a8015cf57c1c6bee8a87fe7373cf946b4fd Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Wed, 12 Apr 2023 17:26:44 +0300 Subject: [PATCH 15/27] Update src/libs/OptionsListUtils.js Co-authored-by: Fedi Rajhi --- src/libs/OptionsListUtils.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index 0b80a1662610..a7ac47041946 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -100,6 +100,7 @@ function getPolicyExpenseReportOptions(report) { ]) || ReportUtils.getDefaultWorkspaceAvatar(expenseReport.displayName); return { ...expenseReport, + keyForList: expenseReport.policyID, alternateText: Localize.translateLocal('workspace.common.workspace'), icons: [{ source: policyExpenseChatAvatarSource, From 3c9ebb2a1da49b4979b8812d24e88a4f1300c617 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Wed, 12 Apr 2023 17:26:59 +0300 Subject: [PATCH 16/27] Update src/pages/iou/MoneyRequestModal.js Co-authored-by: Fedi Rajhi --- src/pages/iou/MoneyRequestModal.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index a86b53a17e8f..52858a5bd7d0 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -115,7 +115,7 @@ const MoneyRequestModal = (props) => { lastName: lodashGet(option, 'lastName', ''), alternateText: option.alternateText, icons: option.icons, - keyForList: option.login, + keyForList: lodashGet(option, 'keyForList', option.login), payPalMeAddress: lodashGet(option, 'payPalMeAddress', ''), phoneNumber: lodashGet(option, 'phoneNumber', ''), }), From e813f18b70aee41882598b77a63634b7f97e3f23 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Wed, 12 Apr 2023 17:27:33 +0300 Subject: [PATCH 17/27] Update src/pages/iou/MoneyRequestModal.js Co-authored-by: Vit Horacek <36083550+mountiny@users.noreply.github.com> --- src/pages/iou/MoneyRequestModal.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index 52858a5bd7d0..7e8b57ffd572 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -329,7 +329,6 @@ const MoneyRequestModal = (props) => { ); return; } - console.debug(selectedParticipants); if (!selectedParticipants[0].login) { // TODO - request to the policy expense chat. Not implemented yet! // Will be implemented here: https://github.com/Expensify/Expensify/issues/270581 From a42f122a3f0f7c30c139414ffb028b4b81717bc2 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Wed, 12 Apr 2023 18:24:33 +0300 Subject: [PATCH 18/27] Rename iou to moneyRequest in translation keys. --- src/components/MoneyRequestConfirmationList.js | 6 +++--- src/languages/en.js | 2 +- src/languages/es.js | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index eb147132b9bc..c97bfbfc675d 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -181,13 +181,13 @@ class MoneyRequestConfirmationList extends Component { ); sections.push({ - title: this.props.translate('iOUConfirmationList.whoPaid'), + title: this.props.translate('moneyRequestConfirmationList.whoPaid'), data: [formattedMyPersonalDetails], shouldShow: true, indexOffset: 0, isDisabled: true, }, { - title: this.props.translate('iOUConfirmationList.whoWasThere'), + title: this.props.translate('moneyRequestConfirmationList.whoWasThere'), data: formattedParticipants, shouldShow: true, indexOffset: 1, @@ -280,7 +280,7 @@ class MoneyRequestConfirmationList extends Component { onSelectRow={canModifyParticipants ? this.toggleOption : undefined} onConfirmSelection={this.confirm} onChangeText={this.props.onUpdateComment} - textInputLabel={this.props.translate('iOUConfirmationList.whatsItFor')} + textInputLabel={this.props.translate('moneyRequestConfirmationList.whatsItFor')} placeholderText={this.props.translate('common.optional')} selectedOptions={this.getSelectedOptions()} canSelectMultipleOptions={canModifyParticipants} diff --git a/src/languages/en.js b/src/languages/en.js index c1229dcf979a..067dec009d6e 100755 --- a/src/languages/en.js +++ b/src/languages/en.js @@ -181,7 +181,7 @@ export default { tfaRequiredTitle: 'Two factor authentication\nrequired', tfaRequiredDescription: 'Please enter the two-factor authentication code\nwhere you are trying to sign in.', }, - iOUConfirmationList: { + moneyRequestConfirmationList: { whoPaid: 'Who paid?', whoWasThere: 'Who was there?', whatsItFor: 'What\'s it for?', diff --git a/src/languages/es.js b/src/languages/es.js index ef5fe94a360a..d730dcf8ab54 100644 --- a/src/languages/es.js +++ b/src/languages/es.js @@ -180,7 +180,7 @@ export default { tfaRequiredTitle: 'Se requiere autenticación\nde dos factores', tfaRequiredDescription: 'Por favor, introduce el código de autenticación de dos factores\ndonde estás intentando iniciar sesión.', }, - iOUConfirmationList: { + moneyRequestConfirmationList: { whoPaid: '¿Quién pago?', whoWasThere: '¿Quién asistió?', whatsItFor: '¿Para qué es?', From f5aa96eca3d09e2e70b8fe3a13666e3e79d91aa4 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Wed, 12 Apr 2023 18:44:48 +0300 Subject: [PATCH 19/27] Add phoneNumber and payPalMeAddress props to OptionPropTypes --- src/components/optionPropTypes.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/components/optionPropTypes.js b/src/components/optionPropTypes.js index b5966c13f676..c2fef99c2814 100644 --- a/src/components/optionPropTypes.js +++ b/src/components/optionPropTypes.js @@ -66,4 +66,10 @@ export default PropTypes.shape({ /** If we need to show a brick road indicator or not */ brickRoadIndicator: PropTypes.oneOf([CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR, '']), + + // Phone number + phoneNumber: PropTypes.string, + + // PayPal.Me link + payPalMeAddress: PropTypes.string, }); From 37e77402e55e35ca96170f5501d41af43cd30f6d Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Wed, 12 Apr 2023 18:48:20 +0300 Subject: [PATCH 20/27] Better naming. --- .../MoneyRequestParticipantsPage.js | 4 ++-- ...antsRequest.js => MoneyRequestParticipantsSelector.js} | 8 ++++---- 2 files changed, 6 insertions(+), 6 deletions(-) rename src/pages/iou/steps/MoneyRequstParticipantsPage/{MoneyRequestParticipantsRequest.js => MoneyRequestParticipantsSelector.js} (96%) diff --git a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js index d22e30e07c8f..0a4aab2d7ac0 100644 --- a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js @@ -4,7 +4,7 @@ import {withOnyx} from 'react-native-onyx'; import {View} from 'react-native'; import ONYXKEYS from '../../../../ONYXKEYS'; import MoneyRequestParticipantsSplit from './MoneyRequestParticipantsSplit'; -import MoneyRequestParticipantsRequest from './MoneyRequestParticipantsRequest'; +import MoneyRequestParticipantsSelector from './MoneyRequestParticipantsSelector'; import styles from '../../../../styles/styles'; import FullScreenLoadingIndicator from '../../../../components/FullscreenLoadingIndicator'; import optionPropTypes from '../../../../components/optionPropTypes'; @@ -66,7 +66,7 @@ const MoneyRequestParticipantsPage = (props) => { /> ) : ( - Date: Wed, 12 Apr 2023 18:49:24 +0300 Subject: [PATCH 21/27] Better naming. --- .../MoneyRequestParticipantsPage.js | 4 ++-- ...sSplit.js => MoneyRequestParticipantsSplitSelector.js} | 8 ++++---- 2 files changed, 6 insertions(+), 6 deletions(-) rename src/pages/iou/steps/MoneyRequstParticipantsPage/{MoneyRequestParticipantsSplit.js => MoneyRequestParticipantsSplitSelector.js} (97%) diff --git a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js index 0a4aab2d7ac0..e94a6330f2b5 100644 --- a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import {withOnyx} from 'react-native-onyx'; import {View} from 'react-native'; import ONYXKEYS from '../../../../ONYXKEYS'; -import MoneyRequestParticipantsSplit from './MoneyRequestParticipantsSplit'; +import MoneyRequestParticipantsSplitSelector from './MoneyRequestParticipantsSplitSelector'; import MoneyRequestParticipantsSelector from './MoneyRequestParticipantsSelector'; import styles from '../../../../styles/styles'; import FullScreenLoadingIndicator from '../../../../components/FullscreenLoadingIndicator'; @@ -58,7 +58,7 @@ const MoneyRequestParticipantsPage = (props) => { return (props.hasMultipleParticipants ? ( - Date: Wed, 12 Apr 2023 18:52:31 +0300 Subject: [PATCH 22/27] Optimize function call --- src/pages/iou/MoneyRequestModal.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index 7e8b57ffd572..e90f099e3450 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -384,7 +384,7 @@ const MoneyRequestModal = (props) => { setSelectedOptions(selectedParticipants)} + onAddParticipants={setSelectedOptions} onStepComplete={navigateToNextStep} safeAreaPaddingBottomStyle={safeAreaPaddingBottomStyle} iouType={props.iouType} From c200d9373aa9a6e52f214b75c418ff26b7ff0e77 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Wed, 12 Apr 2023 19:34:57 +0300 Subject: [PATCH 23/27] Move mapping from MoneyRequestModal to OptionsListUtils --- src/libs/OptionsListUtils.js | 9 ++++++++- src/pages/iou/MoneyRequestModal.js | 19 +++---------------- 2 files changed, 11 insertions(+), 17 deletions(-) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index a7ac47041946..08a66092e8a6 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -101,6 +101,7 @@ function getPolicyExpenseReportOptions(report) { return { ...expenseReport, keyForList: expenseReport.policyID, + text: expenseReport.displayName, alternateText: Localize.translateLocal('workspace.common.workspace'), icons: [{ source: policyExpenseChatAvatarSource, @@ -163,13 +164,19 @@ function getPersonalDetailsForLogins(logins, personalDetails) { function getParticipantsOptions(report, personalDetails) { const participants = lodashGet(report, 'participants', []); return _.map(getPersonalDetailsForLogins(participants, personalDetails), details => ({ - ...details, + keyForList: details.login, + login: details.login, + text: details.displayName, + firstName: lodashGet(details, 'firstName', ''), + lastName: lodashGet(details, 'lastName', ''), alternateText: Str.isSMSLogin(details.login) ? Str.removeSMSDomain(details.login) : details.login, icons: [{ source: ReportUtils.getAvatar(details.avatar, details.login), name: details.login, type: CONST.ICON_TYPE_AVATAR, }], + payPalMeAddress: lodashGet(details, 'payPalMeAddress', ''), + phoneNumber: lodashGet(details, 'phoneNumber', ''), })); } diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index e90f099e3450..51ad3f6c3bcc 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -104,22 +104,9 @@ const Steps = { }; const MoneyRequestModal = (props) => { - const participantsWithDetails = _.map( - ReportUtils.isPolicyExpenseChat(props.report) - ? OptionsListUtils.getPolicyExpenseReportOptions(props.report) - : OptionsListUtils.getParticipantsOptions(props.report, props.personalDetails), - option => ({ - login: option.login, - text: option.displayName, - firstName: lodashGet(option, 'firstName', ''), - lastName: lodashGet(option, 'lastName', ''), - alternateText: option.alternateText, - icons: option.icons, - keyForList: lodashGet(option, 'keyForList', option.login), - payPalMeAddress: lodashGet(option, 'payPalMeAddress', ''), - phoneNumber: lodashGet(option, 'phoneNumber', ''), - }), - ); + const participantsWithDetails = ReportUtils.isPolicyExpenseChat(props.report) + ? OptionsListUtils.getPolicyExpenseReportOptions(props.report) + : OptionsListUtils.getParticipantsOptions(props.report, props.personalDetails); // Skip IOUParticipants step if participants are passed in const reportParticipants = lodashGet(props, 'report.participants', []); From 41b9d748a6198ad1907566c7ca0f9c1139fe425b Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Thu, 13 Apr 2023 23:48:44 +0300 Subject: [PATCH 24/27] Update src/libs/OptionsListUtils.js Co-authored-by: Fedi Rajhi --- src/libs/OptionsListUtils.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index 08a66092e8a6..72792c9ae062 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -89,6 +89,11 @@ Onyx.connect({ }, }); +/** + * Get the options for a policy expense report. + * @param {Object} report + * @returns {Array} + */ function getPolicyExpenseReportOptions(report) { if (!ReportUtils.isPolicyExpenseChat(report)) { return []; From ffd15bffef50015a3eb5e9bf8fa92a83144619e8 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Thu, 13 Apr 2023 23:48:53 +0300 Subject: [PATCH 25/27] Update src/libs/OptionsListUtils.js Co-authored-by: Fedi Rajhi --- src/libs/OptionsListUtils.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index 72792c9ae062..2a2508b0d84c 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -166,6 +166,12 @@ function getPersonalDetailsForLogins(logins, personalDetails) { return personalDetailsForLogins; } +/** + * Get the participant options for a report. + * @param {Object} report + * @param {Array} personalDetailList + * @returns {Array} + */ function getParticipantsOptions(report, personalDetails) { const participants = lodashGet(report, 'participants', []); return _.map(getPersonalDetailsForLogins(participants, personalDetails), details => ({ From 4f995a9c2ca59ffe8e302ad40ee166a4ffc95d70 Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Thu, 13 Apr 2023 23:49:56 +0300 Subject: [PATCH 26/27] Remove useless comments. --- src/components/optionPropTypes.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/components/optionPropTypes.js b/src/components/optionPropTypes.js index c2fef99c2814..bb1a7a073b61 100644 --- a/src/components/optionPropTypes.js +++ b/src/components/optionPropTypes.js @@ -67,9 +67,7 @@ export default PropTypes.shape({ /** If we need to show a brick road indicator or not */ brickRoadIndicator: PropTypes.oneOf([CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR, '']), - // Phone number phoneNumber: PropTypes.string, - // PayPal.Me link payPalMeAddress: PropTypes.string, }); From 9754a32f38b6e05044aa5198d5be4b8b0b6b920b Mon Sep 17 00:00:00 2001 From: Cristi Paval Date: Thu, 13 Apr 2023 23:56:31 +0300 Subject: [PATCH 27/27] Avoid repeating logic at every component render. --- src/libs/OptionsListUtils.js | 2 +- src/pages/iou/MoneyRequestModal.js | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index 2a2508b0d84c..ec7eb98940d1 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -169,7 +169,7 @@ function getPersonalDetailsForLogins(logins, personalDetails) { /** * Get the participant options for a report. * @param {Object} report - * @param {Array} personalDetailList + * @param {Array} personalDetails * @returns {Array} */ function getParticipantsOptions(report, personalDetails) { diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index 51ad3f6c3bcc..ce05e103cbe9 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -104,10 +104,6 @@ const Steps = { }; const MoneyRequestModal = (props) => { - const participantsWithDetails = ReportUtils.isPolicyExpenseChat(props.report) - ? OptionsListUtils.getPolicyExpenseReportOptions(props.report) - : OptionsListUtils.getParticipantsOptions(props.report, props.personalDetails); - // Skip IOUParticipants step if participants are passed in const reportParticipants = lodashGet(props, 'report.participants', []); const steps = reportParticipants.length ? [Steps.MoneyRequestAmount, Steps.MoneyRequestConfirm] : [Steps.MoneyRequestAmount, Steps.MoneyRequestParticipants, Steps.MoneyRequestConfirm]; @@ -117,7 +113,11 @@ const MoneyRequestModal = (props) => { const [previousStepIndex, setPreviousStepIndex] = useState(0); const [currentStepIndex, setCurrentStepIndex] = useState(0); - const [selectedOptions, setSelectedOptions] = useState(participantsWithDetails); + const [selectedOptions, setSelectedOptions] = useState( + ReportUtils.isPolicyExpenseChat(props.report) + ? OptionsListUtils.getPolicyExpenseReportOptions(props.report) + : OptionsListUtils.getParticipantsOptions(props.report, props.personalDetails), + ); const [amount, setAmount] = useState(''); const [comment, setComment] = useState('');