Fix comment pagination and change show limit to 8 items

frontend/composables/api/product/useGetComments.ts

@@ -1,28 +1,35 @@
 // imports
 
 import { useQuery } from "@tanstack/vue-query";
+import { useAppParams } from "~/composables/global/useAppParams";
 import { API_ENDPOINTS, QUERY_KEYS } from "~/constants";
 
 // types
 
 export type GetCommentsResponse = ApiPaginated<UserComment>;
 
-const useGetComments = (id: string | number | undefined, page: Ref<number>) => {
-
+const useGetComments = (id: string | number | undefined) => {
     // state
 
     const { $axios: axios } = useNuxtApp();
 
+    const { page } = useAppParams();
+
     // methods
 
     const handleGetComments = async () => {
-        const { data } = await axios.get<GetCommentsResponse>(`${API_ENDPOINTS.product.comments}/${id}`);
+        const { data } = await axios.get<GetCommentsResponse>(`${API_ENDPOINTS.product.comments}/${id}`, {
+            params: {
+                offset: Number(page.value) * 8 - 8,
+                limit: 8,
+            },
+        });
         return data;
     };
 
     return useQuery({
         queryKey: [QUERY_KEYS.comments, id, page],
-        queryFn: () => handleGetComments()
+        queryFn: () => handleGetComments(),
     });
 };