mirror of
https://github.com/valentineus/popov.link.git
synced 2025-07-03 16:10:26 +03:00
refactor: remove Pagination component and restructure blog page
- Deleted the Pagination component as it is no longer needed. - Refactored the blog page to directly display posts without pagination. - Introduced a new index page to list all blog posts in a single view.
This commit is contained in:
@ -1,35 +0,0 @@
|
|||||||
---
|
|
||||||
type Props = {
|
|
||||||
readonly nextUrl?: string;
|
|
||||||
readonly prevUrl?: string;
|
|
||||||
};
|
|
||||||
|
|
||||||
const { nextUrl, prevUrl } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
div {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
margin: 0 2em;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
{
|
|
||||||
prevUrl && (
|
|
||||||
<span>
|
|
||||||
<a href={prevUrl}>< Prev</a>
|
|
||||||
</span>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
{
|
|
||||||
nextUrl && (
|
|
||||||
<span>
|
|
||||||
<a href={nextUrl}>Next ></a>
|
|
||||||
</span>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
</div>
|
|
@ -1,33 +0,0 @@
|
|||||||
---
|
|
||||||
import type { GetStaticPaths, InferGetStaticPropsType } from "astro";
|
|
||||||
import { getCollection } from "astro:content";
|
|
||||||
import Layout from "../layouts/BaseLayout.astro";
|
|
||||||
import Pagination from "../components/Pagination.astro";
|
|
||||||
import PostSummary from "../components/PostSummary.astro";
|
|
||||||
|
|
||||||
type Props = InferGetStaticPropsType<typeof getStaticPaths>;
|
|
||||||
|
|
||||||
export const getStaticPaths = (async ({ paginate }) => {
|
|
||||||
const posts = await getCollection("blog", ({ data }) => {
|
|
||||||
return data.draft !== true;
|
|
||||||
});
|
|
||||||
|
|
||||||
posts.sort((a, b) => b.data.pubDate.getTime() - a.data.pubDate.getTime());
|
|
||||||
|
|
||||||
return paginate(posts, {
|
|
||||||
pageSize: 10,
|
|
||||||
});
|
|
||||||
}) satisfies GetStaticPaths;
|
|
||||||
|
|
||||||
const { page } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<Layout>
|
|
||||||
<section style={{ "margin-top": "3rem" }}>
|
|
||||||
{page.data.map((post) => <PostSummary post={post} />)}
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<Pagination nextUrl={page.url.next} prevUrl={page.url.prev} />
|
|
||||||
</section>
|
|
||||||
</Layout>
|
|
17
src/pages/index.astro
Normal file
17
src/pages/index.astro
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
---
|
||||||
|
import { getCollection } from "astro:content";
|
||||||
|
import Layout from "../layouts/BaseLayout.astro";
|
||||||
|
import PostSummary from "../components/PostSummary.astro";
|
||||||
|
|
||||||
|
const posts = await getCollection("blog", ({ data }) => {
|
||||||
|
return data.draft !== true;
|
||||||
|
});
|
||||||
|
|
||||||
|
posts.sort((a, b) => b.data.pubDate.getTime() - a.data.pubDate.getTime());
|
||||||
|
---
|
||||||
|
|
||||||
|
<Layout>
|
||||||
|
<section style={{ "margin-top": "3rem" }}>
|
||||||
|
{posts.map((post) => <PostSummary post={post} />)}
|
||||||
|
</section>
|
||||||
|
</Layout>
|
Reference in New Issue
Block a user