diff --git a/src/app/(home)/blog/page.tsx b/src/app/(home)/blog/page.tsx index 63198b1..49eed7e 100644 --- a/src/app/(home)/blog/page.tsx +++ b/src/app/(home)/blog/page.tsx @@ -3,21 +3,34 @@ import { fetchBlogPosts } from '@/fetch/blog' import { BlogExcerpt } from '@/components/BlogExcerpt/BlogExcerpt' import { Section } from '@/components/Section/Section' import { Container } from '@/components/Container/Container' +import { NextPrevButtons } from '@/components/NextPrevButtons/NextPrevButtons' import { getPhoto } from '@/utils/dto/gallery' export const dynamic = 'force-dynamic' -export default async function Page() { - const blogs = await fetchBlogPosts(false); +const buildHref = (page: number): string => + page > 1 ? `/blog?page=${page}` : '/blog' + +export default async function Page({ + searchParams, +}: { + searchParams: Promise<{ page?: string }> +}) { + const query = await searchParams + + const parsedPage = parseInt(query.page ?? '1', 10) + const page = Number.isFinite(parsedPage) && parsedPage > 0 ? parsedPage : 1 + + const blogs = await fetchBlogPosts(false, page) return ( <> -
+
{ blogs?.docs.map(blog => @@ -31,6 +44,23 @@ export default async function Page() { }
+ + {(blogs?.hasPrevPage || blogs?.hasNextPage) && ( +
+ +
+ )} ) -} \ No newline at end of file +} diff --git a/src/fetch/blog.ts b/src/fetch/blog.ts index 378cfc9..4497b9d 100644 --- a/src/fetch/blog.ts +++ b/src/fetch/blog.ts @@ -5,8 +5,9 @@ import config from '@/payload.config' * Fetches blog posts based on given criteria. * * @param {boolean} displayOnFrontpage - Indicates whether to display posts on the front page. + * @param {number} page - Page number for pagination. */ -export const fetchBlogPosts = async (displayOnFrontpage: boolean) => { +export const fetchBlogPosts = async (displayOnFrontpage: boolean, page: number = 1) => { const today = new Date() today.setHours(23, 59) @@ -69,6 +70,7 @@ export const fetchBlogPosts = async (displayOnFrontpage: boolean) => { }, where: query, limit: 18, + page, }) }