broken blog layout setup

[slug].astro

---
import { getCollection, CollectionEntry } from "astro:content";
import Layout from "../../layouts/Layout.astro";

export async function getStaticPaths() {
  const posts = await getCollection('blog');

  return posts.map((post) => {
    const year = post.data.date.getFullYear();
    post.slug = `/${year}/${post.slug}`;
    return {
      params: {
        slug: post.slug,
      },
      props: {
        post,
      },
    };
  });
}

interface Props {
  post: CollectionEntry<'blog'>;
}
const { post } = Astro.props;
const { Content } = await post.render();
---

<Layout title={post.data.title}>
    <header>
        <h1>{post.data.title}</h1>
        <a href={post.slug}>Read More</a>
        </header>   
        <Content />
</Layout>