import { useGetProductsList } from '~/api/queries'

export const useProductsList = () => {
  const { getAttribute } = useProduct()
  const { data: productData } = useGetProductsList()

  const productCardData = computed(() => productData?.value?.map(product => ({
    id: product?.id,
    name: product?.name,
    price: product?.price,
    variations: product?.variations,
    images: product?.images?.slice(0, 5),
    colors: getAttribute(product?.attributes, 'color')?.options,
  })) ?? [])

  return {
    productCardData,
  }
}