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