diff options
Diffstat (limited to 'src/pages/blog')
| -rw-r--r-- | src/pages/blog/index.astro | 27 |
1 files changed, 24 insertions, 3 deletions
diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro index 48d33e8..0c33b66 100644 --- a/src/pages/blog/index.astro +++ b/src/pages/blog/index.astro @@ -1,4 +1,5 @@ --- +import type { CollectionEntry } from "astro:content"; import { getCollection } from "astro:content"; import Layout from "../../layouts/BaseLayout.astro"; import PostElement from "../../components/PostElement.astro"; @@ -8,12 +9,32 @@ const posts = await getCollection("blog", ({ data }) => { }); posts.sort((a, b) => b.data.pubDate.getTime() - a.data.pubDate.getTime()); + +const postsByYear = posts.reduce<Record<string, CollectionEntry<"blog">[]>>((acc, post) => { + const year = post.data.pubDate.getFullYear().toString(); + if (!acc[year]) { + acc[year] = []; + } + acc[year].push(post); + return acc; +}, {}); + +const years = Object.keys(postsByYear).sort((a, b) => Number(b) - Number(a)); --- <Layout> <section style={{ "margin-top": "3rem" }}> - <ul> - {posts.map((post) => <PostElement post={post} />)} - </ul> + { + years.map((year) => ( + <div> + <div style={{ "margin-bottom": "1rem" }}>{year}</div> + <ul> + {postsByYear[year].map((post) => ( + <PostElement post={post} /> + ))} + </ul> + </div> + )) + } </section> </Layout> |