schon/storefront/composables/store/useStore.ts
Alexandr SaVBaD Waltz 40ae24a04c Features: 1) Add SEO-related fragments to GraphQL queries including SEOMETA_FRAGMENT usage in brands, categories, and products queries; 2) Enable localized and dynamic SEO metadata handling in category pages with Vue composables and useSeoMeta; 3) Replace obsolete client-only wrapper with native Nuxt components like nuxt-marquee for enhanced rendering;
Fixes: 1) Correct file path imports by removing `.js` extensions in GraphQL fragments; 2) Resolve typo in `usePromocodeStore` composables to ensure consistent store usage; 3) Add missing `:type="submit"` to login form button for proper form submission handling;

Extra: 1) Remove unused `.idea` and `README.md` files for repository cleanup; 2) Delete extraneous dependencies from `package-lock.json` for streamlined package management; 3) Refactor category slug handling with improved composable logic for cleaner route parameters and SEO alignment.
2025-09-13 12:53:06 +03:00

72 lines
No EOL
1.6 KiB
TypeScript

import { GET_PRODUCTS } from '~/graphql/queries/standalone/products';
import type {IProductResponse} from '~/types';
interface IProdVars {
first: number,
categoriesSlugs: string,
attributes?: string,
orderBy?: string,
minPrice?: number,
maxPrice?: number,
productAfter?: string
}
export function useStore(
slug: string,
attributes?: string,
orderBy?: string,
minPrice?: number,
maxPrice?: number,
productAfter?: string
) {
const variables = reactive<IProdVars>({
first: 15,
categoriesSlugs: slug,
attributes,
orderBy,
minPrice,
maxPrice,
productAfter
});
const { pending, data, error, refresh } = useAsyncQuery<IProductResponse>(
GET_PRODUCTS,
variables
);
const products = ref([...(data.value?.products.edges ?? [])]);
const pageInfo = computed(() => data.value?.products.pageInfo ?? null);
watch(error, e => e && console.error('useStore products error', e));
watch(
() => variables.productAfter,
async (newCursor, oldCursor) => {
if (!newCursor || newCursor === oldCursor) return;
await refresh();
const newEdges = data.value?.products.edges ?? [];
products.value = [...products.value, ...newEdges];
}
);
watch(
[
() => variables.attributes,
() => variables.orderBy,
() => variables.minPrice,
() => variables.maxPrice
],
async () => {
variables.productAfter = '';
await refresh();
products.value = [...(data.value?.products.edges ?? [])];
}
);
return {
pending,
products,
pageInfo,
variables
};
}