import { Box, CircularProgress, Typography, useTheme } from "@mui/material";

interface Props {
    message?: string;
}

export default function LoadingScreen(props: Props) {
    const { message } = props;
    const theme = useTheme();

    return (
        <Box sx={{ width: "100%", height: "100%", justifyContent: "center", alignContent: "center", textAlign: "center" }}>
            <CircularProgress
                size={150}
                style={{ marginBottom: theme.spacing(4) }}
            />
            <br/>
            <Typography variant="h6">
                {message ? message : "Loading..."}
            </Typography>
        </Box>
    );
}