Allow removing line items

framework/spree/cart/use-add-item.tsx

@@ -62,7 +62,7 @@ export const handler: MutationHook<AddItemHook> = {
     () => {
       console.log('useAddItem useHook called.')
 
-      const { mutate, data: cartData } = useCart()
+      const { mutate } = useCart()
 
       return useCallback(async (input) => {
         const data = await fetch({ input })

framework/spree/cart/use-cart.tsx

@@ -70,11 +70,11 @@ export const handler: SWRHook<GetCartHook> = {
         },
       })
 
-      setCartToken(spreeCartCreateSuccessResponse.data.attributes.token)
-
       spreeCartResponse = spreeCartCreateSuccessResponse
     }
 
+    setCartToken(spreeCartResponse.data.attributes.token)
+
     return normalizeCart(spreeCartResponse, spreeCartResponse.data)
   },
   useHook:

framework/spree/cart/use-remove-item.tsx

@@ -1,18 +1,71 @@
 import { MutationHook } from '@commerce/utils/types'
-import useRemoveItem, { UseRemoveItem } from '@commerce/cart/use-remove-item'
+import useRemoveItem from '@commerce/cart/use-remove-item'
+import type { UseRemoveItem } from '@commerce/cart/use-remove-item'
+import type { RemoveItemHook } from '@commerce/types/cart'
+import useCart from './use-cart'
+import { useCallback } from 'react'
+import normalizeCart from '@framework/utils/normalizeCart'
+import type { IOrder } from '@spree/storefront-api-v2-sdk/types/interfaces/Order'
+import type { GraphQLFetcherResult } from '@commerce/api'
+import type { IQuery } from '@spree/storefront-api-v2-sdk/types/interfaces/Query'
+import getCartToken from '@framework/utils/getCartToken'
+import type { IToken } from '@spree/storefront-api-v2-sdk/types/interfaces/Token'
 
 export default useRemoveItem as UseRemoveItem<typeof handler>
 
-export const handler: MutationHook<any> = {
+export const handler: MutationHook<RemoveItemHook> = {
   fetchOptions: {
+    url: '__UNUSED__',
     query: '',
   },
-  async fetcher({ input, options, fetch }) {},
+  async fetcher({ input, options, fetch }) {
+    console.info(
+      'useRemoveItem fetcher called. Configuration: ',
+      'input: ',
+      input,
+      'options: ',
+      options
+    )
+
+    const { itemId: lineItemId } = input
+
+    const token: IToken = { orderToken: getCartToken() }
+    const removeItemParameters: IQuery = {
+      include: [
+        'line_items',
+        'line_items.variant',
+        'line_items.variant.product',
+        'line_items.variant.product.images',
+        'line_items.variant.images',
+        'line_items.variant.option_values',
+        'line_items.variant.product.option_types',
+      ].join(','),
+    }
+
+    const {
+      data: { data: spreeSuccessResponse },
+    } = await fetch<GraphQLFetcherResult<{ data: IOrder }>>({
+      variables: {
+        methodPath: 'cart.removeItem',
+        arguments: [token, lineItemId, removeItemParameters],
+      },
+    })
+
+    return normalizeCart(spreeSuccessResponse, spreeSuccessResponse.data)
+  },
   useHook:
     ({ fetch }) =>
     () => {
-      return async function removeItem(input) {
-        return {}
-      }
+      console.log('useRemoveItem useHook called.')
+
+      const { mutate } = useCart()
+
+      return useCallback(async (input) => {
+        const data = await fetch({ input: { itemId: input.id } })
+
+        await mutate(data, false)
+
+        return data
+      }, [])
     },
 }