From db8be5d9822727651b7a5d8d12cbad8c8290db4b Mon Sep 17 00:00:00 2001
From: Andrei Hudalla <46633092+paranoidPhantom@users.noreply.github.com>
Date: Tue, 17 Sep 2024 21:03:42 -0500
Subject: [PATCH] refactor: move md data fetching logic to middleware

---
 app/middleware/content.ts | 21 +++++++++++++++++++++
 app/pages/[...slug].vue   | 31 ++++++++-----------------------
 2 files changed, 29 insertions(+), 23 deletions(-)
 create mode 100644 app/middleware/content.ts

diff --git a/app/middleware/content.ts b/app/middleware/content.ts
new file mode 100644
index 0000000..46e1a42
--- /dev/null
+++ b/app/middleware/content.ts
@@ -0,0 +1,21 @@
+import { parseMarkdown } from "@nuxtjs/mdc/runtime";
+
+export default defineNuxtRouteMiddleware(async (to) => {
+	const supabase = useSupabaseClient();
+
+	const { data } = await supabase
+		.from("content")
+		.select("md")
+		.eq("slug", to.path)
+		.maybeSingle();
+	if (data) {
+		const { md } = data;
+		const ast = await parseMarkdown(md);
+		to.meta.ast = ast;
+	} else {
+		return abortNavigation({
+			statusCode: 404,
+			message: "ツ",
+		});
+	}
+});
diff --git a/app/pages/[...slug].vue b/app/pages/[...slug].vue
index b8fd05c..3217c52 100644
--- a/app/pages/[...slug].vue
+++ b/app/pages/[...slug].vue
@@ -1,34 +1,19 @@
 <script setup lang="ts">
-import { parseMarkdown } from "@nuxtjs/mdc/runtime";
-
-const supabase = useSupabaseClient();
+definePageMeta({
+	middleware: ["content"],
+});
 
 const {
 	params: { slug },
-} = useRoute();
-
-const { data: ast } = await useAsyncData<typeof parseMarkdown>(
-	`md_${slug}`,
-	async () => {
-		const { data } = await supabase
-			.from("content")
-			.select("md")
-			.eq("slug", `/${slug.join("/")}`)
-			.maybeSingle();
-		if (!data) return null;
-		const { md } = data;
-		return await parseMarkdown(md);
-	},
-);
+	meta: { ast },
+} = useRoute() as any;
 
 const refreshSeo = () => {
-	if (ast.value) {
+	if (ast) {
 		useSeoMeta({
-			title: ast.value.data.title,
+			title: ast.data.title,
 			description:
-				ast.value.data.description === ""
-					? undefined
-					: ast.value.data.description,
+				ast.data.description === "" ? undefined : ast.data.description,
 		});
 	}
 };