includeProducts in useWishlist() throwing error

[heylols]

By default the useWishlist() hook seem to be returning only the product ids of the wishlisted items. I checked the code: https://github.com/bigcommerce/storefront-data-hooks/blob/cc5ce62b760fde8f0402b627feaeb43ba88acaff/src/wishlist/use-wishlist.tsx#L15

So tried passing the includeProducts as parameter like this:

import useWishlist from '@bigcommerce/storefront-data-hooks/wishlist/use-wishlist'

const WishlistNumber = () => {
    const { data } = useWishlist({includeProducts : true})

    const itemsCount = data?.items.length ?? 0
    console.log('wl', data)

    return itemsCount > 0 ? <span>{itemsCount}</span> : null
}

export default WishlistNumber

But it is throwing error message.

Error Message:

Argument 'first' cannot exceed 50
    at FetcherError.CommerceError [as constructor]

Btw, I upgraded the package from v1.5.1 to v1.6.0. Still not resolved.

[jorgemasta]

Hi @heylols , thank you for creating the issue.

The BC API has recently changed the maximum number of products that can be received at one time to 50. The problem is here: https://github.com/bigcommerce/storefront-data-hooks/blob/c6b655cba5f8ea1508bc7aa3023c6d23c73f3ef5/src/api/operations/get-customer-wishlist.ts#L64

The fix will be included in the next release.

[jorgemasta]

Included in v1.7.0

[heylols]

@jorgemasta thanks. That resolved the issue. But I have one more question. Can I pass the fields to be fetched, as parameter? I mean like in my case, I need fields like product_name, product_image, meta_description, sku, custom_url only. And I generate the app specific product URL based on these data and is used so that the Customer can access the product pages from the Wishlist.

Any thoughts? Thank you!