Timeline.js

 1import { withStyles } from '@material-ui/core/styles'
 2import React from 'react'
 3import LabelChange from './LabelChange'
 4import Message from './Message'
 5import SetTitle from './SetTitle'
 6
 7const styles = theme => ({
 8  main: {
 9    '& > *:not(:last-child)': {
10      marginBottom: 10
11    }
12  }
13})
14
15class Timeline extends React.Component {
16
17  props: {
18    ops: Array,
19    fetchMore: (any) => any,
20    classes: any,
21  }
22
23  render() {
24    const {ops, classes} = this.props
25
26    return (
27      <div className={classes.main}>
28        { ops.map((op, index) => {
29          switch (op.__typename) {
30            case 'CreateOperation':
31              return <Message key={index} op={op}/>
32            case 'AddCommentOperation':
33              return <Message key={index} op={op}/>
34            case 'LabelChangeOperation':
35              return <LabelChange key={index} op={op}/>
36            case 'SetTitleOperation':
37              return <SetTitle key={index} op={op}/>
38
39            default:
40              console.log('unsupported operation type ' + op.__typename)
41              return null
42          }
43        })}
44      </div>
45    )
46  }
47}
48
49export default withStyles(styles)(Timeline)