@behio/storefront-sdk 2.0.0 → 2.0.1

package/README.md

@@ -13,6 +13,11 @@ Behio gives you a complete e-commerce backend (products, inventory, orders, cust
 
 ## Install
 
+React cart mutations in 2.0.1 cancel older cart reads before writing and before
+accepting the server response. This includes adding, clearing, applying or
+removing a discount, and merging baskets. A delayed read cannot restore an old
+basket after one of those actions succeeds.
+
 ```bash
 npm install @behio/storefront-sdk
 ```

package/dist/react.js

@@ -2566,24 +2566,24 @@ function useCart(options) {
     // Only fetch if we have a cart session or are logged in
     enabled: options?.enabled !== false && (!!client.getCartSession() || !!client.getAccessToken())
   });
+  const cancelCartRead = () => queryClient.cancelQueries({ queryKey: [...CART_KEY] });
+  const acceptCart = async (result) => {
+    await cancelCartRead();
+    queryClient.setQueryData([...CART_KEY], result);
+    void refreshBundleQueries(queryClient);
+  };
   const addMutation = (0, import_react_query12.useMutation)({
     mutationFn: async ({ productId, quantity }) => {
       return unwrap(client.cart.addItem({ productId, quantity: quantity ?? 1 }));
     },
-    onSuccess: (result) => {
+    onMutate: cancelCartRead,
+    onSuccess: async (result) => {
       if (result.newSessionToken) {
         storage.set(STORAGE_KEYS.CART_SESSION, result.newSessionToken);
       }
-      queryClient.setQueryData([...CART_KEY], result);
-      void refreshBundleQueries(queryClient);
+      await acceptCart(result);
     }
   });
-  const cancelCartRead = () => queryClient.cancelQueries({ queryKey: [...CART_KEY] });
-  const acceptCart = async (result) => {
-    await cancelCartRead();
-    queryClient.setQueryData([...CART_KEY], result);
-    void refreshBundleQueries(queryClient);
-  };
   const updateMutation = (0, import_react_query12.useMutation)({
     mutationFn: async ({ itemId, quantity }) => {
       return unwrap(client.cart.updateQuantity(itemId, quantity));
@@ -2606,7 +2606,9 @@ function useCart(options) {
   });
   const clearMutation = (0, import_react_query12.useMutation)({
     mutationFn: () => unwrap(client.cart.clear()),
-    onSuccess: () => {
+    onMutate: cancelCartRead,
+    onSuccess: async () => {
+      await cancelCartRead();
       queryClient.setQueryData([...CART_KEY], null);
       client.clearCartSession();
       storage.remove(STORAGE_KEYS.CART_SESSION);
@@ -2615,19 +2617,19 @@ function useCart(options) {
   });
   const applyDiscountMutation = (0, import_react_query12.useMutation)({
     mutationFn: (code) => unwrap(client.cart.applyDiscount(code)),
-    onSuccess: (result) => {
-      queryClient.setQueryData([...CART_KEY], result);
-    }
+    onMutate: cancelCartRead,
+    onSuccess: acceptCart
   });
   const removeDiscountMutation = (0, import_react_query12.useMutation)({
     mutationFn: () => unwrap(client.cart.removeDiscount()),
-    onSuccess: (result) => {
-      queryClient.setQueryData([...CART_KEY], result);
-    }
+    onMutate: cancelCartRead,
+    onSuccess: acceptCart
   });
   const mergeMutation = (0, import_react_query12.useMutation)({
     mutationFn: () => unwrap(client.cart.merge()),
-    onSuccess: (result) => {
+    onMutate: cancelCartRead,
+    onSuccess: async (result) => {
+      await cancelCartRead();
       queryClient.setQueryData([...CART_KEY], result);
       client.clearCartSession();
       storage.remove(STORAGE_KEYS.CART_SESSION);

package/dist/react.mjs

@@ -2456,24 +2456,24 @@ function useCart(options) {
     // Only fetch if we have a cart session or are logged in
     enabled: options?.enabled !== false && (!!client.getCartSession() || !!client.getAccessToken())
   });
+  const cancelCartRead = () => queryClient.cancelQueries({ queryKey: [...CART_KEY] });
+  const acceptCart = async (result) => {
+    await cancelCartRead();
+    queryClient.setQueryData([...CART_KEY], result);
+    void refreshBundleQueries(queryClient);
+  };
   const addMutation = useMutation({
     mutationFn: async ({ productId, quantity }) => {
       return unwrap(client.cart.addItem({ productId, quantity: quantity ?? 1 }));
     },
-    onSuccess: (result) => {
+    onMutate: cancelCartRead,
+    onSuccess: async (result) => {
       if (result.newSessionToken) {
         storage.set(STORAGE_KEYS.CART_SESSION, result.newSessionToken);
       }
-      queryClient.setQueryData([...CART_KEY], result);
-      void refreshBundleQueries(queryClient);
+      await acceptCart(result);
     }
   });
-  const cancelCartRead = () => queryClient.cancelQueries({ queryKey: [...CART_KEY] });
-  const acceptCart = async (result) => {
-    await cancelCartRead();
-    queryClient.setQueryData([...CART_KEY], result);
-    void refreshBundleQueries(queryClient);
-  };
   const updateMutation = useMutation({
     mutationFn: async ({ itemId, quantity }) => {
       return unwrap(client.cart.updateQuantity(itemId, quantity));
@@ -2496,7 +2496,9 @@ function useCart(options) {
   });
   const clearMutation = useMutation({
     mutationFn: () => unwrap(client.cart.clear()),
-    onSuccess: () => {
+    onMutate: cancelCartRead,
+    onSuccess: async () => {
+      await cancelCartRead();
       queryClient.setQueryData([...CART_KEY], null);
       client.clearCartSession();
       storage.remove(STORAGE_KEYS.CART_SESSION);
@@ -2505,19 +2507,19 @@ function useCart(options) {
   });
   const applyDiscountMutation = useMutation({
     mutationFn: (code) => unwrap(client.cart.applyDiscount(code)),
-    onSuccess: (result) => {
-      queryClient.setQueryData([...CART_KEY], result);
-    }
+    onMutate: cancelCartRead,
+    onSuccess: acceptCart
   });
   const removeDiscountMutation = useMutation({
     mutationFn: () => unwrap(client.cart.removeDiscount()),
-    onSuccess: (result) => {
-      queryClient.setQueryData([...CART_KEY], result);
-    }
+    onMutate: cancelCartRead,
+    onSuccess: acceptCart
   });
   const mergeMutation = useMutation({
     mutationFn: () => unwrap(client.cart.merge()),
-    onSuccess: (result) => {
+    onMutate: cancelCartRead,
+    onSuccess: async (result) => {
+      await cancelCartRead();
       queryClient.setQueryData([...CART_KEY], result);
       client.clearCartSession();
       storage.remove(STORAGE_KEYS.CART_SESSION);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@behio/storefront-sdk",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "TypeScript SDK for Behio headless e-commerce: core client + React hooks",
   "author": "Behio",
   "license": "MIT",