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,