Qihan/MyBlog-Next
1
0
Fork 0
mirror of https://github.com/ChenQihan666/MyBlog-Next.git synced 2026-08-14 11:29:33 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: replace pagination logic with Astro built-in pagination (#376)

Browse Source
This commit is contained in:
Timon Jurschitsch
2024-09-16 08:05:50 +02:00
committed by GitHub
parent 70b2486293
commit 08b1676cdd
12 changed files with 102 additions and 195 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/posts/[...page].astro
+15
View File
@@ -0,0 +1,15 @@
---
import { SITE } from "@config";
import Posts from "@layouts/Posts.astro";
import type { GetStaticPaths } from "astro";
import { getCollection } from "astro:content";
export const getStaticPaths = (async ({ paginate }) => {
const posts = await getCollection("blog", ({ data }) => !data.draft);
return paginate(posts, { pageSize: SITE.postPerPage });
}) satisfies GetStaticPaths;
const { page } = Astro.props;
---
<Posts {page} />
src/pages/posts/[page].astro
+15
View File
@@ -0,0 +1,15 @@
---
import { SITE } from "@config";
import Posts from "@layouts/Posts.astro";
import type { GetStaticPaths } from "astro";
import { getCollection } from "astro:content";
export const getStaticPaths = (async ({ paginate }) => {
const posts = await getCollection("blog", ({ data }) => !data.draft);
return paginate(posts, { pageSize: SITE.postPerPage });
}) satisfies GetStaticPaths;
const { page } = Astro.props;
---
<Posts {page} />
src/pages/posts/[slug]/index.astro
+2 -20
View File
@@ -1,10 +1,6 @@
---
import { type CollectionEntry, getCollection } from "astro:content";
import Posts from "@layouts/Posts.astro";
import PostDetails from "@layouts/PostDetails.astro";
import getSortedPosts from "@utils/getSortedPosts";
import getPageNumbers from "@utils/getPageNumbers";
import getPagination from "@utils/getPagination";
export interface Props {
post: CollectionEntry<"blog">;
@@ -18,24 +14,10 @@ export async function getStaticPaths() {
props: { post },
}));
const pagePaths = getPageNumbers(posts.length).map(pageNum => ({
params: { slug: String(pageNum) },
}));
return [...postResult, ...pagePaths];
return postResult;
}
const { slug } = Astro.params;
const { post } = Astro.props;
const posts = await getCollection("blog");
const sortedPosts = getSortedPosts(posts);
const pagination = getPagination({
posts: sortedPosts,
page: slug,
});
---
{post ? <PostDetails post={post} /> : <Posts {...pagination} />}
<PostDetails post={post} />
src/pages/posts/index.astro
-18
View File
@@ -1,18 +0,0 @@
---
import { getCollection } from "astro:content";
import Posts from "@layouts/Posts.astro";
import getSortedPosts from "@utils/getSortedPosts";
import getPagination from "@utils/getPagination";
const posts = await getCollection("blog");
const sortedPosts = getSortedPosts(posts);
const pagination = getPagination({
posts: sortedPosts,
page: 1,
isIndex: true,
});
---
<Posts {...pagination} />
src/pages/tags/[tag]/[...page].astro
+29
View File
@@ -0,0 +1,29 @@
---
import { getCollection } from "astro:content";
import TagPosts from "@layouts/TagPosts.astro";
import getUniqueTags from "@utils/getUniqueTags";
import getPostsByTag from "@utils/getPostsByTag";
import type { GetStaticPathsOptions } from "astro";
import { SITE } from "@config";
export async function getStaticPaths({ paginate }: GetStaticPathsOptions) {
const posts = await getCollection("blog");
const tags = getUniqueTags(posts);
return tags.flatMap(({ tag, tagName }) => {
const tagPosts = getPostsByTag(posts, tag);
return paginate(tagPosts, {
params: { tag },
props: { tagName },
pageSize: SITE.postPerPage,
});
});
}
const params = Astro.params;
const { tag } = params;
const { page, tagName } = Astro.props;
---
<TagPosts {page} {tag} {tagName} />
src/pages/tags/[tag]/[page].astro
+13 -28
View File
@@ -1,44 +1,29 @@
---
import { type CollectionEntry, getCollection } from "astro:content";
import { getCollection } from "astro:content";
import TagPosts from "@layouts/TagPosts.astro";
import getUniqueTags from "@utils/getUniqueTags";
import getPostsByTag from "@utils/getPostsByTag";
import getPageNumbers from "@utils/getPageNumbers";
import getPagination from "@utils/getPagination";
import type { GetStaticPathsOptions } from "astro";
import { SITE } from "@config";
export interface Props {
post: CollectionEntry<"blog">;
tag: string;
tagName: string;
}
export async function getStaticPaths() {
export async function getStaticPaths({ paginate }: GetStaticPathsOptions) {
const posts = await getCollection("blog");
const tags = getUniqueTags(posts);
return tags.flatMap(({ tag, tagName }) => {
const tagPosts = getPostsByTag(posts, tag);
const totalPages = getPageNumbers(tagPosts.length);
return totalPages.map(page => ({
params: { tag, page },
props: { tag, tagName },
}));
return paginate(tagPosts, {
params: { tag },
props: { tagName },
pageSize: SITE.postPerPage,
});
});
}
const { page } = Astro.params;
const { tag, tagName } = Astro.props;
const posts = await getCollection("blog", ({ data }) => !data.draft);
const postsByTag = getPostsByTag(posts, tag);
const pagination = getPagination({
posts: postsByTag,
page,
});
const params = Astro.params;
const { tag } = params;
const { page, tagName } = Astro.props;
---
<TagPosts {...pagination} {tag} {tagName} />
<TagPosts {page} {tag} {tagName} />
src/pages/tags/[tag]/index.astro
-32
View File
@@ -1,32 +0,0 @@
---
import { getCollection } from "astro:content";
import TagPosts from "@layouts/TagPosts.astro";
import getPostsByTag from "@utils/getPostsByTag";
import getPagination from "@utils/getPagination";
import getUniqueTags from "@utils/getUniqueTags";
export async function getStaticPaths() {
const posts = await getCollection("blog");
const tags = getUniqueTags(posts);
return tags.map(({ tag, tagName }) => {
return {
params: { tag },
props: { tag, tagName, posts },
};
});
}
const { tag, tagName, posts } = Astro.props;
const postsByTag = getPostsByTag(posts, tag);
const pagination = getPagination({
posts: postsByTag,
page: 1,
isIndex: true,
});
---
<TagPosts {...pagination} {tag} {tagName} />