Moved handler to each hook

framework/shopify/cart/use-cart.tsx

@@ -1,4 +1,44 @@
-import useCommerceCart, { UseCart } from '@commerce/cart/use-cart'
+import { useMemo } from 'react'
 import type { ShopifyProvider } from '..'
 
+import useCommerceCart, {
+  FetchCartInput,
+  UseCart,
+} from '@commerce/cart/use-cart'
+
+import { Cart } from '@commerce/types'
+import { HookHandler } from '@commerce/utils/types'
+
+import fetcher from './utils/fetcher'
+import getCheckoutQuery from '@framework/utils/queries/get-checkout-query'
+
 export default useCommerceCart as UseCart<ShopifyProvider>
+
+export const handler: HookHandler<
+  Cart | null,
+  {},
+  FetchCartInput,
+  { isEmpty?: boolean }
+> = {
+  fetchOptions: {
+    query: getCheckoutQuery,
+  },
+  fetcher,
+  useHook({ input, useData }) {
+    const response = useData({
+      swrOptions: { revalidateOnFocus: false, ...input.swrOptions },
+    })
+    return useMemo(
+      () =>
+        Object.create(response, {
+          isEmpty: {
+            get() {
+              return (response.data?.lineItems.length ?? 0) <= 0
+            },
+            enumerable: true,
+          },
+        }),
+      [response]
+    )
+  },
+}