import React, { useEffect, useState, useContext, } from 'react';
import { useWindowDimensions } from 'react-native';
import { ConfigServiceContext } from '../utils/ConfigProvider';
import { Stack, Spinner, Text, Box, } from '../themes/components';
import { OrientationContext } from '../services/OrientationContext';
function LoadingScreen(props) {
    const { text, inStage, showTextAfter, childComponents, errorText, loading, } = props;
    const { sessionConfig } = useContext(ConfigServiceContext);
    const windowDimensions = useWindowDimensions();
    const { orientation } = React.useContext(OrientationContext);
    // eslint-disable-next-line prefer-const
    let { height, width } = sessionConfig.theme.dimensions || windowDimensions;
    // Fixed height header and control bars
    height -= inStage && orientation !== 'LANDSCAPE' ? 128 : 0;
    const [showText, setShowText] = useState(showTextAfter === 0);
    useEffect(() => {
        let timeout;
        if (showTextAfter) {
            timeout = setTimeout(() => setShowText(true), showTextAfter * 1000);
        }
        return () => clearTimeout(timeout);
    }, []);
    return (<Box height={height} width={width} bg="secondary.800" justify="center" align="center">
			<Stack>
				{!errorText && loading && <Spinner />}
				{!!showText && (!!errorText || !!text) && <Text ml={5} color="textPrimary.100">{errorText || text}</Text>}
			</Stack>
			{childComponents && childComponents}
		</Box>);
}
LoadingScreen.defaultProps = {
    text: '',
    inStage: false,
    showTextAfter: 0,
    loading: true,
    childComponents: null,
    errorText: null,
};
export default LoadingScreen;
//# sourceMappingURL=LoadingScreen.js.map