---
import Layout from '../../layouts/Layout.astro';
import { getCollection } from 'astro:content';

export async function getStaticPaths() {
  const blogEntries = await getCollection('posts');
  return blogEntries.map(entry => ({
    params: { slug: entry.slug }, props: { entry },
  }));
}

const { entry } = Astro.props;
const { Content } = await entry.render();

const slug = Astro.params.slug;
---

<Layout 
  title={entry.data.title}
  path={`~/grassblock/micr0blog/blog/${slug}`}
>
      <h1 class="post-title">{entry.data.title}</h1>
      <span class="post-date">{new Date(entry.data.pubDate).toISOString().split('T')[0]}</span>
      <div class="post-content">
        <Content />
      </div>

    <div style="margin-top: 2rem; border-top: 1px solid var(--border-color); padding-top: 1rem;">
    <a href="/blog">&larr; Back to posts</a>
  </div>
</Layout>