Initial commit

astro/src/pages/posts/[id].astro

@@ -0,0 +1,31 @@
+---
+import Layout from "@/layouts/Layout.astro";
+import Content from "@/components/Content.astro";
+import type { Post } from "@/types";
+import { getPost, getPosts } from "@/utils/payload";
+
+export async function getStaticPaths() {
+  const posts = await getPosts();
+  const paths = posts.map((post: Post) => ({
+    params: { id: post.id },
+  }));
+  return paths;
+}
+
+const { id } = Astro.params;
+const post = id && (await getPost(id));
+---
+
+{
+  post ? (
+    <Layout title={`Astroad | ${post.title!}`}>
+      <div class="space-y-3 my-3">
+        <a href="/">BACK</a>
+        <h1 class="font-bold text-5xl" transition:name=`title-${post.id}`>{post.title}</h1>
+        {post.content && <Content content={post.content} />}
+      </div>
+    </Layout>
+  ) : (
+    <div>404</div>
+  )
+}