Fixes and Changes

src/pages/ankuendigungen/[...page].astro

@@ -1,12 +1,13 @@
 ---
 import {getCollection} from "astro:content";
 import PageLayout from "../../layouts/PageLayout.astro";
-import {astroI18n, t} from "astro-i18n";
+import {astroI18n, createGetStaticPaths, t} from "astro-i18n";
 import PostComponent from "../../components/PostComponent.astro";
 import dayjs from "dayjs";
 import TagComponent from "../../components/TagComponent.astro";
+import SWPaginator from "@components/styled/SWPaginator.svelte";
 
-async function getPosts() {
+export const getStaticPaths = createGetStaticPaths(async (props) => {
     const posts = await getCollection("announcements", entry => entry.id.split("/")[0] === astroI18n.locale);
 
     const germanPosts = await getCollection("announcements", entry => entry.id.split("/")[0] === astroI18n.fallbackLocale);
@@ -19,8 +20,10 @@ async function getPosts() {
         }
     });
 
-    return posts.sort((a, b) => dayjs(b.data.created).unix() - dayjs(a.data.created).unix()).filter((value, index) => index < 20);
-}
+    return props.paginate(posts.sort((a, b) => dayjs(b.data.created).unix() - dayjs(a.data.created).unix()), {
+        pageSize: 5,
+    });
+});
 
 async function getTags() {
     const posts = await getCollection("announcements");
@@ -37,7 +40,7 @@ async function getTags() {
     return Array.from(tags).sort((a, b) => b[1] - a[1]).map(value => value[0]);
 }
 
-const posts = await getPosts();
+const { page } = Astro.props;
 const tags = await getTags();
 ---
 
@@ -47,9 +50,18 @@ const tags = await getTags();
             <TagComponent tag={tag} transition:name={`${tag}-tag-filter`} />
         ))}
     </div>
-    {posts.map((post, index) => (
+    {page.data.map((post) => (
         <div>
             <PostComponent post={post}/>
         </div>
     ))}
+    <SWPaginator
+        maxPage={page.lastPage}
+        page={page.currentPage - 1}
+        nextUrl={page.url.next}
+        previousUrl={page.url.prev}
+        firstUrl={page.url.first}
+        lastUrl={page.url.last}
+        pagesUrl={(i) => i == 0 ? page.url.first : page.currentPage === page.lastPage ? page.url.current.replace(page.lastPage, i + 1) : page.url.last.replace(page.lastPage, i + 1)}
+    />
 </PageLayout>