src/app/page.tsx

@@ -4,10 +4,15 @@
  * @author Naomi Carrigan
  */
 
+import type { JSX } from "react";
 import { Rule } from "@/components/rule";
 import { getSortedPostsData } from "@/lib/posts";
 
-export default function Home() {
+/**
+ * Renders the home page.
+ * @returns JSX component.
+ */
+const Home = (): JSX.Element => {
   const posts = getSortedPostsData();
   return (
     <main>
@@ -17,10 +22,12 @@ export default function Home() {
         return <div key={post.slug}>
           <Rule />
           <h2><a className="underline" href={`/post/${post.slug}`}>{post.data.title}</a></h2>
-            <p className="italic text-center">{post.data.date.toLocaleDateString("en-GB",{ year: "numeric", month: "long", day: "numeric"})}</p>
+          <p className="italic text-center">{post.data.date.toLocaleDateString("en-GB", { day: "numeric", month: "long", year: "numeric" })}</p>
           <p>{post.data.summary}</p>
         </div>;
       })}
     </main>
   );
-}
+};
+
+export default Home;

src/app/post/[slug]/page.tsx

@@ -1,23 +1,38 @@
-import { Rule } from "@/components/rule";
-import { getPostData } from "@/lib/posts";
+/**
+ * @copyright nhcarrigan
+ * @license Naomi's Public License
+ * @author Naomi Carrigan
+ */
+
 import Markdown from "react-markdown";
 import remarkGfm from "remark-gfm";
+import type { JSX } from "react";
+import { Rule } from "@/components/rule";
+import { getPostData } from "@/lib/posts";
 
-export default async function Page({
-    params
+/**
+ * Renders a blog post.
+ * @param props - The properties of the page.
+ * @param props.params - The path parameters.
+ * @returns The JSX component.
+ */
+const Page = async({
+  params,
 }: {
-    params: Promise<{slug: string}>
-}) {
+  readonly params: Promise<{ slug: string }>;
+}): Promise<JSX.Element> => {
   const { slug } = await params;
   const post = getPostData(slug);
   return (
     <main>
       <h1>{post.data.title}</h1>
-            <p className="italic text-center">{`Published ${post.data.date.toLocaleDateString("en-GB", { weekday: "long", year: "numeric", month: "long", day: "numeric"})}`}</p>
+      <p className="italic text-center">{`Published ${post.data.date.toLocaleDateString("en-GB", { day: "numeric", month: "long", weekday: "long", year: "numeric" })}`}</p>
       <Rule />
-            <Markdown remarkPlugins={[remarkGfm]}>{post.content}</Markdown>
+      <Markdown remarkPlugins={[ remarkGfm ]}>{post.content}</Markdown>
       <Rule />
       <a href="/">{"← Back to home"}</a>
     </main>
-    )
-}
+  );
+};
+
+export default Page;

src/lib/posts.ts

@@ -10,49 +10,71 @@ import matter from "gray-matter";
 
 const postsDirectory = join(process.cwd(), "posts");
 
-export const getSortedPostsData = () => {
+/**
+ * Reads the posts directory and returns an array of post data.
+ * @returns An array of parsed frontmatter and file contents.
+ */
+const getSortedPostsData = (): Array<{
+  content: string;
+  data:    { date: Date; summary: string; title: string };
+  slug:    string;
+}> => {
   const fileNames = readdirSync(postsDirectory);
   const allPostsData = fileNames.map((fileName) => {
     const slug = fileName.replace(/\.md$/, "");
     const fullPath = join(postsDirectory, fileName);
     const fileContents = readFileSync(fullPath, "utf8");
+    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions -- matter doesn't take a generic I guess?
     const matterResult = matter(fileContents) as unknown as {
       content: string;
       data:    { title: string; date: string; summary: string };
     };
     return {
-      slug: slug,
+      content: matterResult.content,
       data:    {
-        title: matterResult.data.title,
         date:    new Date(matterResult.data.date),
         summary: matterResult.data.summary,
+        title:   matterResult.data.title,
       },
-      content: matterResult.content,
+      slug: slug,
     };
   });
   return allPostsData.sort((a, b) => {
     if (a.data.date < b.data.date) {
       return 1;
-    } else {
-      return -1;
     }
+    return -1;
   });
 };
 
-export const getPostData = (slug: string) => {
-    const fullPath = join(postsDirectory, slug + ".md");
+/**
+ * Reads a single post file.
+ * @param slug - The slug of the post to read.
+ * @returns The parsed frontmatter and file contents.
+ */
+const getPostData = (
+  slug: string,
+): {
+  content: string;
+  data:    { date: Date; summary: string; title: string };
+  slug:    string;
+} => {
+  const fullPath = join(postsDirectory, `${slug}.md`);
   const fileContents = readFileSync(fullPath, "utf8");
+  // eslint-disable-next-line @typescript-eslint/consistent-type-assertions -- matter doesn't take a generic I guess?
   const matterResult = matter(fileContents) as unknown as {
     content: string;
     data:    { title: string; date: string; summary: string };
   };
   return {
-        slug: slug,
+    content: matterResult.content,
     data:    {
-          title: matterResult.data.title,
       date:    new Date(matterResult.data.date),
       summary: matterResult.data.summary,
+      title:   matterResult.data.title,
     },
-        content: matterResult.content,
+    slug: slug,
   };
-}
+};
+
+export { getSortedPostsData, getPostData };