flexor-web/src/components/post.tsx

import React, { FC } from 'react'
import { Link } from 'react-router-dom'
import moment from 'moment'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faClock } from '@fortawesome/free-solid-svg-icons'

import { Post } from 'src/types'

import User from 'src/components/user'

interface Props {
    post: Post
}

const PostComponent: FC<Props> = ({ post }) => (
    <div className="post">
        <p className="is-size-5">{post.text}</p>

        <div className="post-info">
            <div>
                <User user={post.user} />
            </div>

            <div>
                Awards
            </div>

            <div>
                <span className="icon">
                    <FontAwesomeIcon icon={faClock} />
                </span>
                <Link to={`/p/${post.id}`} className="has-text-primary">
                    {moment(post.created).format('MMMM Do, h:mm A')}
                </Link>
            </div>
        </div>
    </div>
)

export default PostComponent