connected to new url param

frontend/composables/api/orders/useGetAllOrders.ts

@@ -1,6 +1,7 @@
 // imports
 
 import { useQuery } from "@tanstack/vue-query";
+import { useAppParams } from "~/composables/global/useAppParams";
 import { API_ENDPOINTS, QUERY_KEYS } from "~/constants";
 
 // types
@@ -13,32 +14,30 @@ export type GetAllOrdersRequest = {
     page: string | string[];
 };
 
-const useGetAllOrders = (params: ComputedRef<GetAllOrdersRequest>) => {
-
+const useGetAllOrders = () => {
     // state
 
     const { $axios: axios } = useNuxtApp();
 
+    const { sort, status, page } = useAppParams();
+
     // methods
 
-    const handleGetAllOrders = async (params: GetAllOrdersRequest) => {
-        const { data } = await axios.get<GetAllOrdersResponse>(
-            API_ENDPOINTS.orders.get_all,
-            {
-                params: {
-                    sort: params.sort,
-                    filter: params.status,
-                    offset: Number(params.page) * 7 - 7,
-                    limit: 7,
-                },
-            }
-        );
+    const handleGetAllOrders = async () => {
+        const { data } = await axios.get<GetAllOrdersResponse>(API_ENDPOINTS.orders.get_all, {
+            params: {
+                sort: sort.value ?? "created_at",
+                filter: status.value,
+                offset: Number(page.value) * 10 - 10,
+                limit: 10,
+            },
+        });
         return data;
     };
 
     return useQuery({
-        queryKey: [QUERY_KEYS.orders, params],
-        queryFn: () => handleGetAllOrders(params.value),
+        queryKey: [QUERY_KEYS.orders, sort, status, page],
+        queryFn: () => handleGetAllOrders(),
     });
 };
 

frontend/composables/api/orders/useGetTransaction.ts

@@ -1,31 +1,32 @@
 // imports
 
 import { useQuery } from "@tanstack/vue-query";
+import { useAppParams } from "~/composables/global/useAppParams";
 import { API_ENDPOINTS, QUERY_KEYS } from "~/constants";
 
 // types
 
 export type GetTransactionResponse = Transaction;
 
-export type GetTransactionRequest = string;
-
-const useGetTransaction = (params: ComputedRef<GetTransactionRequest>) => {
+const useGetTransaction = () => {
     // state
 
     const { $axios: axios } = useNuxtApp();
 
+    const { tracking_code } = useAppParams();
+
     // methods
 
-    const handleGetTransaction = async (tc: GetTransactionRequest) => {
+    const handleGetTransaction = async () => {
         const { data } = await axios.get<GetTransactionResponse>(
-            `${API_ENDPOINTS.orders.checkout.transaction}/${tc}`
+            `${API_ENDPOINTS.orders.checkout.transaction}/${tracking_code.value}`
         );
         return data;
     };
 
     return useQuery({
-        queryKey: [QUERY_KEYS.transaction, params],
-        queryFn: () => handleGetTransaction(params.value),
+        queryKey: [QUERY_KEYS.transaction, tracking_code],
+        queryFn: () => handleGetTransaction(),
     });
 };