---
import {getCollection} from "astro:content";
import PageLayout from "../../layouts/PageLayout.astro";
import {astroI18n, t} from "astro-i18n";
import PostComponent from "../../components/PostComponent.astro";
import dayjs from "dayjs";
import TagComponent from "../../components/TagComponent.astro";

async function getPosts() {
    const posts = await getCollection("announcements", entry => entry.id.split("/")[0] === astroI18n.locale);

    const germanPosts = await getCollection("announcements", entry => entry.id.split("/")[0] === astroI18n.fallbackLocale);

    germanPosts.forEach(value => {
        if (posts.find(post => post.data.key === value.data.key)) {
            return;
        } else {
            posts.push(value);
        }
    });

    return posts.sort((a, b) => dayjs(b.data.created).unix() - dayjs(a.data.created).unix()).filter((value, index) => index < 20);
}

async function getTags() {
    const posts = await getCollection("announcements");
    const tags = new Map<string, number>();
    posts.forEach(post => {
        post.data.tags.forEach(tag => {
            if (tags.has(tag)) {
                tags.set(tag, tags.get(tag) + 1);
            } else {
                tags.set(tag, 1);
            }
        });
    });
    return Array.from(tags).sort((a, b) => b[1] - a[1]).map(value => value[0]);
}

const posts = await getPosts();
const tags = await getTags();
---

<PageLayout title={t("blog.title")}>
    <div class="py-2">
        {tags.map(tag => (
            <TagComponent tag={tag} transition:name={`${tag}-tag-filter`} />
        ))}
    </div>
    <hr>
    {posts.map((post, index) => (
        <div>
            <PostComponent post={post}/>
            {index !== posts.length - 1 &&
                        <hr/>}
        </div>
    ))}
</PageLayout>