83 lines
1.7 KiB
TypeScript
83 lines
1.7 KiB
TypeScript
import { GET_BRANDS } from '@graphql/queries/standalone/brands';
|
|
import type { IBrand, IBrandsResponse } from '@types';
|
|
|
|
interface IBrandArgs {
|
|
brandAfter?: string;
|
|
brandOrderBy?: string;
|
|
brandName?: string;
|
|
brandSearch?: string;
|
|
}
|
|
|
|
interface IBrandVars {
|
|
brandFirst: number;
|
|
brandAfter?: string;
|
|
brandOrderBy?: string;
|
|
brandName?: string;
|
|
brandSearch?: string;
|
|
}
|
|
|
|
export function useBrands(args: IBrandArgs = {}) {
|
|
const variables = reactive<IBrandVars>({
|
|
brandFirst: 45,
|
|
brandAfter: args.brandAfter,
|
|
brandOrderBy: args.orderBy,
|
|
brandName: args.brandName,
|
|
brandSearch: args.brandSearch,
|
|
});
|
|
|
|
const pending = ref(false);
|
|
const brands = ref<IBrand[]>([]);
|
|
const pageInfo = ref<{
|
|
hasNextPage: boolean;
|
|
endCursor: string;
|
|
}>({
|
|
hasNextPage: false,
|
|
endCursor: ''
|
|
});
|
|
const error = ref<string | null>(null);
|
|
|
|
const getBrands = async (): Promise<void> => {
|
|
pending.value = true;
|
|
|
|
const queryVariables = {
|
|
brandFirst: variables.first,
|
|
brandAfter: variables.brandAfter || undefined,
|
|
brandOrderBy: variables.orderBy || undefined,
|
|
brandName: variables.brandName || undefined,
|
|
brandSearch: variables.brandSearch || undefined,
|
|
};
|
|
|
|
const { data, error: mistake } = await useAsyncQuery<IBrandsResponse>(GET_BRANDS, queryVariables);
|
|
|
|
if (data.value?.brands?.edges) {
|
|
pageInfo.value = data.value?.brands.pageInfo;
|
|
|
|
if (variables.brandAfter) {
|
|
brands.value = [
|
|
...brands.value,
|
|
...data.value.brands.edges,
|
|
];
|
|
} else {
|
|
brands.value = data.value?.brands.edges;
|
|
}
|
|
}
|
|
|
|
if (mistake.value) {
|
|
error.value = mistake.value;
|
|
}
|
|
|
|
pending.value = false;
|
|
};
|
|
|
|
watch(error, (e) => {
|
|
if (e) console.error('useBrands error:', e);
|
|
});
|
|
|
|
return {
|
|
pending,
|
|
brands,
|
|
pageInfo,
|
|
variables,
|
|
getBrands,
|
|
};
|
|
}
|