diff --git a/src/components/VBALoadingIndicator.js b/src/components/VBALoadingIndicator.js new file mode 100644 index 000000000000..a53c83e38e3f --- /dev/null +++ b/src/components/VBALoadingIndicator.js @@ -0,0 +1,35 @@ +import React from 'react'; +import {Image, StyleSheet, View} from 'react-native'; +import styles from '../styles/styles'; +import CONST from '../CONST'; +import withLocalize, {withLocalizePropTypes} from './withLocalize'; +import Text from './Text'; + +const propTypes = { + ...withLocalizePropTypes, +}; + +const VBALoadingIndicator = ({translate}) => ( + + + + + + {translate('vbaLoadingAnimation.oneMoment')} + + + {translate('vbaLoadingAnimation.explanationLine')} + + + + +); + +VBALoadingIndicator.propTypes = propTypes; + +export default withLocalize(VBALoadingIndicator); diff --git a/src/languages/en.js b/src/languages/en.js index a2d9379d2a96..7eee77d0611b 100755 --- a/src/languages/en.js +++ b/src/languages/en.js @@ -546,6 +546,10 @@ export default { certify: 'Must certify information is true and accurate', }, }, + vbaLoadingAnimation: { + oneMoment: 'One moment...', + explanationLine: 'We’re taking a look at your information. You will be able to continue with next steps shortly.', + }, session: { offlineMessageRetry: 'Looks like you\'re offline. Please check your connection and try again.', offlineMessage: 'Looks like you\'re offline.', diff --git a/src/languages/es.js b/src/languages/es.js index c93e0a4103e9..212351458bf8 100644 --- a/src/languages/es.js +++ b/src/languages/es.js @@ -548,6 +548,10 @@ export default { certify: 'Debe certificar que la información es verdadera y precisa', }, }, + vbaLoadingAnimation: { + oneMoment: 'Un momento...', + explanationLine: 'Estamos verificando tu información y podrás continuar con los siguientes pasos en unos momentos.', + }, session: { offlineMessageRetry: 'Parece que estás desconectado. Por favor chequea tu conexión e inténtalo otra vez', offlineMessage: 'Parece que estás desconectado.', diff --git a/src/pages/ReimbursementAccount/ReimbursementAccountPage.js b/src/pages/ReimbursementAccount/ReimbursementAccountPage.js index 05c93882eb35..0a964289f5f4 100644 --- a/src/pages/ReimbursementAccount/ReimbursementAccountPage.js +++ b/src/pages/ReimbursementAccount/ReimbursementAccountPage.js @@ -8,7 +8,7 @@ import PropTypes from 'prop-types'; import ScreenWrapper from '../../components/ScreenWrapper'; import {fetchFreePlanVerifiedBankAccount} from '../../libs/actions/BankAccounts'; import ONYXKEYS from '../../ONYXKEYS'; -import FullScreenLoadingIndicator from '../../components/FullscreenLoadingIndicator'; +import VBALoadingIndicator from '../../components/VBALoadingIndicator'; import Permissions from '../../libs/Permissions'; import Navigation from '../../libs/Navigation/Navigation'; import CONST from '../../CONST'; @@ -156,7 +156,7 @@ class ReimbursementAccountPage extends React.Component { } if (this.props.reimbursementAccount.loading) { - return ; + return ; } let errorComponent; diff --git a/src/styles/styles.js b/src/styles/styles.js index 31d8103e433f..1983a2b7b3fd 100644 --- a/src/styles/styles.js +++ b/src/styles/styles.js @@ -284,6 +284,11 @@ const styles = { width: variables.componentSizeNormal, }, + loadingVBAAnimation: { + width: 160, + height: 160, + }, + picker: { inputIOS: { fontFamily: fontFamily.GTA,