more yak shaving

src/lib/Post.svelte

@@ -0,0 +1,9 @@
+<script>
+    export let meta, body;
+</script>
+
+
+<div id="post">
+    <h1>{meta.title}</h1>
+    <svelte:component this={body} />
+</div>

src/routes/[slug].svelte

@@ -11,10 +11,8 @@
 </script>
 
 <script>
+    import Post from '$lib/Post.svelte';
     export let meta, body;
 </script>
 
-<div id="post">
+<Post {meta} {body}></Post>
-    <h1>{meta.title}</h1>
-    <svelte:component this={body} />
-</div>

src/routes/all.json.js

@@ -1,11 +1,19 @@
 const posts = import.meta.globEager('./_posts/*.svx');
-export let postData = [];
 
-for (const path in posts) {
+// let postData = [];
-    const slug = path.slice(9, -4)
+
-    posts[path].metadata.slug = slug;
+// for (const path in posts) {
-    postData.push(posts[path].metadata);
+//     const slug = path.slice(9, -4)
-}
+//     posts[path].metadata.slug = slug;
+//     postData.push(posts[path].metadata);
+// }
+
+export let postData = import.meta.glob('./_posts/*.svx');
+export const postData = Object.entries(posts).map((path, post) => {
+    const slug = path.slice(9, -4);
+    post.metadata.slug = slug;
+    return post.metadata;
+})
 postData.sort((a, b) => {
     // sorting in reverse, so we flip the intuitive order
     if (a.date > b.date) return -1;
@@ -16,3 +24,4 @@ postData.sort((a, b) => {
 export async function get() {
     return {body: postData};
 }
+

src/routes/index.svelte

@@ -1,8 +1,8 @@
 <script context="module">
     export async function load({ fetch }) {
-        const resp = await fetch('/all.json');
+        const resp = await fetch('/latest.json');
-        const allPosts = (await resp.json());
+        const metadata = (await resp.json());
-        const post = await import(`./_posts/${allPosts[0].slug}.svx`);
+        const post = await import(`./_posts/${metadata.slug}.svx`);
         return {
             props: {
                 meta: post.metadata,
@@ -13,8 +13,8 @@
 </script>
 
 <script>
-    import BlogPost from './[slug].svelte';
+    import Post from '$lib/Post.svelte';
     export let meta, body;
 </script>
 
-<BlogPost {meta} {body}></BlogPost>
+<Post {meta} {body}></Post>

src/routes/latest.json.js

@@ -0,0 +1,5 @@
+import { postData } from './all.json.js';
+
+export async function get() {
+    return postData[0];
+}