This repository has been archived on 2025-03-28. You can view files and clone it, but cannot push or open issues or pull requests.
coryd.dev-astro/src/pages/posts/[...page].astro

59 lines
No EOL
1.8 KiB
Text

---
import { getCollection } from 'astro:content';
import { IconStar } from '@tabler/icons-react';
import { fetchAllPosts } from "@data/posts.js";
import { fetchGlobalData } from '@utils/data/global/index.js';
import Layout from "@layouts/Layout.astro";
import Paginator from '@components/nav/Paginator.astro';
import { md } from '@utils/helpers/general.js';
import { DateTime } from 'luxon';
const posts = await fetchAllPosts();
const { page } = Astro.props;
const { globals } = await fetchGlobalData(Astro);
const currentUrl = Astro.url.pathname;
const currentPage = Astro.params.page ? parseInt(Astro.params.page, 10) : 1;
const pageSize = 15;
const totalPosts = posts.length;
const totalPages = Math.ceil(totalPosts / pageSize);
const start = (currentPage - 1) * pageSize;
const end = start + pageSize;
const paginatedPosts = posts.slice(start, end);
const pagination = {
currentPage,
totalPages,
hasPrevious: currentPage > 1,
hasNext: currentPage < totalPages,
previousPage: currentPage > 1 ? `/posts/${currentPage - 1}` : null,
nextPage: currentPage < totalPages ? `/posts/${currentPage + 1}` : null,
pages: Array.from({ length: totalPages }, (_, i) => ({
number: i + 1,
href: `/posts/${i + 1}`,
})),
};
---
<Layout
globals={globals}
pageTitle="All posts"
currentUrl={currentUrl}
>
{paginatedPosts.map((post) => (
<article>
<div class="post-meta">
{post.featured && <IconStar size={16} />}
<time datetime={post.date}>
{DateTime.fromISO(post.date).toLocaleString(DateTime.DATE_FULL)}
</time>
</div>
<h3>
<a href={post.url}>{post.title}</a>
</h3>
<p set:html={md(post.description)}></p>
</article>
))}
<Paginator pagination={pagination} />
</Layout>