diff --git a/src/components/IOUConfirmationList.js b/src/components/IOUConfirmationList.js index 224a13be27b2..50db4c7b272b 100755 --- a/src/components/IOUConfirmationList.js +++ b/src/components/IOUConfirmationList.js @@ -24,6 +24,9 @@ const propTypes = { /** Callback to inform parent modal of success */ onConfirm: PropTypes.func.isRequired, + /** Callback to to parent modal to send money */ + onSendMoney: PropTypes.func.isRequired, + // Callback to update comment from IOUModal onUpdateComment: PropTypes.func, @@ -149,7 +152,7 @@ class IOUConfirmationList extends Component { onPress(value) { if (this.props.iouType === CONST.IOU.IOU_TYPE.SEND) { Log.info(`[IOU] Sending money via: ${value}`); - this.props.onConfirm(); + this.props.onSendMoney(value); } else { Log.info(`[IOU] Requesting money via: ${value}`); this.props.onConfirm(this.getSplits()); @@ -387,7 +390,7 @@ class IOUConfirmationList extends Component { onPress={this.onPress} shouldShowPaypal={Boolean(recipient.payPalMeAddress)} recipientPhoneNumber={recipient.phoneNumber} - currency={this.props.localCurrencyCode} + currency={this.props.iou.selectedCurrencyCode} /> ) : ( Onyx.merge(ONYXKEYS.IOU, {loading: false})), + .finally(() => { + Onyx.merge(ONYXKEYS.IOU, {loading: false}); + + if (shouldRedirectToChatReport) { + Navigation.navigate(ROUTES.REPORT); + } + }), url); } diff --git a/src/pages/iou/IOUModal.js b/src/pages/iou/IOUModal.js index 5c1eb004a4fd..c8270fd13c25 100755 --- a/src/pages/iou/IOUModal.js +++ b/src/pages/iou/IOUModal.js @@ -111,6 +111,7 @@ class IOUModal extends Component { this.addParticipants = this.addParticipants.bind(this); this.createTransaction = this.createTransaction.bind(this); this.updateComment = this.updateComment.bind(this); + this.sendMoney = this.sendMoney.bind(this); const participants = lodashGet(props, 'report.participants', []); const participantsWithDetails = _.map(OptionsListUtils.getPersonalDetailsForLogins(participants, props.personalDetails), personalDetails => ({ login: personalDetails.login, @@ -121,8 +122,6 @@ class IOUModal extends Component { payPalMeAddress: lodashGet(personalDetails, 'payPalMeAddress', ''), phoneNumber: lodashGet(personalDetails, 'phoneNumber', ''), })); - this.isSendRequest = props.iouType === CONST.IOU.IOU_TYPE.SEND; - this.hasGoldWallet = props.userWallet.tierName && props.userWallet.tiername === CONST.WALLET.TIER_NAME.GOLD; this.state = { previousStepIndex: 0, @@ -193,6 +192,7 @@ class IOUModal extends Component { */ getTitleForStep() { const currentStepIndex = this.state.currentStepIndex; + const isSendingMoney = this.props.iouType === CONST.IOU.IOU_TYPE.SEND; if (currentStepIndex === 1 || currentStepIndex === 2) { const formattedAmount = this.props.numberFormat( this.state.amount, { @@ -200,7 +200,7 @@ class IOUModal extends Component { currency: this.props.iou.selectedCurrencyCode, }, ); - if (this.isSendRequest) { + if (isSendingMoney) { return this.props.translate('iou.send', { amount: formattedAmount, }); @@ -212,7 +212,7 @@ class IOUModal extends Component { ); } if (currentStepIndex === 0) { - if (this.isSendRequest) { + if (isSendingMoney) { return this.props.translate('iou.sendMoney'); } return this.props.translate(this.props.hasMultipleParticipants ? 'iou.splitBill' : 'iou.requestMoney'); @@ -221,6 +221,22 @@ class IOUModal extends Component { return this.props.translate(this.steps[currentStepIndex]) || ''; } + /** + * Update comment whenever user enters any new text + * + * @param {String} comment + */ + updateComment(comment) { + this.setState({ + comment, + }); + } + + /** + * Update participants whenever user selects the payment recipient + * + * @param {Array} participants + */ addParticipants(participants) { this.setState({ participants, @@ -247,6 +263,7 @@ class IOUModal extends Component { if (this.state.currentStepIndex >= this.steps.length - 1) { return; } + this.setState(prevState => ({ previousStepIndex: prevState.currentStepIndex, currentStepIndex: prevState.currentStepIndex + 1, @@ -254,28 +271,53 @@ class IOUModal extends Component { } /** - * Update comment whenever user enters any new text + * Checks if user has a GOLD wallet then creates a paid IOU report on the fly * - * @param {String} comment + * @param {String} paymentMethodType */ - updateComment(comment) { - this.setState({ + sendMoney(paymentMethodType) { + const hasGoldWallet = this.props.userWallet.tierName && this.props.userWallet.tierName === CONST.WALLET.TIER_NAME.GOLD; + + // If the user is trying to send money, then they need to upgrade to a GOLD wallet + if (!hasGoldWallet) { + Navigation.navigate(ROUTES.IOU_ENABLE_PAYMENTS); + return; + } + + const amount = Math.round(this.state.amount * 100); + const currency = this.props.iou.selectedCurrencyCode; + const comment = this.state.comment; + + const newIOUReportDetails = JSON.stringify({ + amount, + currency, + requestorEmail: this.state.participants[0].login, + comment, + idempotencyKey: Str.guid(), + }); + + IOU.payIOUReport({ + chatReportID: lodashGet(this.props, 'route.params.reportID', ''), + reportID: 0, + paymentMethodType, + amount, + currency, + requestorPayPalMeAddress: this.state.participants[0].payPalMeAddress, + requestorPhoneNumber: this.state.participants[0].phoneNumber, comment, + newIOUReportDetails, + shouldRedirectToChatReport: true, }); } /** + * Create the IOU transaction + * * @param {Array} [splits] */ createTransaction(splits) { const reportID = lodashGet(this.props, 'route.params.reportID', ''); - // If the user is trying to send money, then they need to upgrade to a GOLD wallet - if (this.isSendRequest && !this.hasGoldWallet) { - Navigation.navigate(ROUTES.IOU_ENABLE_PAYMENTS); - return; - } - // Only splits from a group DM has a reportID // Check if reportID is a number if (splits && CONST.REGEX.NUMBER.test(reportID)) { @@ -290,11 +332,12 @@ class IOUModal extends Component { }); return; } + if (splits) { IOU.createIOUSplit({ comment: this.state.comment, - // should send in cents to API + // Send in cents to API. amount: Math.round(this.state.amount * 100), currency: this.props.iou.selectedCurrencyCode, splits, @@ -305,7 +348,7 @@ class IOUModal extends Component { IOU.createIOUTransaction({ comment: this.state.comment, - // should send in cents to API + // Send in cents to API. amount: Math.round(this.state.amount * 100), currency: this.props.iou.selectedCurrencyCode, debtorEmail: OptionsListUtils.addSMSDomainIfPhoneNumber(this.state.participants[0].login), @@ -398,13 +441,13 @@ class IOUModal extends Component { > diff --git a/src/pages/iou/steps/IOUConfirmPage.js b/src/pages/iou/steps/IOUConfirmPage.js index faf91a48ceea..4dcf0373af38 100644 --- a/src/pages/iou/steps/IOUConfirmPage.js +++ b/src/pages/iou/steps/IOUConfirmPage.js @@ -7,6 +7,9 @@ const propTypes = { /** Callback to inform parent modal of success */ onConfirm: PropTypes.func.isRequired, + /** Callback to to parent modal to send money */ + onSendMoney: PropTypes.func.isRequired, + /** Callback to update comment from IOUModal */ onUpdateComment: PropTypes.func, @@ -19,8 +22,6 @@ const propTypes = { /** IOU amount */ iouAmount: PropTypes.string.isRequired, - localCurrencyCode: PropTypes.string, - /** Selected participants from IOUMOdal with login */ participants: PropTypes.arrayOf(PropTypes.shape({ login: PropTypes.string.isRequired, @@ -49,7 +50,6 @@ const defaultProps = { onUpdateComment: null, comment: '', iouType: CONST.IOU.IOU_TYPE.REQUEST, - localCurrencyCode: CONST.CURRENCY.USD, }; const IOUConfirmPage = props => ( @@ -60,8 +60,8 @@ const IOUConfirmPage = props => ( onUpdateComment={props.onUpdateComment} iouAmount={props.iouAmount} onConfirm={props.onConfirm} + onSendMoney={props.onSendMoney} iouType={props.iouType} - localCurrencyCode={props.localCurrencyCode} isGroupSplit={props.isGroupSplit} /> ); diff --git a/src/pages/iou/steps/IOUParticipantsPage/index.js b/src/pages/iou/steps/IOUParticipantsPage/index.js index b5296119dce4..d5397a978514 100644 --- a/src/pages/iou/steps/IOUParticipantsPage/index.js +++ b/src/pages/iou/steps/IOUParticipantsPage/index.js @@ -30,6 +30,8 @@ const propTypes = { isPinned: PropTypes.bool, isUnread: PropTypes.bool, reportID: PropTypes.number, + phoneNumber: PropTypes.string, + payPalMeAddress: PropTypes.string, })), /* Onyx Props */