Added actions and more stuff to the wishlist page

lib/bigcommerce/api/operations/get-customer-wishlist.ts

@@ -4,9 +4,13 @@ import { BigcommerceConfig, getConfig } from '..'
 import getAllProducts, { ProductEdge } from './get-all-products'
 
 export type Wishlist = Omit<definitions['wishlist_Full'], 'items'> & {
-  items?: (NonNullable<definitions['wishlist_Full']['items']>[0] & {
-    product?: ProductEdge['node']
-  })[]
+  items?: WishlistItem[]
+}
+
+export type WishlistItem = NonNullable<
+  definitions['wishlist_Full']['items']
+>[0] & {
+  product?: ProductEdge['node']
 }
 
 export type GetCustomerWishlistResult<

lib/bigcommerce/api/wishlist/index.ts

@@ -4,12 +4,15 @@ import createApiHandler, {
   BigcommerceHandler,
 } from '../utils/create-api-handler'
 import { BigcommerceApiError } from '../utils/errors'
-import type { Wishlist } from '../operations/get-customer-wishlist'
+import type {
+  Wishlist,
+  WishlistItem,
+} from '../operations/get-customer-wishlist'
 import getWishlist from './handlers/get-wishlist'
 import addItem from './handlers/add-item'
 import removeItem from './handlers/remove-item'
 
-export type { Wishlist }
+export type { Wishlist, WishlistItem }
 
 export type ItemBody = {
   productId: number

lib/bigcommerce/wishlist/use-add-item.tsx

@@ -4,7 +4,7 @@ import { CommerceError } from '../../commerce/utils/errors'
 import useWishlistAddItem from '../../commerce/wishlist/use-add-item'
 import type { ItemBody, AddItemBody } from '../api/wishlist'
 import useCustomer from '../use-customer'
-import useWishlist, { Wishlist } from './use-wishlist'
+import useWishlist, { UseWishlistOptions, Wishlist } from './use-wishlist'
 
 const defaultOpts = {
   url: '/api/bigcommerce/wishlist',
@@ -27,9 +27,9 @@ export const fetcher: HookFetcher<Wishlist, AddItemBody> = (
 }
 
 export function extendHook(customFetcher: typeof fetcher) {
-  const useAddItem = () => {
+  const useAddItem = (opts?: UseWishlistOptions) => {
     const { data: customer } = useCustomer()
-    const { mutate } = useWishlist()
+    const { revalidate } = useWishlist(opts)
     const fn = useWishlistAddItem(defaultOpts, customFetcher)
 
     return useCallback(
@@ -42,10 +42,10 @@ export function extendHook(customFetcher: typeof fetcher) {
         }
 
         const data = await fn({ item: input })
-        await mutate(data, false)
+        await revalidate()
         return data
       },
-      [fn, mutate, customer]
+      [fn, revalidate, customer]
     )
   }
 

lib/bigcommerce/wishlist/use-remove-item.tsx

@@ -4,7 +4,7 @@ import { CommerceError } from '../../commerce/utils/errors'
 import useWishlistRemoveItem from '../../commerce/wishlist/use-remove-item'
 import type { RemoveItemBody } from '../api/wishlist'
 import useCustomer from '../use-customer'
-import useWishlist, { Wishlist } from './use-wishlist'
+import useWishlist, { UseWishlistOptions, Wishlist } from './use-wishlist'
 
 const defaultOpts = {
   url: '/api/bigcommerce/wishlist',
@@ -28,9 +28,9 @@ export const fetcher: HookFetcher<Wishlist | null, RemoveItemBody> = (
 }
 
 export function extendHook(customFetcher: typeof fetcher) {
-  const useRemoveItem = () => {
+  const useRemoveItem = (opts?: UseWishlistOptions) => {
     const { data: customer } = useCustomer()
-    const { mutate } = useWishlist()
+    const { revalidate } = useWishlist(opts)
     const fn = useWishlistRemoveItem<Wishlist | null, RemoveItemBody>(
       defaultOpts,
       customFetcher
@@ -46,10 +46,10 @@ export function extendHook(customFetcher: typeof fetcher) {
         }
 
         const data = await fn({ itemId: String(input.id) })
-        await mutate(data, false)
+        await revalidate()
         return data
       },
-      [fn, mutate, customer]
+      [fn, revalidate, customer]
     )
   }
 

lib/bigcommerce/wishlist/use-wishlist.tsx

@@ -60,7 +60,7 @@ export function extendHook(
     // response.data is also a getter and it's better to not trigger it early
     Object.defineProperty(response, 'isEmpty', {
       get() {
-        return (response.data?.items?.length || 0) > 0
+        return (response.data?.items?.length || 0) <= 0
       },
       set: (x) => x,
     })