42 lines
961 B
JavaScript
42 lines
961 B
JavaScript
import React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import parse from 'html-react-parser';
|
|
|
|
/**
|
|
* Displays a list of blog posts with the title and a short excerp from the content.
|
|
* @param {object} props
|
|
* {
|
|
* posts: {
|
|
* title: <The title of the blog post>
|
|
* excerpt: <A short excerpt from the post content>
|
|
* }
|
|
* }
|
|
* @returns
|
|
*/
|
|
const PostList = ({ posts }) => {
|
|
return (
|
|
<>
|
|
<h1 className="text-3xl font-semibold text-primary my-6 inline-block">
|
|
{posts.length} posts found
|
|
</h1>
|
|
{posts.map((post, index) => (
|
|
<div key={index}>
|
|
<a
|
|
href={`/blog/${post.slug}`}
|
|
className="text-2xl font-semibold text-primary my-6 inline-block"
|
|
>
|
|
{parse(post.title)}
|
|
</a>
|
|
<p>{parse(post.excerpt)}</p>
|
|
</div>
|
|
))}
|
|
</>
|
|
);
|
|
};
|
|
|
|
PostList.propTypes = {
|
|
posts: PropTypes.object.isRequired
|
|
}
|
|
|
|
export default PostList;
|