Wishlist Fix

packages/bigcommerce/src/api/endpoints/wishlist/add-item.ts

@@ -3,7 +3,6 @@ import { parseWishlistItem } from '../../utils/parse-item'
 import getCustomerId from '../../utils/get-customer-id'
 import type { WishlistEndpoint } from '.'
 
-// Return wishlist info
 const addItem: WishlistEndpoint['handlers']['addItem'] = async ({
   res,
   body: { customerToken, item },
@@ -17,41 +16,52 @@ const addItem: WishlistEndpoint['handlers']['addItem'] = async ({
     })
   }
 
+  try {
     const customerId =
       customerToken && (await getCustomerId({ customerToken, config }))
 
     if (!customerId) {
-    return res.status(400).json({
+      throw new Error('Invalid request. No CustomerId')
-      data: null,
-      errors: [{ message: 'Invalid request' }],
-    })
     }
 
-  const { wishlist } = await commerce.getCustomerWishlist({
+    let { wishlist } = await commerce.getCustomerWishlist({
       variables: { customerId },
       config,
     })
-  const options = {
+
+    if (!wishlist) {
+      // If user has no wishlist, then let's create one with new item
+      const { data } = await config.storeApiFetch('/v3/wishlists', {
         method: 'POST',
-    body: JSON.stringify(
+        body: JSON.stringify({
-      wishlist
+          name: 'Next.js Commerce Wishlist',
-        ? {
-            items: [parseWishlistItem(item)],
-          }
-        : {
-            name: 'Wishlist',
-            customer_id: customerId,
-            items: [parseWishlistItem(item)],
           is_public: false,
-          }
+          customer_id: Number(customerId),
-    ),
+          items: [parseWishlistItem(item)],
+        }),
+      })
+      return res.status(200).json(data)
     }
 
-  const { data } = wishlist
+    // Existing Wishlist, let's add Item to Wishlist
-    ? await config.storeApiFetch(`/v3/wishlists/${wishlist.id}/items`, options)
+    const { data } = await config.storeApiFetch(
-    : await config.storeApiFetch('/v3/wishlists', options)
+      `/v3/wishlists/${wishlist.id}/items`,
+      {
+        method: 'POST',
+        body: JSON.stringify({
+          items: [parseWishlistItem(item)],
+        }),
+      }
+    )
 
-  res.status(200).json({ data })
+    // Returns Wishlist
+    return res.status(200).json(data)
+  } catch (err: any) {
+    res.status(500).json({
+      data: null,
+      errors: [{ message: err.message }],
+    })
+  }
 }
 
 export default addItem

packages/bigcommerce/src/api/index.ts

@@ -38,9 +38,9 @@ export interface BigcommerceConfig extends CommerceAPIConfig {
   storeApiFetch<T>(endpoint: string, options?: RequestInit): Promise<T>
 }
 
-const API_URL = process.env.BIGCOMMERCE_STOREFRONT_API_URL
+const API_URL = process.env.BIGCOMMERCE_STOREFRONT_API_URL // GraphAPI
 const API_TOKEN = process.env.BIGCOMMERCE_STOREFRONT_API_TOKEN
-const STORE_API_URL = process.env.BIGCOMMERCE_STORE_API_URL
+const STORE_API_URL = process.env.BIGCOMMERCE_STORE_API_URL // REST API
 const STORE_API_TOKEN = process.env.BIGCOMMERCE_STORE_API_TOKEN
 const STORE_API_CLIENT_ID = process.env.BIGCOMMERCE_STORE_API_CLIENT_ID
 const STORE_CHANNEL_ID = process.env.BIGCOMMERCE_CHANNEL_ID

packages/bigcommerce/src/api/operations/get-customer-wishlist.ts

@@ -44,6 +44,7 @@ export default function getCustomerWishlistOperation({
     const { data = [] } = await config.storeApiFetch<
       RecursivePartial<{ data: Wishlist[] }>
     >(`/v3/wishlists?customer_id=${variables.customerId}`)
+
     const wishlist = data[0]
 
     if (includeProducts && wishlist?.items?.length) {

packages/bigcommerce/src/wishlist/use-wishlist.tsx

@@ -1,11 +1,13 @@
 import { useMemo } from 'react'
 import { SWRHook } from '@vercel/commerce/utils/types'
-import useWishlist, { UseWishlist } from '@vercel/commerce/wishlist/use-wishlist'
+import useWishlist, {
-import type { GetWishlistHook } from '../types/wishlist'
+  UseWishlist,
+} from '@vercel/commerce/wishlist/use-wishlist'
 import useCustomer from '../customer/use-customer'
 
-export default useWishlist as UseWishlist<typeof handler>
+import type { GetWishlistHook } from '../types/wishlist'
 
+export default useWishlist as UseWishlist<typeof handler>
 export const handler: SWRHook<GetWishlistHook> = {
   fetchOptions: {
     url: '/api/wishlist',