content: import React from 'react';
  import propTypes from 'prop-types';
  import { Link } from 'react-router';
  import { FormattedMessage } from 'react-intl';
  
  // Import Style
  import styles from './PostListItem.css';
  
  function PostListItem(props) {
    return (
      <div className={styles['single-post']}>
        <h3 className={styles['post-title']}>
          <Link to={`/posts/${props.post.slug}-${props.post.cuid}`} >
            {props.post.title}
          </Link>
        </h3>
        <p className={styles['author-name']}><FormattedMessage id="by" /> {props.post.name}</p>
        <p className={styles['post-desc']}>{props.post.content}</p>
        <p className={styles['post-action']}><a href="#" onClick={props.onDelete}><FormattedMessage id="deletePost" /></a></p>
        <hr className={styles.divider} />
      </div>
    );
  }
  
  PostListItem.propTypes = {
    post: propTypes.shape({
      name: propTypes.string.isRequired,
      title: propTypes.string.isRequired,
      content: propTypes.string.isRequired,
      slug: propTypes.string.isRequired,
      cuid: propTypes.string.isRequired,
    }).isRequired,
    onDelete: propTypes.func.isRequired,
  };
  
  export default PostListItem;
  