import React from 'react';
import {
View, Text, StyleSheet, ActivityIndicator
} from 'react-native';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import I18n from '../i18n';
import StatusBar from '../containers/StatusBar';
import { withTheme } from '../theme';
import { themes } from '../constants/colors';
import sharedStyles from './Styles';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center'
},
text: {
fontSize: 16,
paddingTop: 10,
...sharedStyles.textRegular,
...sharedStyles.textAlignCenter
}
});
const AuthLoadingView = React.memo(({ theme, text }) => (
<View style={[styles.container, { backgroundColor: themes[theme].backgroundColor }]}>
<StatusBar />
{text && (
<>
<ActivityIndicator color={themes[theme].auxiliaryText} size='large' />
<Text style={[styles.text, { color: themes[theme].bodyText }]}>{`${ text }\n${ I18n.t('Please_wait') }`}</Text>
</>
)}
</View>
));
const mapStateToProps = state => ({
text: state.app.text
AuthLoadingView.propTypes = {
theme: PropTypes.string,
text: PropTypes.string
};
export default connect(mapStateToProps)(withTheme(AuthLoadingView));