1import { Link } from 'react-router-dom';
 2
 3import Button from '@material-ui/core/Button';
 4import { makeStyles } from '@material-ui/core/styles';
 5import ArrowBackIcon from '@material-ui/icons/ArrowBack';
 6
 7const useStyles = makeStyles((theme) => ({
 8  backButton: {
 9    position: 'sticky',
10    top: '80px',
11    backgroundColor: theme.palette.primary.dark,
12    color: theme.palette.primary.contrastText,
13    '&:hover': {
14      backgroundColor: theme.palette.primary.main,
15      color: theme.palette.primary.contrastText,
16    },
17  },
18}));
19
20function BackToListButton() {
21  const classes = useStyles();
22
23  return (
24    <Button
25      variant="contained"
26      className={classes.backButton}
27      aria-label="back to issue list"
28      component={Link}
29      to="/"
30    >
31      <ArrowBackIcon />
32      Back to List
33    </Button>
34  );
35}
36
37export default BackToListButton;