1import { makeStyles } from '@material-ui/core/styles';
 2import React from 'react';
 3
 4import Author from '../components/Author';
 5import Date from '../components/Date';
 6
 7import { SetTitleFragment } from './SetTitleFragment.generated';
 8
 9const useStyles = makeStyles(theme => ({
10  main: {
11    ...theme.typography.body1,
12    marginLeft: theme.spacing(1) + 40,
13  },
14  bold: {
15    fontWeight: 'bold',
16  },
17}));
18
19type Props = {
20  op: SetTitleFragment;
21};
22
23function SetTitle({ op }: Props) {
24  const classes = useStyles();
25  return (
26    <div className={classes.main}>
27      <Author author={op.author} className={classes.bold} />
28      <span> changed the title from </span>
29      <span className={classes.bold}>{op.was}</span>
30      <span> to </span>
31      <span className={classes.bold}>{op.title}</span>
32      <Date date={op.date} />
33    </div>
34  );
35}
36
37export default SetTitle;