Initial commit

src/pages/drafts/[slug]/index.astro

@@ -0,0 +1,47 @@
+---
+import { getSlugFromPathname } from '$/utils'
+
+import PostDraftPageLayout from '$/layouts/post-draft.astro'
+
+export async function getStaticPaths({ }) {
+    let allPosts = []
+    try {
+        allPosts = await Astro.glob('../../../drafts/*.md')
+    } catch(error) {
+        console.log('No draft posts found while generating the draft pages')
+    }
+    const allSlugs = new Set()
+    const allPostsWithSlug = allPosts.map(post => {
+        // @ts-ignore
+        const slug = getSlugFromPathname(post.file)
+        allSlugs.add(slug.toLowerCase())
+        return {
+            ...post,
+            slug
+        }
+    })
+
+    return Array.from(allSlugs).map((slug) => {
+        const filteredPosts = allPostsWithSlug.filter((post) => post.slug === slug )
+        return {
+            params: { slug },
+            props: {
+                pages: filteredPosts
+            }
+        };
+    });
+}
+
+const { slug } = Astro.params
+const { pages } = Astro.props
+const [ post ] = pages
+---
+<div class="draft-message">
+    You're viewing a <strong>preview</strong> of <code>/blog/{slug}</code> which isn't published yet!
+</div>
+<post.Content/>
+<style>
+    .draft-message {
+        @apply w-full bg-yellow-300 dark:bg-yellow-700 text-gray-700 dark:text-white px-2 py-1 text-center
+    }
+</style>