42 lines
1.0 KiB
JavaScript
42 lines
1.0 KiB
JavaScript
import React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import parse from 'html-react-parser';
|
|
|
|
/**
|
|
* Displays a blog post page
|
|
* @param {object} props
|
|
* post = {
|
|
* title: <The title of the blog post>
|
|
* content: <The body of the blog post. Can be plain text or html>
|
|
* createdAt: <The utc date when the post was last modified>.
|
|
* featuredImage: <Url/relative url to post cover image>
|
|
* }
|
|
* @returns
|
|
*/
|
|
const Post = ({ post }) => {
|
|
const { title, content, createdAt, featuredImage } = post;
|
|
|
|
return (
|
|
<>
|
|
<h1 className="text-3xl font-semibold text-primary my-6 inline-block">
|
|
{title}
|
|
</h1>
|
|
<p className="mb-6">Posted: {createdAt}</p>
|
|
<img src={featuredImage} className="mb-6" alt="featured_img" />
|
|
<div>{parse(content)}</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
|
|
Post.propTypes = {
|
|
page: PropTypes.shape({
|
|
title: PropTypes.string.isRequired,
|
|
content: PropTypes.string.isRequired,
|
|
createdAt: PropTypes.number,
|
|
featuredImage: PropTypes.string,
|
|
})
|
|
}
|
|
|
|
export default Post;
|