import React from 'react';
import Button from '@material-ui/core/Button';
import Dialog from '@material-ui/core/Dialog';
import DialogActions from '@material-ui/core/DialogActions';
import DialogContent from '@material-ui/core/DialogContent';
import DialogContentText from '@material-ui/core/DialogContentText';
import DialogTitle from '@material-ui/core/DialogTitle';
import InfoIcon from '@material-ui/icons/Info';
import ListItem from '@material-ui/core/ListItem'
import ListItemIcon from '@material-ui/core/ListItemIcon'
import ListItemText from '@material-ui/core/ListItemText'

export default function AboutDialog() {
    const [open, setOpen] = React.useState(false)

    return (
        <div>
            <ListItem button key="Settings" onClick={()=>{setOpen(true)}}>
                <ListItemIcon>
                    <InfoIcon />
                </ListItemIcon>
                <ListItemText primary="About" />
            </ListItem>
            <Dialog open={open} onClose={()=>{setOpen(false)}} aria-labelledby="form-dialog-title" fullWidth={true} maxWidth={'lg'}>
                <DialogTitle id="form-dialog-title">About</DialogTitle>
                <DialogContent>
                    <DialogContent>
                        <DialogContentText id="alert-dialog-description">
                            <center><h2>Thanks to everyone who tested and helped.</h2></center><br/>
                            <h2>Special thanks:</h2>
                            <b>Anacrolix Matt Joiner</b> <a href={'https://github.com/anacrolix/'}>github.com/anacrolix</a><br/>
                            <b>tsynik nikk Никита</b> <a href={'https://github.com/tsynik'}>github.com/tsynik</a><br/>
                            <b>Tw1cker Руслан Пахнев</b> <a href={'https://github.com/Nemiroff'}>github.com/Nemiroff</a><br/>
                            <b>SpAwN_LMG</b><br/>
                        </DialogContentText>
                    </DialogContent>
                </DialogContent>
                <DialogActions>
                    <Button onClick={()=>{setOpen(false)}} color="primary" variant="outlined" autoFocus>
                        Close
                    </Button>
                </DialogActions>
            </Dialog>
        </div>
    )
}