website/website/scripts/blog_post.tsx

36 lines
No EOL
1.2 KiB
TypeScript

import { useEffect, useState } from "preact/hooks";
import type { Metadata } from "./blog";
import { Giscus } from "./giscus";
export function BlogPost({ pageOpen }: { pageOpen: [Metadata | undefined, (z: Metadata | undefined) => void] }) {
if(!pageOpen[0]) return <h1>How did you get to here..?</h1>;
const blogPost = useState<string | undefined>();
history.replaceState({}, "", location.pathname + "?md=" + pageOpen[0].filename);
useEffect(() => {
(async () => {
const blogpost = await (await fetch("/blogs/" + pageOpen[0]!.filename + ".html")).text();;
blogPost[1](blogpost);
})();
}, [])
return <>
<h1>blog & comments</h1>
<a style="font-size:xx-large;" onClick={() => {
history.replaceState({}, "", location.pathname + "?md=");
pageOpen[1](undefined);
}}>return back?</a>
<div>Scroll to bottom for comments </div>
{
(() => {
if (!blogPost[0]) return <h1>Loading...</h1>
else return <div dangerouslySetInnerHTML={{ __html: blogPost[0] }}></div>
})()
}
<Giscus searchTerm={pageOpen[0].filename}></Giscus>
</>
}