added use get products
This commit is contained in:
@@ -0,0 +1,60 @@
|
||||
// imports
|
||||
|
||||
import { useQuery } from "@tanstack/vue-query";
|
||||
import { API_ENDPOINTS, QUERY_KEYS } from "~/constants";
|
||||
|
||||
// types
|
||||
|
||||
export type GetProductsResponse = Product[];
|
||||
|
||||
export type GetProductsFilters = {
|
||||
search: string | undefined;
|
||||
sort: string | undefined;
|
||||
categories: string[] | undefined;
|
||||
price_range: number[] | undefined;
|
||||
has_discount: boolean | undefined;
|
||||
in_stock: boolean | undefined;
|
||||
};
|
||||
|
||||
// composable
|
||||
|
||||
const useGetProducts = (
|
||||
filters: GetProductsFilters,
|
||||
page: ComputedRef<number>
|
||||
) => {
|
||||
// state
|
||||
|
||||
const { $axios: axios } = useNuxtApp();
|
||||
|
||||
// methods
|
||||
|
||||
const handleGetProducts = async ({
|
||||
filters,
|
||||
page,
|
||||
}: {
|
||||
filters: GetProductsFilters;
|
||||
page: number;
|
||||
}) => {
|
||||
const { data } = await axios.get<GetProductsResponse>(
|
||||
`${API_ENDPOINTS.products.get_all}`,
|
||||
{
|
||||
params: {
|
||||
...filters,
|
||||
page,
|
||||
offest: page * 10 - 10,
|
||||
limit: 10,
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
return data;
|
||||
};
|
||||
|
||||
return useQuery({
|
||||
staleTime: 60 * 1000,
|
||||
queryKey: [QUERY_KEYS.products, filters, page],
|
||||
queryFn: () => handleGetProducts({ filters, page: page.value }),
|
||||
});
|
||||
};
|
||||
|
||||
export default useGetProducts;
|
||||
|
||||
Reference in New Issue
Block a user