1---
 2import { getCollection } from "astro:content";
 3import PostsList from "@/components/PostsList.astro";
 4import GlobalLayout from "@/layouts/GlobalLayout.astro";
 5
 6const posts = await getCollection("posts");
 7const sortedPosts = posts.sort(
 8  (a, b) => b.data.date.getTime() - a.data.date.getTime(),
 9);
10const postsByYear = sortedPosts.reduce(
11  (acc, post) => {
12    const year = post.data.date.getFullYear();
13    if (!acc[year]) {
14      acc[year] = [];
15    }
16    acc[year].push(post);
17    return acc;
18  },
19  {} as Record<number, typeof posts>,
20);
21---
22
23<GlobalLayout>
24  <div class="article-anchor article-heading article-list">
25    <h1>Posts</h1>
26    {
27      Object.entries(postsByYear)
28        .reverse()
29        .map(([year, posts]) => (
30          <section>
31            <h2>{year}</h2>
32            <PostsList posts={posts} />
33          </section>
34        ))
35    }
36  </div>
37</GlobalLayout>