---
import { getCollection } from "astro:content";
import Base from "/components/Base.astro";
import SinglePage from "/layouts/SinglePage.astro";
import BlogPost from "/components/BlogPost.astro";

const post = await getCollection("blog").then((x) =>
  x.sort(
    (a, b) =>
      (b.data.pub as unknown as number) - (a.data.pub as unknown as number),
  ),
);
---

<Base
  title="BLOG"
  graph={{
    description: "Blog posts and such.",
  }}
>
  <SinglePage>
    <h1 slot="header">Blog posts</h1>
    {
      post.map((post) => (
        <BlogPost
          url={`/blog/${post.id}`}
          title={post.data.title}
          time={`${post.data.pub.getFullYear()}-${post.data.pub.getMonth() + 1}-${post.data.pub.getDate()}`}
        />
      ))
    }
  </SinglePage>
</Base>