1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
|
---
import type { CollectionEntry } from "astro:content";
import { config } from "../../config";
import { getCollection } from "astro:content";
import blogSchema from "../../utils/schemas/blogSchema";
import breadcrumbSchema from "../../utils/schemas/breadcrumbSchema";
import Layout from "../../layouts/BaseLayout.astro";
import PostElement from "../../components/PostElement.astro";
import RSSIcon from "../../components/Icons/RSS.astro";
import websiteSchema from "../../utils/schemas/websiteSchema";
const posts = await getCollection("blog", ({ data }) => {
return data.draft !== true;
});
posts.sort((a, b) => b.data.datePublished.getTime() - a.data.datePublished.getTime());
const postsByYear = posts.reduce<Record<string, CollectionEntry<"blog">[]>>((acc, post) => {
const year = post.data.datePublished.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));
const title = "Valentin Popov's Blog | Software Development, Leadership & Open-Source";
const description = "Explore Valentin Popov's blog on software development, tech leadership, and open-source experiments. Stay updated with in-depth tutorials and expert insights.";
const preview = config.og.defaultPreview;
const lang = "en";
const siteUrl = new URL("/", Astro.site).toString();
const schema = [
websiteSchema({ siteUrl, name: config.og.website, description, lang }),
blogSchema({ siteUrl, title, description, lang, posts }),
breadcrumbSchema({
siteUrl,
items: [
{ name: "Home", url: "/" },
{ name: "Blog", url: "/blog/" },
],
}),
];
---
<Layout title={title} description={description} preview={preview} lang={lang} schema={schema}>
<section>
<h1>
Blog posts
<RSSIcon />
</h1>
</section>
<section>
{
years.map((year) => (
<div>
<h2>{year}</h2>
<ul>
{postsByYear[year].map((post) => (
<PostElement post={post} />
))}
</ul>
</div>
))
}
</section>
</Layout>
|
