Display custom error view on webview error

This commit is contained in:
Arnaud Vergnet 2020-04-02 13:27:25 +02:00
parent 5e35086a9c
commit cb98e1c546
2 changed files with 13 additions and 2 deletions

View file

@ -32,7 +32,10 @@ class NetworkErrorComponent extends React.PureComponent<Props, State> {
render() {
return (
<View style={styles.outer}>
<View style={{
...styles.outer,
backgroundColor: this.colors.background
}}>
<View style={styles.inner}>
<View style={styles.iconContainer}>
<MaterialCommunityIcons
@ -62,7 +65,7 @@ class NetworkErrorComponent extends React.PureComponent<Props, State> {
const styles = StyleSheet.create({
outer: {
flex: 1,
height: '100%',
},
inner: {
marginTop: 'auto',

View file

@ -5,6 +5,8 @@ import WebView from "react-native-webview";
import {withTheme} from 'react-native-paper';
import HeaderButton from "../Custom/HeaderButton";
import BasicLoadingScreen from "../Custom/BasicLoadingScreen";
import NetworkErrorComponent from "../Custom/NetworkErrorComponent";
import i18n from "i18n-js";
type Props = {
navigation: Object,
@ -104,6 +106,12 @@ class WebViewScreen extends React.PureComponent<Props> {
injectedJavaScript={this.props.data[0]['customJS']}
javaScriptEnabled={true}
renderLoading={this.getRenderLoading}
renderError={() => <NetworkErrorComponent
{...this.props}
onRefresh={this.onRefreshClicked}
message={i18n.t("loginScreen.errors.connection")}
icon={'access-point-network-off'}
/>}
/>
);
}