import {createStyles, Theme, withStyles, WithStyles, WithTheme} from "@material-ui/core";
import React from "react";
import MuiAlert from '@material-ui/lab/Alert';
import Snackbar from "@material-ui/core/Snackbar";

const styles = (theme: Theme) =>
    createStyles({});


type Props = {
    message: string
} & WithStyles<typeof styles> & WithTheme

type State = {
    isOpen: boolean
}

class SnackbarAlert extends React.Component<Props, State> {
    readonly state: State = {
        isOpen: true
    };
    private handleClose = (event?: React.SyntheticEvent, reason?: string) => {
        if (reason === 'clickaway') {
            return;
        }
        this.setState({isOpen: false})
    };

    render() {
        return <Snackbar open={this.state.isOpen} autoHideDuration={10000} onClose={this.handleClose}>
            <MuiAlert elevation={6} variant="filled" onClose={this.handleClose} severity="warning">
                {this.props.message}
            </MuiAlert>
        </Snackbar>
    }
}

export default withStyles(styles, {withTheme: true})(SnackbarAlert);
