import { useState, useContext } from "react";
import StoreContext from "../ctx/StoreContext.jsx";
import JobContext from "../ctx/JobContext.jsx";

import SpeedDial from '@mui/material/SpeedDial';
import SpeedDialAction from '@mui/material/SpeedDialAction';
import SpeedDialIcon from '@mui/material/SpeedDialIcon';

import Button from '@mui/material/Button';
import Dialog from '@mui/material/Dialog';
import DialogActions from '@mui/material/DialogActions';
import DialogContent from '@mui/material/DialogContent';
import DialogContentText from '@mui/material/DialogContentText';
import DialogTitle from '@mui/material/DialogTitle';

import ReplayIcon from '@mui/icons-material/Replay';

export default function Failing() {
  const {
    state: jobState,
    retryAll
  } = useContext(JobContext);

  const { state: store, updateStore } = useContext(StoreContext);

  const [retryAllOpen, setRetryAllOpen] = useState(false);
  const retryAllClick = () => setRetryAllOpen(!retryAllOpen);
  const handleClose = (confirmed) => ()=> {
    retryAllClick();
    if(!confirmed) return;
    retryAll(store.failing);            
    }
  
  return (
    <div className="failing">


      <Dialog
        open={retryAllOpen}
        onClose={handleClose()}
        sx={{ '& .MuiDialog-paper': { width: '80%', maxHeight: 435 } }}
      maxWidth="xs"
      >
        <DialogTitle>
          Retry all failing tests?
        </DialogTitle>
        <DialogContent>
          <DialogContentText>
            This will create x jobs and run y tests
          </DialogContentText>
        </DialogContent>
        <DialogActions>
          <Button onClick={handleClose()}>Cancel</Button>
          <Button onClick={handleClose(true)} autoFocus>
            Yes
          </Button>
        </DialogActions>
      </Dialog>
      
       <SpeedDial
        ariaLabel="Retry All"
        sx={{ position: 'absolute', bottom: 16, right: 16 }}
        icon={<ReplayIcon />}
        onClick={retryAllClick}
       open={false}
      />
        
    </div>
  );
}