all files / components/CommentBox/ CommentBox.js

100% Statements 54/54
100% Branches 31/31
100% Functions 15/15
100% Lines 10/10
3 statements, 1 function, 13 branches Ignored     
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56                                                                                              
import React from 'react'
import InlineCss from 'react-inline-css'
import Transmit from 'react-transmit'
 
import dataService from 'apis/dataService'
 
const fetchInitialData = (id) => {
  return dataService.browse(['posts', id, 'comments'], {}).catch(error => { throw error })
}
 
/**
 * Main React application entry-point for both the server and client.
 */
class CommentBox extends React.Component {
  componentWillMount () {
    // run on Server & Client.
  }
  componentDidUpdate (prevProps, prevState) {
    // run on Client only.
  }
 
  render () {
    // run on Server & Client.
    const { data } = this.props
 
    return (
      <InlineCss stylesheet={CommentBox.css()} namespace='CommentBox'>
        <p>
          Comment Box - Post 1:
        </p>
        <p>
          Total Comments: {data.length}
        </p>
      </InlineCss>
    )
  }
 
  /**
   * <InlineCss> component allows you to write a CSS stylesheet for your component. Target
   * your component with `&` and its children with `& selectors`. Be specific.
   */
  static css () {
    return (`
			& {
				font-family: sans-serif;
				padding: 5px;
				margin: 5px auto;
				background: #eee;
			}
		`)
  }
}
CommentBox.fetchInitialData = fetchInitialData
 
export default CommentBox