aaronjy-me/src/components/Article/Article.jsx
2025-05-04 15:22:06 +01:00

40 lines
1 KiB
JavaScript

import { formatDate } from "@/lib/helpers";
import { NextSeo } from "next-seo";
import Link from "next/link";
import React, { useEffect } from "react";
import "highlight.js/styles/atom-one-dark.css";
import hljs from "highlight.js";
function Article({ title, excerpt, datePublished, tags, html }) {
useEffect(() => {
hljs.highlightAll();
}, [html]);
return (
<>
<h1>{title}</h1>
<article>
<NextSeo
title={title}
description={excerpt}
openGraph={{
title,
description: excerpt,
type: "article",
article: {
publishedTime: datePublished ?? null,
},
}}
/>
<div>
<Link href="./">Back...</Link>
{datePublished && <p>{formatDate(datePublished)}</p>}
<div data-test="content" dangerouslySetInnerHTML={{ __html: html }} />
{tags && <p>Tags: {tags.join(", ")}</p>}
</div>
</article>
</>
);
}
export default Article;