/* eslint-disable */
import React, { Component } from 'react';
import { StyleSheet, View } from 'react-native';
import {
	Text,
	color,
} from 'nixplay-ui-kit';

const styles = StyleSheet.create({
	text: { justifyContent: 'center', alignItems: 'center', textAlign: 'center' },
	container: { flex: 1, alignItems: 'center', justifyContent: 'center' },
});

class ErrorBoundary extends Component {
	constructor(props) {
		super(props);
		this.state = { hasError: false };
	}

	static getDerivedStateFromError(error) {
		return { hasError: true };
	}

	render() {
		if (!__DEV__) {
			if (this.state.hasError) {
				// You can render any custom fallback UI
				return (
					<View style={styles.container}>
						<Text textStyle="title" color={color.textGrey} style={styles.text}>Oops, Something went wrong.</Text>
					</View>
				);
			}
		}
		return this.props.children;
	}
}

export default ErrorBoundary;

/* eslint-enable */
