fix: Refactor Journals to Notes

app/journals/[slug]/page.tsx → app/notes/[slug]/page.tsx

@@ -1,6 +1,6 @@
 import type { Metadata } from "next";
 import { notFound } from "next/navigation";
-import { allJournals } from "contentlayer/generated";
+import { allNotes } from "contentlayer/generated";
 import { Mdx } from "@/components/Mdx";
 import { StructuredData } from "@/components/StructuredData";
 import { Typography } from "@/components/Typography";
@@ -12,13 +12,13 @@ export const generateMetadata = async (props: {
   params: Params;
 }): Promise<Metadata> => {
   const params = await props.params;
-  const journal = allJournals.find((journal) => journal.slug === params.slug)!;
+  const note = allNotes.find((note) => note.slug === params.slug)!;
 
-  const title = journal.title;
-  const description = journal.title;
-  const publishedTime = journal.publishedAt;
+  const title = note.title;
+  const description = note.title;
+  const publishedTime = note.publishedAt;
   const images = `${BASE_URL}/og?title=${title}`;
-  const url = journal.url;
+  const url = note.url;
 
   return {
     title,
@@ -44,27 +44,27 @@ export const generateMetadata = async (props: {
 };
 
 export const generateStaticParams = () =>
-  allJournals.map(({ slug }) => ({ slug }));
+  allNotes.map(({ slug }) => ({ slug }));
 
-const JournalPage = async (props: { params: Params }) => {
+const NotePage = async (props: { params: Params }) => {
   const params = await props.params;
-  const journal = allJournals.find((journal) => journal.slug === params.slug);
+  const note = allNotes.find((note) => note.slug === params.slug);
 
-  if (!journal) {
+  if (!note) {
     return notFound();
   }
 
   return (
     <>
-      <StructuredData data={journal.structuredData} />
+      <StructuredData data={note.structuredData} />
       <article className="prose prose-invert mx-auto mb-16 max-w-4xl prose-a:text-pink-500 prose-img:rounded-2xl">
         <Typography variant="h1" className="text-center">
-          {journal.title}
+          {note.title}
         </Typography>
-        <Mdx code={journal.body.code} />
+        <Mdx code={note.body.code} />
       </article>
     </>
   );
 };
 
-export default JournalPage;
+export default NotePage;

app/journals/page.tsx → app/notes/page.tsx

@@ -1,6 +1,6 @@
 import type { Metadata } from "next";
 import Link from "next/link";
-import { allJournals } from "contentlayer/generated";
+import { allNotes } from "contentlayer/generated";
 import { format, formatISO, parseISO } from "date-fns";
 import globalMetadata from "@/app/metadata";
 import { openGraphImage, twitterImage } from "@/app/shared-metadata";
@@ -9,18 +9,18 @@ import { Typography } from "@/components/Typography";
 import { sortByLatest } from "@/lib/sortByLatest";
 import type { WebPage, WithContext } from "schema-dts";
 
-const title = `Journals`;
+const title = "Notes";
 const description =
   "A collection containing fun and interesting things I came across randomly.";
 
 export const metadata: Metadata = {
-  title: "Journals",
+  title,
   description,
   openGraph: {
     ...globalMetadata.openGraph,
     title,
     description,
-    url: "/journals",
+    url: "/notes",
     ...openGraphImage,
   },
   twitter: {
@@ -30,11 +30,11 @@ export const metadata: Metadata = {
     ...twitterImage,
   },
   alternates: {
-    canonical: "/journals",
+    canonical: "/notes",
   },
 };
 
-const JournalsPage = () => {
+const NotesPage = () => {
   const structuredData: WithContext<WebPage> = {
     "@context": "https://schema.org",
     "@type": "WebPage",
@@ -47,14 +47,14 @@ const JournalsPage = () => {
     <>
       <StructuredData data={structuredData} />
       <Typography variant="h1" className="mb-8">
-        Journals
+        Notes
       </Typography>
       <Typography variant="h2" className="mb-8">
         {description}
       </Typography>
       <div className="flex flex-col justify-center gap-8">
         <div className="flex flex-col gap-2">
-          {allJournals.sort(sortByLatest).map(({ title, publishedAt, url }) => {
+          {allNotes.sort(sortByLatest).map(({ title, publishedAt, url }) => {
             const formattedDate = format(parseISO(publishedAt), "dd MMM yyyy");
 
             return (
@@ -83,4 +83,4 @@ const JournalsPage = () => {
   );
 };
 
-export default JournalsPage;
+export default NotesPage;

config/index.ts

@@ -9,7 +9,7 @@ export const BASE_URL: string =
 export const navLinks: NavLink[] = [
   // { title: "Blog", href: "/blog" },
   { title: "About", href: "/about" },
-  { title: "Journals", href: "/journals" },
+  { title: "Notes", href: "/notes" },
   { title: "Projects", href: "/projects" },
   // { title: "Resume", href: "/resume" },
 ];

contentlayer.config.ts

@@ -63,9 +63,9 @@ export const Post = defineDocumentType(() => ({
   },
 }));
 
-export const Journal = defineDocumentType(() => ({
-  name: "Journal",
-  filePathPattern: "journals/**/*.mdx",
+export const Note = defineDocumentType(() => ({
+  name: "Note",
+  filePathPattern: "notes/**/*.mdx",
   contentType: "mdx",
   fields: {
     title: { type: "string", required: true },
@@ -76,27 +76,27 @@ export const Journal = defineDocumentType(() => ({
   computedFields: {
     slug: {
       type: "string",
-      resolve: (journal) => {
-        const [_, slug] = journal._raw.flattenedPath.split("/");
+      resolve: (note) => {
+        const [_, slug] = note._raw.flattenedPath.split("/");
         return slug;
       },
     },
     structuredData: {
       type: "json",
-      resolve: (journal) =>
+      resolve: (note) =>
         ({
           "@context": "https://schema.org",
           "@type": "BlogPosting",
-          headline: journal.title,
-          dateModified: journal.publishedAt,
-          datePublished: journal.publishedAt,
-          description: journal.title,
+          headline: note.title,
+          dateModified: note.publishedAt,
+          datePublished: note.publishedAt,
+          description: note.title,
           image: [
-            journal.image
-              ? encodeURI(`${BASE_URL}/${journal.image}`)
-              : encodeURI(`${BASE_URL}/og?title=${journal.title}`),
+            note.image
+              ? encodeURI(`${BASE_URL}/${note.image}`)
+              : encodeURI(`${BASE_URL}/og?title=${note.title}`),
           ],
-          url: `${BASE_URL}/${journal._raw.flattenedPath}`,
+          url: `${BASE_URL}/${note._raw.flattenedPath}`,
           author: {
             "@type": "Person",
             name: "Ru Chern Chong",
@@ -106,14 +106,14 @@ export const Journal = defineDocumentType(() => ({
     },
     url: {
       type: "string",
-      resolve: (journal) => `/${journal._raw.flattenedPath}`,
+      resolve: (note) => `/${note._raw.flattenedPath}`,
     },
   },
 }));
 
 export default makeSource({
   contentDirPath: "content",
-  documentTypes: [Post, Journal],
+  documentTypes: [Post, Note],
   mdx: {
     remarkPlugins: [remarkGfm, remarkUnwrapImages],
     rehypePlugins: [