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,
})
}