text: import React, { Component, PropTypes } from 'react'
  import { connect } from 'react-redux'
  import { Link } from 'react-router'
  
  import { fetchPost, deletePost } from '../actions/index'
  
  class ShowPost extends Component {
    static contextTypes = {
      router: PropTypes.object
    }
  
    componentWillMount() {
      this.props.fetchPost(this.props.params.id)
    }
  
    deletePostOnClick() {
      this.props.deletePost(this.props.params.id)
        .then(() => {
          this.context.router.push('/')
        })
    }
  
    render() {
      const { post } = this.props
  
      if (!post) {
        return <div>Loading...</div>
      }
      return (
        <div>
          <Link to='/'>Back to posts</Link>
          <button
            className="btn btn-danger pull-xs-right"
            onClick={this.deletePostOnClick.bind(this)}>
            Delete Post
          </button>
          <h3>{post.title}</h3>
          <h6>Categories: {post.categories}</h6>
          <p>{post.content}</p>
        </div>
      )
    }
  }
  
  function mapStateToProps(state) {
    return { post: state.posts.post }
  }
  
  export default connect(mapStateToProps, { fetchPost, deletePost })(ShowPost)
  