import { GET_PRODUCTS } from '~/graphql/queries/standalone/products';
import type { IProductResponse } from '~/types';

export async function useProducts() {
  const variables = ref({ first: 12 });

  const { data, error, refresh } = await useAsyncQuery<IProductResponse>(
    GET_PRODUCTS,
    variables
  );

  const products = computed(() => data.value?.products?.edges ?? []);
  const pageInfo = computed(() => data.value?.products?.pageInfo ?? {});

  const getProducts = async (params: Record<string, any> = {}) => {
    variables.value = { ...variables.value, ...params };
    await refresh();
  };

  watch(error, (e) => {
    if (e) console.error('useProducts error:', e);
  });

  return {
    products,
    pageInfo,
    getProducts
  };
}