Bug.js

 1import { withStyles } from '@material-ui/core/styles'
 2import gql from 'graphql-tag'
 3import React from 'react'
 4
 5import Comment from './Comment'
 6
 7const styles = theme => ({
 8  main: {
 9    maxWidth: 600,
10    margin: 'auto',
11    marginTop: theme.spacing.unit * 4
12  }
13})
14
15const Bug = ({bug, classes}) => (
16  <main className={classes.main}>
17
18    {bug.comments.edges.map(({cursor, node}) => (
19      <Comment key={cursor} comment={node}/>
20    ))}
21  </main>
22)
23
24Bug.fragment = gql`
25  fragment Bug on Bug {
26    comments(first: 10) {
27      edges {
28        cursor
29        node {
30          ...Comment
31        }
32      }
33    }
34  }
35  
36  ${Comment.fragment}
37`
38
39export default withStyles(styles)(Bug)