38 lines
973 B
TypeScript
38 lines
973 B
TypeScript
import { format } from "date-fns";
|
|
|
|
const getReadingTime = (body: string | undefined) => {
|
|
const words = (body ?? "")
|
|
.replace(/```[\s\S]*?```/g, " ")
|
|
.replace(/<[^>]+>/g, " ")
|
|
.match(/\b[\w'-]+\b/g);
|
|
|
|
return Math.max(1, Math.ceil((words?.length ?? 0) / 220));
|
|
};
|
|
|
|
const BlogPost = ({
|
|
post,
|
|
children,
|
|
}: {
|
|
post: any;
|
|
children: React.ReactNode;
|
|
}) => {
|
|
const { title, pubDate } = post.data;
|
|
const readingTime = getReadingTime(post.body);
|
|
|
|
return (
|
|
<section className="container px-6 py-2 md:py-6">
|
|
<article className="poetry-post mx-auto">
|
|
<h1 className="poetry-post-title">{title}</h1>
|
|
<div className="poetry-post-meta">
|
|
<time dateTime={pubDate.toISOString()}>
|
|
{format(pubDate, "MMMM d, yyyy")}
|
|
</time>
|
|
<span>{readingTime} min read</span>
|
|
</div>
|
|
<div className="poetry-post-body">{children}</div>
|
|
</article>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { BlogPost };
|