1import { Typography } from '@mui/material';
 2import makeStyles from '@mui/styles/makeStyles';
 3
 4import { Status } from '../../gqlTypes';
 5import Author from 'src/components/Author';
 6import Date from 'src/components/Date';
 7
 8import { SetStatusFragment } from './SetStatusFragment.generated';
 9
10const useStyles = makeStyles((theme) => ({
11  main: {
12    color: theme.palette.text.secondary,
13    marginLeft: theme.spacing(1) + 40,
14  },
15  author: {
16    fontWeight: 'bold',
17    color: theme.palette.text.secondary,
18  },
19}));
20
21type Props = {
22  op: SetStatusFragment;
23};
24
25function SetStatus({ op }: Props) {
26  const classes = useStyles();
27  const status = { [Status.Open]: 'reopened', [Status.Closed]: 'closed' }[
28    op.status
29  ];
30
31  return (
32    <Typography className={classes.main}>
33      <Author author={op.author} className={classes.author} />
34      <span> {status} this </span>
35      <Date date={op.date} />
36    </Typography>
37  );
38}
39
40export default SetStatus;