Merge pull request #26 from krckyboy/#14

#14
krckyboy · Feb 11, 2024 · b9bffb6 · b9bffb6
2 parents 6c85fdc + 7ae93ff
commit b9bffb6
Show file tree

Hide file tree

Showing 3 changed files with 62 additions and 19 deletions.
diff --git a/next/package-lock.json b/next/package-lock.json
diff --git a/next/package.json b/next/package.json
@@ -10,10 +10,12 @@
   },
   "dependencies": {
     "@types/nprogress": "^0.2.3",
+    "@types/qs": "^6.9.11",
     "date-fns": "^3.2.0",
     "next": "14.0.4",
     "nprogress": "^0.2.0",
     "path": "^0.12.7",
+    "qs": "^6.11.2",
     "react": "^18",
     "react-dom": "^18",
     "react-markdown": "^9.0.1",

diff --git a/next/src/scripts/fetch.ts b/next/src/scripts/fetch.ts
@@ -1,4 +1,5 @@
 import type { CategoriesFetchResponse, PostsFetchResponse } from '@/components/blog-post-item/types';
+import qs from 'qs';
 
 export const fetchWrapper = async <T>(url: string | URL) => {
   try {
@@ -21,22 +22,53 @@ export const fetchWrapper = async <T>(url: string | URL) => {
   }
 };
 
-const sortByPublishedAt = 'sort=publishedAt:desc';
-
 export const db = {
   getPosts: async () => {
-    return await fetchWrapper<PostsFetchResponse>(`/posts?${sortByPublishedAt}`);
+    const queryParams = {
+      sort: ['publishedAt:desc'],
+      pagination: {
+        pageSize: 10,
+        page: 1
+      }
+    };
+
+    const queryString = qs.stringify(queryParams);
+    return await fetchWrapper<PostsFetchResponse>(`/posts?${queryString}`);
   },
   getPostBySlug: async (slug: string) => {
-    return await fetchWrapper<PostsFetchResponse>(`/posts/?&filters[slug]=${slug}&populate[0]=categories`);
+    const queryParams = {
+      filters: {
+        slug: slug
+      },
+      populate: ['categories']
+    };
+
+    const queryString = qs.stringify(queryParams);
+    return await fetchWrapper<PostsFetchResponse>(`/posts?${queryString}`);
   },
   getPostSlugs: async () => {
-    return await fetchWrapper<PostsFetchResponse>('/posts?fields[0]=slug');
+    const queryParams = {
+      fields: ['slug']
+    };
+
+    const queryString = qs.stringify(queryParams);
+    return await fetchWrapper<PostsFetchResponse>(`/posts?${queryString}`);
   },
   getFeaturedPosts: async () => {
-    return await fetchWrapper<PostsFetchResponse>(`/posts?&filters[isFeatured][$eq]=true&${sortByPublishedAt}&fields[0]=slug&fields[1]=title&fields[2]=content&fields[3]=publishedAt`);
+    const queryParams = {
+      filters: {
+        isFeatured: {
+          $eq: true
+        }
+      },
+      sort: ['publishedAt:desc'],
+      fields: ['slug', 'title', 'content', 'publishedAt']
+    };
+
+    const queryString = qs.stringify(queryParams);
+    return await fetchWrapper<PostsFetchResponse>(`/posts?${queryString}`);
   },
   getCategories: async () => {
     return await fetchWrapper<CategoriesFetchResponse>('/categories');
   }
-};
+};