Skip to content

Commit

Permalink
Merge pull request #27784 from adhorodyski/16235-migrate-onfido-step
Browse files Browse the repository at this point in the history
Migrate OnfidoStep.js to a functional component
  • Loading branch information
robertjchen authored Sep 22, 2023
2 parents 887c7f8 + 4c5c73c commit 8372336
Showing 1 changed file with 58 additions and 55 deletions.
113 changes: 58 additions & 55 deletions src/pages/EnablePayments/OnfidoStep.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React from 'react';
import React, {useCallback} from 'react';
import {withOnyx} from 'react-native-onyx';
import Onfido from '../../components/Onfido';
import ONYXKEYS from '../../ONYXKEYS';
Expand All @@ -7,8 +7,7 @@ import Navigation from '../../libs/Navigation/Navigation';
import CONST from '../../CONST';
import HeaderWithBackButton from '../../components/HeaderWithBackButton';
import * as Wallet from '../../libs/actions/Wallet';
import withLocalize, {withLocalizePropTypes} from '../../components/withLocalize';
import compose from '../../libs/compose';
import useLocalize from '../../hooks/useLocalize';
import Growl from '../../libs/Growl';
import OnfidoPrivacy from './OnfidoPrivacy';
import walletOnfidoDataPropTypes from './walletOnfidoDataPropTypes';
Expand All @@ -18,8 +17,6 @@ import ROUTES from '../../ROUTES';
const propTypes = {
/** Stores various information used to build the UI and call any APIs */
walletOnfidoData: walletOnfidoDataPropTypes,

...withLocalizePropTypes,
};

const defaultProps = {
Expand All @@ -29,60 +26,66 @@ const defaultProps = {
},
};

class OnfidoStep extends React.Component {
/**
* @returns {boolean|*}
*/
canShowOnfido() {
return this.props.walletOnfidoData.hasAcceptedPrivacyPolicy && !this.props.walletOnfidoData.isLoading && !this.props.walletOnfidoData.error && this.props.walletOnfidoData.sdkToken;
}
function OnfidoStep({walletOnfidoData}) {
const {translate} = useLocalize();

const shouldShowOnfido = walletOnfidoData.hasAcceptedPrivacyPolicy && !walletOnfidoData.isLoading && !walletOnfidoData.error && walletOnfidoData.sdkToken;

const goBack = useCallback(() => {
Navigation.goBack(ROUTES.HOME);
}, []);

const goToPreviousStep = useCallback(() => {
Wallet.updateCurrentStep(CONST.WALLET.STEP.ADDITIONAL_DETAILS);
}, []);

const reportError = useCallback(() => {
Growl.error(translate('onfidoStep.genericError'), 10000);
}, [translate]);

render() {
return (
<>
<HeaderWithBackButton
title={this.props.translate('onfidoStep.verifyIdentity')}
onBackButtonPress={() => Wallet.updateCurrentStep(CONST.WALLET.STEP.ADDITIONAL_DETAILS)}
/>
<FullPageOfflineBlockingView>
{this.canShowOnfido() ? (
<Onfido
sdkToken={this.props.walletOnfidoData.sdkToken}
onError={() => {
Growl.error(this.props.translate('onfidoStep.genericError'), 10000);
}}
onUserExit={() => {
Navigation.goBack(ROUTES.HOME);
}}
onSuccess={(data) => {
BankAccounts.verifyIdentity({
onfidoData: JSON.stringify({
...data,
applicantID: this.props.walletOnfidoData.applicantID,
}),
});
}}
/>
) : (
<OnfidoPrivacy walletOnfidoData={this.props.walletOnfidoData} />
)}
</FullPageOfflineBlockingView>
</>
);
}
const verifyIdentity = useCallback(
(data) => {
BankAccounts.verifyIdentity({
onfidoData: JSON.stringify({
...data,
applicantID: walletOnfidoData.applicantID,
}),
});
},
[walletOnfidoData.applicantID],
);

return (
<>
<HeaderWithBackButton
title={translate('onfidoStep.verifyIdentity')}
onBackButtonPress={goToPreviousStep}
/>
<FullPageOfflineBlockingView>
{shouldShowOnfido ? (
<Onfido
sdkToken={walletOnfidoData.sdkToken}
onUserExit={goBack}
onError={reportError}
onSuccess={verifyIdentity}
/>
) : (
<OnfidoPrivacy walletOnfidoData={walletOnfidoData} />
)}
</FullPageOfflineBlockingView>
</>
);
}

OnfidoStep.propTypes = propTypes;
OnfidoStep.defaultProps = defaultProps;
OnfidoStep.displayName = 'OnfidoStep';

export default compose(
withLocalize,
withOnyx({
walletOnfidoData: {
key: ONYXKEYS.WALLET_ONFIDO,
export default withOnyx({
walletOnfidoData: {
key: ONYXKEYS.WALLET_ONFIDO,

// Let's get a new onfido token each time the user hits this flow (as it should only be once)
initWithStoredValues: false,
},
}),
)(OnfidoStep);
// Let's get a new onfido token each time the user hits this flow (as it should only be once)
initWithStoredValues: false,
},
})(OnfidoStep);

0 comments on commit 8372336

Please sign in to comment.