diff --git a/src/libs/actions/BankAccounts.js b/src/libs/actions/BankAccounts.js index ec75b2fdb0f7..746106e0263e 100644 --- a/src/libs/actions/BankAccounts.js +++ b/src/libs/actions/BankAccounts.js @@ -293,19 +293,6 @@ function connectBankAccountManually(bankAccountID, accountNumber, routingNumber, }, getVBBADataForOnyx()); } -/** - * Verify the user's identity via Onfido - * - * @param {Number} bankAccountID - * @param {Object} onfidoData - */ -function verifyIdentityForBankAccount(bankAccountID, onfidoData) { - API.write('VerifyIdentityForBankAccount', { - bankAccountID, - onfidoData: JSON.stringify(onfidoData), - }, getVBBADataForOnyx()); -} - export { addPersonalBankAccount, connectBankAccountManually, @@ -315,7 +302,6 @@ export { clearOnfidoToken, updatePersonalInformationForBankAccount, validateBankAccount, - verifyIdentityForBankAccount, updateCompanyInformationForBankAccount, connectBankAccountWithPlaid, updatePlaidData, diff --git a/src/pages/ReimbursementAccount/RequestorOnfidoStep.js b/src/pages/ReimbursementAccount/RequestorOnfidoStep.js deleted file mode 100644 index 82b17d641d35..000000000000 --- a/src/pages/ReimbursementAccount/RequestorOnfidoStep.js +++ /dev/null @@ -1,82 +0,0 @@ -import React from 'react'; -import {ScrollView} from 'react-native'; -import {withOnyx} from 'react-native-onyx'; -import PropTypes from 'prop-types'; -import styles from '../../styles/styles'; -import withLocalize, {withLocalizePropTypes} from '../../components/withLocalize'; -import * as BankAccounts from '../../libs/actions/BankAccounts'; -import Onfido from '../../components/Onfido'; -import compose from '../../libs/compose'; -import ONYXKEYS from '../../ONYXKEYS'; -import * as ReimbursementAccountUtils from '../../libs/ReimbursementAccountUtils'; -import Growl from '../../libs/Growl'; -import reimbursementAccountPropTypes from './reimbursementAccountPropTypes'; -import CONST from '../../CONST'; - -const propTypes = { - /** Bank account currently in setup */ - /* eslint-disable-next-line react/no-unused-prop-types */ - reimbursementAccount: reimbursementAccountPropTypes.isRequired, - onfidoToken: PropTypes.string, - onComplete: PropTypes.func.isRequired, - ...withLocalizePropTypes, -}; - -const defaultProps = { - onfidoToken: '', -}; - -class RequestorOnfidoStep extends React.Component { - constructor(props) { - super(props); - this.submit = this.submit.bind(this); - } - - submit(onfidoData) { - BankAccounts.verifyIdentityForBankAccount( - ReimbursementAccountUtils.getDefaultStateForField(this.props, 'bankAccountID', 0), - onfidoData, - ); - this.props.onComplete(); - } - - render() { - return ( - - { - // We're taking the user back to the company step. They will need to come back to the requestor step to make the Onfido flow appear again. - BankAccounts.goToWithdrawalAccountSetupStep(CONST.BANK_ACCOUNT.STEP.COMPANY); - }} - onError={() => { - // In case of any unexpected error we log it to the server, show a growl, and return the user back to the company step so they can try again. - Growl.error(this.props.translate('onfidoStep.genericError'), 10000); - BankAccounts.goToWithdrawalAccountSetupStep(CONST.BANK_ACCOUNT.STEP.COMPANY); - }} - onSuccess={(onfidoData) => { - this.submit(onfidoData); - }} - /> - - ); - } -} - -RequestorOnfidoStep.propTypes = propTypes; -RequestorOnfidoStep.defaultProps = defaultProps; - -export default compose( - withLocalize, - withOnyx({ - reimbursementAccount: { - key: ONYXKEYS.REIMBURSEMENT_ACCOUNT, - }, - onfidoToken: { - key: ONYXKEYS.ONFIDO_TOKEN, - }, - reimbursementAccountDraft: { - key: ONYXKEYS.REIMBURSEMENT_ACCOUNT_DRAFT, - }, - }), -)(RequestorOnfidoStep); diff --git a/src/pages/ReimbursementAccount/RequestorStep.js b/src/pages/ReimbursementAccount/RequestorStep.js index bba0dba6b06d..6be190673464 100644 --- a/src/pages/ReimbursementAccount/RequestorStep.js +++ b/src/pages/ReimbursementAccount/RequestorStep.js @@ -1,6 +1,6 @@ import React from 'react'; import lodashGet from 'lodash/get'; -import {View} from 'react-native'; +import {ScrollView, View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import moment from 'moment'; @@ -16,13 +16,14 @@ import Text from '../../components/Text'; import * as BankAccounts from '../../libs/actions/BankAccounts'; import IdentityForm from './IdentityForm'; import * as ValidationUtils from '../../libs/ValidationUtils'; +import Onfido from '../../components/Onfido'; import compose from '../../libs/compose'; import ONYXKEYS from '../../ONYXKEYS'; import * as ReimbursementAccountUtils from '../../libs/ReimbursementAccountUtils'; +import Growl from '../../libs/Growl'; import reimbursementAccountPropTypes from './reimbursementAccountPropTypes'; import ReimbursementAccountForm from './ReimbursementAccountForm'; import * as Link from '../../libs/actions/Link'; -import RequestorOnfidoStep from './RequestorOnfidoStep'; const propTypes = { /** Bank account currently in setup */ @@ -41,7 +42,6 @@ class RequestorStep extends React.Component { this.submit = this.submit.bind(this); this.clearErrorsAndSetValues = this.clearErrorsAndSetValues.bind(this); - this.setOnfidoAsComplete = this.setOnfidoAsComplete.bind(this); this.state = { firstName: ReimbursementAccountUtils.getDefaultStateForField(props, 'firstName'), @@ -53,6 +53,7 @@ class RequestorStep extends React.Component { dob: ReimbursementAccountUtils.getDefaultStateForField(props, 'dob'), ssnLast4: ReimbursementAccountUtils.getDefaultStateForField(props, 'ssnLast4'), isControllingOfficer: ReimbursementAccountUtils.getDefaultStateForField(props, 'isControllingOfficer', false), + onfidoData: lodashGet(props, ['reimbursementAccount', 'achData', 'onfidoData'], ''), isOnfidoSetupComplete: lodashGet(props, ['achData', 'isOnfidoSetupComplete'], false), }; @@ -73,13 +74,6 @@ class RequestorStep extends React.Component { this.getErrors = () => ReimbursementAccountUtils.getErrors(this.props); } - /** - * Update state to indicate that the user has completed the Onfido verification process - */ - setOnfidoAsComplete() { - this.setState({isOnfidoSetupComplete: true}); - } - /** * Clear the errors associated to keys in values if found and store the new values in the state. * @@ -153,6 +147,20 @@ class RequestorStep extends React.Component { BankAccounts.updatePersonalInformationForBankAccount(payload); } + submitOnfidoVerification() { + if (!this.validate()) { + return; + } + + const payload = { + bankAccountID: ReimbursementAccountUtils.getDefaultStateForField(this.props, 'bankAccountID', 0), + ...this.state, + dob: moment(this.state.dob).format(CONST.DATE.MOMENT_FORMAT_STRING), + }; + + BankAccounts.setupWithdrawalAccount(payload); + } + render() { const achData = this.props.reimbursementAccount.achData; const shouldShowOnfido = achData.useOnfido && this.props.onfidoToken && !this.state.isOnfidoSetupComplete; @@ -175,9 +183,26 @@ class RequestorStep extends React.Component { onCloseButtonPress={Navigation.dismissModal} /> {shouldShowOnfido ? ( - + + { + // We're taking the user back to the company step. They will need to come back to the requestor step to make the Onfido flow appear again. + BankAccounts.goToWithdrawalAccountSetupStep(CONST.BANK_ACCOUNT.STEP.COMPANY); + }} + onError={() => { + // In case of any unexpected error we log it to the server, show a growl, and return the user back to the company step so they can try again. + Growl.error(this.props.translate('onfidoStep.genericError'), 10000); + BankAccounts.goToWithdrawalAccountSetupStep(CONST.BANK_ACCOUNT.STEP.COMPANY); + }} + onSuccess={(onfidoData) => { + this.setState({ + onfidoData, + isOnfidoSetupComplete: true, + }, this.submitOnfidoVerification); + }} + /> + ) : (