diff --git a/src/ROUTES.js b/src/ROUTES.js index 6fd4f7376b73..b6eea9b7a320 100644 --- a/src/ROUTES.js +++ b/src/ROUTES.js @@ -9,7 +9,6 @@ const REPORT = 'r'; const IOU_REQUEST = 'request/new'; const IOU_BILL = 'split/new'; const IOU_SEND = 'send/new'; -const IOU_DETAILS = 'iou/details'; const IOU_REQUEST_CURRENCY = `${IOU_REQUEST}/currency`; const IOU_BILL_CURRENCY = `${IOU_BILL}/currency`; const IOU_SEND_CURRENCY = `${IOU_SEND}/currency`; @@ -94,12 +93,6 @@ export default { getIouRequestCurrencyRoute: (reportID, currency, backTo) => `${IOU_REQUEST_CURRENCY}/${reportID}?currency=${currency}&backTo=${backTo}`, getIouBillCurrencyRoute: (reportID, currency, backTo) => `${IOU_BILL_CURRENCY}/${reportID}?currency=${currency}&backTo=${backTo}`, getIouSendCurrencyRoute: (reportID, currency, backTo) => `${IOU_SEND_CURRENCY}/${reportID}?currency=${currency}&backTo=${backTo}`, - IOU_DETAILS, - IOU_DETAILS_ADD_BANK_ACCOUNT: `${IOU_DETAILS}/add-bank-account`, - IOU_DETAILS_ADD_DEBIT_CARD: `${IOU_DETAILS}/add-debit-card`, - IOU_DETAILS_ENABLE_PAYMENTS: `${IOU_DETAILS}/enable-payments`, - IOU_DETAILS_WITH_IOU_REPORT_ID: `${IOU_DETAILS}/:chatReportID/:iouReportID/`, - getIouDetailsRoute: (chatReportID, iouReportID) => `iou/details/${chatReportID}/${iouReportID}`, getNewTaskRoute: (reportID) => `${NEW_TASK}/${reportID}`, NEW_TASK_WITH_REPORT_ID: `${NEW_TASK}/:reportID?`, TASK_TITLE: 'r/:reportID/title', diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index bcbb5d470bfa..048744c9eca7 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -43,6 +43,9 @@ const propTypes = { /** Can the participants be modified or not */ canModifyParticipants: PropTypes.bool, + /** Depending on expense report or personal IOU report, respective bank account route */ + bankAccountRoute: PropTypes.string.isRequired, + ...windowDimensionsPropTypes, ...withLocalizePropTypes, @@ -289,7 +292,7 @@ class MoneyRequestConfirmationList extends Component { onPress={this.confirm} shouldShowPaypal={Boolean(recipient.payPalMeAddress)} enablePaymentsRoute={ROUTES.IOU_SEND_ENABLE_PAYMENTS} - addBankAccountRoute={ROUTES.IOU_SEND_ADD_BANK_ACCOUNT} + addBankAccountRoute={this.props.bankAccountRoute} addDebitCardRoute={ROUTES.IOU_SEND_ADD_DEBIT_CARD} currency={this.props.iou.selectedCurrencyCode} policyID={this.props.policyID} diff --git a/src/components/MoneyRequestHeader.js b/src/components/MoneyRequestHeader.js index 3f8a074e0bbb..e6dff2e9ec00 100644 --- a/src/components/MoneyRequestHeader.js +++ b/src/components/MoneyRequestHeader.js @@ -86,6 +86,7 @@ const MoneyRequestHeader = (props) => { const policy = props.policies[`${ONYXKEYS.COLLECTION.POLICY}${props.report.policyID}`]; const isPayer = Policy.isAdminOfFreePolicy([policy]) || (ReportUtils.isMoneyRequestReport(props.report) && lodashGet(props.session, 'email', null) === props.report.managerEmail); const shouldShowSettlementButton = !isSettled && !props.isSingleTransactionView && isPayer; + const bankAccountRoute = ReportUtils.getBankAccountRoute(props.chatReport); return ( { iouReport={props.report} onPress={(paymentType) => IOU.payMoneyRequest(paymentType, props.chatReport, props.report)} enablePaymentsRoute={ROUTES.BANK_ACCOUNT_NEW} - addBankAccountRoute={ROUTES.IOU_DETAILS_ADD_BANK_ACCOUNT} + addBankAccountRoute={bankAccountRoute} shouldShowPaymentOptions /> @@ -169,7 +170,7 @@ const MoneyRequestHeader = (props) => { iouReport={props.report} onPress={(paymentType) => IOU.payMoneyRequest(paymentType, props.chatReport, props.report)} enablePaymentsRoute={ROUTES.BANK_ACCOUNT_NEW} - addBankAccountRoute={ROUTES.IOU_DETAILS_ADD_BANK_ACCOUNT} + addBankAccountRoute={bankAccountRoute} shouldShowPaymentOptions /> )} diff --git a/src/components/ReportActionItem/IOUPreview.js b/src/components/ReportActionItem/IOUPreview.js index 108cc5fc5339..7210397e8326 100644 --- a/src/components/ReportActionItem/IOUPreview.js +++ b/src/components/ReportActionItem/IOUPreview.js @@ -76,9 +76,6 @@ const propTypes = { /** True if this is this IOU is a split instead of a 1:1 request */ isBillSplit: PropTypes.bool.isRequired, - /** True if the IOU Preview is rendered within a single IOUAction */ - isIOUAction: PropTypes.bool, - /** True if the IOU Preview card is hovered */ isHovered: PropTypes.bool, @@ -119,7 +116,6 @@ const defaultProps = { containerStyles: [], walletTerms: {}, pendingAction: null, - isIOUAction: true, isHovered: false, personalDetails: {}, session: { @@ -135,9 +131,6 @@ const IOUPreview = (props) => { const sessionEmail = lodashGet(props.session, 'email', null); const managerEmail = props.iouReport.managerEmail || ''; const ownerEmail = props.iouReport.ownerEmail || ''; - - // When displaying within a IOUDetailsModal we cannot guarantee that participants are included in the originalMessage data - // Because an IOUPreview of type split can never be rendered within the IOUDetailsModal, manually building the email array is only needed for non-billSplit ious const participantEmails = props.isBillSplit ? lodashGet(props.action, 'originalMessage.participants', []) : [managerEmail, ownerEmail]; const participantAvatars = OptionsListUtils.getAvatarsForLogins(participantEmails, props.personalDetails); @@ -146,9 +139,8 @@ const IOUPreview = (props) => { const moneyRequestAction = ReportUtils.getMoneyRequestAction(props.action); - // If props.action is undefined then we are displaying within IOUDetailsModal and should use the full report amount - const requestAmount = props.isIOUAction ? moneyRequestAction.amount : ReportUtils.getMoneyRequestTotal(props.iouReport); - const requestCurrency = props.isIOUAction ? moneyRequestAction.currency : props.iouReport.currency; + const requestAmount = moneyRequestAction.amount; + const requestCurrency = moneyRequestAction.currency; const requestComment = Str.htmlDecode(moneyRequestAction.comment).trim(); const getSettledMessage = () => { @@ -165,12 +157,6 @@ const IOUPreview = (props) => { }; const showContextMenu = (event) => { - // Use action prop to check if we are in IOUDetailsModal, - // if it's true, do nothing when user long press, otherwise show context menu. - if (!props.action) { - return; - } - showContextMenuForReport(event, props.contextMenuAnchor, props.chatReportID, props.action, props.checkIfContextMenuActive); }; diff --git a/src/components/ReportActionItem/ReportPreview.js b/src/components/ReportActionItem/ReportPreview.js index 4c85be327bba..9d023d968b64 100644 --- a/src/components/ReportActionItem/ReportPreview.js +++ b/src/components/ReportActionItem/ReportPreview.js @@ -99,6 +99,7 @@ const ReportPreview = (props) => { const managerEmail = props.iouReport.managerEmail || ''; const managerName = ReportUtils.isPolicyExpenseChat(props.chatReport) ? ReportUtils.getPolicyName(props.chatReport) : ReportUtils.getDisplayNameForParticipant(managerEmail, true); const isCurrentUserManager = managerEmail === lodashGet(props.session, 'email', null); + const bankAccountRoute = ReportUtils.getBankAccountRoute(props.chatReport); return ( {_.map(props.action.message, (message, index) => ( @@ -147,7 +148,7 @@ const ReportPreview = (props) => { iouReport={props.iouReport} onPress={(paymentType) => IOU.payMoneyRequest(paymentType, props.chatReport, props.iouReport)} enablePaymentsRoute={ROUTES.BANK_ACCOUNT_NEW} - addBankAccountRoute={ROUTES.IOU_DETAILS_ADD_BANK_ACCOUNT} + addBankAccountRoute={bankAccountRoute} style={[styles.requestPreviewBox]} /> )} diff --git a/src/libs/Navigation/AppNavigator/AuthScreens.js b/src/libs/Navigation/AppNavigator/AuthScreens.js index 04bd397d5f64..7f48a2ffb625 100644 --- a/src/libs/Navigation/AppNavigator/AuthScreens.js +++ b/src/libs/Navigation/AppNavigator/AuthScreens.js @@ -334,12 +334,6 @@ class AuthScreens extends React.Component { component={ModalStackNavigators.EnablePaymentsStackNavigator} listeners={modalScreenListeners} /> - { - const IOUDetailsModal = require('../../../pages/iou/IOUDetailsModal').default; - return IOUDetailsModal; - }, - name: 'IOU_Details_Root', - }, - { - getComponent: () => { - const AddPersonalBankAccountPage = require('../../../pages/AddPersonalBankAccountPage').default; - return AddPersonalBankAccountPage; - }, - name: 'IOU_Details_Add_Bank_Account', - }, - { - getComponent: () => { - const AddDebitCardPage = require('../../../pages/settings/Payments/AddDebitCardPage').default; - return AddDebitCardPage; - }, - name: 'IOU_Details_Add_Debit_Card', - }, - { - getComponent: () => { - const EnablePaymentsPage = require('../../../pages/EnablePayments/EnablePaymentsPage').default; - return EnablePaymentsPage; - }, - name: 'IOU_Details_Enable_Payments', - }, -]); - const DetailsModalStackNavigator = createModalStackNavigator([ { getComponent: () => { @@ -710,7 +679,6 @@ export { IOUBillStackNavigator, IOURequestModalStackNavigator, IOUSendModalStackNavigator, - IOUDetailsModalStackNavigator, DetailsModalStackNavigator, ReportDetailsModalStackNavigator, TaskModalStackNavigator, diff --git a/src/libs/Navigation/linkingConfig.js b/src/libs/Navigation/linkingConfig.js index c071f52ad092..b0471671b96c 100644 --- a/src/libs/Navigation/linkingConfig.js +++ b/src/libs/Navigation/linkingConfig.js @@ -287,14 +287,6 @@ export default { IOU_Send_Add_Debit_Card: ROUTES.IOU_SEND_ADD_DEBIT_CARD, }, }, - IOU_Details: { - screens: { - IOU_Details_Root: ROUTES.IOU_DETAILS_WITH_IOU_REPORT_ID, - IOU_Details_Enable_Payments: ROUTES.IOU_DETAILS_ENABLE_PAYMENTS, - IOU_Details_Add_Bank_Account: ROUTES.IOU_DETAILS_ADD_BANK_ACCOUNT, - IOU_Details_Add_Debit_Card: ROUTES.IOU_DETAILS_ADD_DEBIT_CARD, - }, - }, Task_Details: { screens: { Task_Title: ROUTES.TASK_TITLE, diff --git a/src/libs/ReportUtils.js b/src/libs/ReportUtils.js index 835330ca3ca0..e8fd18b7bcf4 100644 --- a/src/libs/ReportUtils.js +++ b/src/libs/ReportUtils.js @@ -331,6 +331,16 @@ function getPolicyType(report, policies) { return lodashGet(policies, [`${ONYXKEYS.COLLECTION.POLICY}${report.policyID}`, 'type'], ''); } +/** + * If the report is a policy expense, the route should be for adding bank account for that policy + * else since the report is a personal IOU, the route should be for personal bank account. + * @param {Object} report + * @returns {String} + */ +function getBankAccountRoute(report) { + return isPolicyExpenseChat(report) ? ROUTES.getBankAccountRoute('', report.policyID) : ROUTES.SETTINGS_ADD_BANK_ACCOUNT; +} + /** * Returns true if there are any guides accounts (team.expensify.com) in emails * @param {Array} emails @@ -2325,4 +2335,5 @@ export { isSettled, isAllowedToComment, getMoneyRequestAction, + getBankAccountRoute, }; diff --git a/src/pages/iou/IOUDetailsModal.js b/src/pages/iou/IOUDetailsModal.js deleted file mode 100644 index 84de2a089242..000000000000 --- a/src/pages/iou/IOUDetailsModal.js +++ /dev/null @@ -1,222 +0,0 @@ -import React, {Component} from 'react'; -import {View, ScrollView} from 'react-native'; -import PropTypes from 'prop-types'; -import {withOnyx} from 'react-native-onyx'; -import lodashGet from 'lodash/get'; -import _ from 'underscore'; -import styles from '../../styles/styles'; -import ONYXKEYS from '../../ONYXKEYS'; -import {withNetwork} from '../../components/OnyxProvider'; -import HeaderWithCloseButton from '../../components/HeaderWithCloseButton'; -import Navigation from '../../libs/Navigation/Navigation'; -import ScreenWrapper from '../../components/ScreenWrapper'; -import * as Report from '../../libs/actions/Report'; -import IOUPreview from '../../components/ReportActionItem/IOUPreview'; -import IOUTransactions from './IOUTransactions'; -import withLocalize, {withLocalizePropTypes} from '../../components/withLocalize'; -import compose from '../../libs/compose'; -import CONST from '../../CONST'; -import SettlementButton from '../../components/SettlementButton'; -import ROUTES from '../../ROUTES'; -import FixedFooter from '../../components/FixedFooter'; -import networkPropTypes from '../../components/networkPropTypes'; -import reportActionPropTypes from '../home/report/reportActionPropTypes'; -import FullPageNotFoundView from '../../components/BlockingViews/FullPageNotFoundView'; -import FullScreenLoadingIndicator from '../../components/FullscreenLoadingIndicator'; -import * as IOU from '../../libs/actions/IOU'; - -const propTypes = { - /** URL Route params */ - route: PropTypes.shape({ - /** Params from the URL path */ - params: PropTypes.shape({ - /** chatReportID passed via route: /iou/details/:chatReportID/:iouReportID */ - chatReportID: PropTypes.string, - - /** iouReportID passed via route: /iou/details/:chatReportID/:iouReportID */ - iouReportID: PropTypes.string, - }), - }).isRequired, - - /* Onyx Props */ - /** Holds data related to IOU view state, rather than the underlying IOU data. */ - iou: PropTypes.shape({ - /** Is the IOU Report currently being loaded? */ - loading: PropTypes.bool, - - /** Error message, empty represents no error */ - error: PropTypes.bool, - }), - - /** IOU Report data object */ - iouReport: PropTypes.shape({ - /** ID for the chatReport that this IOU is linked to */ - chatReportID: PropTypes.string, - - /** Manager is the person who currently owes money */ - managerEmail: PropTypes.string, - - /** Owner is the person who is owed money */ - ownerEmail: PropTypes.string, - - /** Does the iouReport have an outstanding IOU? */ - hasOutstandingIOU: PropTypes.bool, - }), - - /** Session info for the currently logged in user. */ - session: PropTypes.shape({ - /** Currently logged in user email */ - email: PropTypes.string, - }), - - /** Actions from the ChatReport */ - reportActions: PropTypes.shape(reportActionPropTypes), - - /** Information about the network */ - network: networkPropTypes.isRequired, - - /** chatReport associated with iouReport */ - chatReport: PropTypes.shape({ - /** Report ID associated with the transaction */ - reportID: PropTypes.string, - - /** The participants of this report */ - participants: PropTypes.arrayOf(PropTypes.string), - - /** Whether the chat report has an outstanding IOU */ - hasOutstandingIOU: PropTypes.bool.isRequired, - }), - - ...withLocalizePropTypes, -}; - -const defaultProps = { - iou: {}, - reportActions: {}, - iouReport: undefined, - session: { - email: null, - }, - chatReport: { - participants: [], - }, -}; - -class IOUDetailsModal extends Component { - componentDidMount() { - if (this.props.network.isOffline) { - return; - } - - this.fetchData(); - } - - componentDidUpdate(prevProps) { - if (!prevProps.network.isOffline || this.props.network.isOffline) { - return; - } - - this.fetchData(); - } - - fetchData() { - Report.openPaymentDetailsPage(this.props.route.params.chatReportID, this.props.route.params.iouReportID); - } - - // Finds if there is a reportAction pending for this IOU - findPendingAction() { - const reportActionWithPendingAction = _.find( - this.props.reportActions, - (reportAction) => - reportAction.originalMessage && Number(reportAction.originalMessage.IOUReportID) === Number(this.props.route.params.iouReportID) && !_.isEmpty(reportAction.pendingAction), - ); - return reportActionWithPendingAction ? reportActionWithPendingAction.pendingAction : undefined; - } - - render() { - const sessionEmail = lodashGet(this.props.session, 'email', null); - const pendingAction = this.findPendingAction(); - const iouReportStateNum = lodashGet(this.props.iouReport, 'stateNum'); - const hasOutstandingIOU = lodashGet(this.props.iouReport, 'hasOutstandingIOU'); - const hasFixedFooter = hasOutstandingIOU && this.props.iouReport.managerEmail === sessionEmail; - return ( - - {({safeAreaPaddingBottomStyle}) => ( - - - {this.props.iou.loading ? ( - - - - ) : ( - - - 1} - isIOUAction={false} - pendingAction={pendingAction} - /> - - - {hasOutstandingIOU && this.props.iouReport.managerEmail === sessionEmail && ( - - IOU.payMoneyRequest(paymentMethodType, this.props.chatReport, this.props.iouReport)} - shouldShowPaypal={Boolean(lodashGet(this.props, 'iouReport.submitterPayPalMeAddress'))} - currency={lodashGet(this.props, 'iouReport.currency')} - enablePaymentsRoute={ROUTES.IOU_DETAILS_ENABLE_PAYMENTS} - addBankAccountRoute={ROUTES.IOU_DETAILS_ADD_BANK_ACCOUNT} - addDebitCardRoute={ROUTES.IOU_DETAILS_ADD_DEBIT_CARD} - chatReportID={this.props.route.params.chatReportID} - policyID={this.props.iouReport.policyID} - /> - - )} - - )} - - )} - - ); - } -} - -IOUDetailsModal.propTypes = propTypes; -IOUDetailsModal.defaultProps = defaultProps; - -export default compose( - withLocalize, - withNetwork(), - withOnyx({ - iou: { - key: ONYXKEYS.IOU, - }, - chatReport: { - key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${route.params.chatReportID}`, - }, - iouReport: { - key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${route.params.iouReportID}`, - }, - session: { - key: ONYXKEYS.SESSION, - }, - reportActions: { - key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${route.params.chatReportID}`, - canEvict: false, - }, - }), -)(IOUDetailsModal); diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js index eafb4f17331f..40d718796fd1 100644 --- a/src/pages/iou/MoneyRequestModal.js +++ b/src/pages/iou/MoneyRequestModal.js @@ -292,6 +292,7 @@ const MoneyRequestModal = (props) => { ); const amountButtonText = isEditingAmountAfterConfirm ? props.translate('common.save') : props.translate('common.next'); const enableMaxHeight = DeviceCapabilities.canUseTouchScreen() && currentStep === Steps.MoneyRequestParticipants; + const bankAccountRoute = ReportUtils.getBankAccountRoute(props.report); return ( { canModifyParticipants={!_.isEmpty(reportID)} navigateToStep={navigateToStep} policyID={props.report.policyID} + bankAccountRoute={bankAccountRoute} /> )} diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js index c6cd7f13b183..0ab9aea75cf3 100644 --- a/src/pages/iou/steps/MoneyRequestConfirmPage.js +++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js @@ -31,6 +31,9 @@ const propTypes = { /** The policyID of the request */ policyID: PropTypes.string, + + /** Depending on expense report or personal IOU report, respective bank account route */ + bankAccountRoute: PropTypes.string.isRequired, }; const defaultProps = { @@ -50,6 +53,7 @@ const MoneyRequestConfirmPage = (props) => ( canModifyParticipants={props.canModifyParticipants} navigateToStep={props.navigateToStep} policyID={props.policyID} + bankAccountRoute={props.bankAccountRoute} /> );