Fix sending too many request on line item update (#4343)

saleor · Oct 19, 2023 · 4c37703 · 4c37703
1 parent 601d236
commit 4c37703
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 14 deletions.
diff --git a/.changeset/brown-years-wash.md b/.changeset/brown-years-wash.md
@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+Fix sending too many request on line item update
diff --git a/src/components/Datagrid/hooks/useDatagridChange.ts b/src/components/Datagrid/hooks/useDatagridChange.ts
@@ -24,6 +24,7 @@ export interface DatagridChangeOpts {
   added: number[];
   removed: number[];
   updates: DatagridChange[];
+  currentUpdate?: DatagridChange;
 }
 export type OnDatagridChange = (
   opts: DatagridChangeOpts,
@@ -81,13 +82,24 @@ function useDatagridChange(
   );
 
   const notify = useCallback(
-    (updates: DatagridChange[], added: number[], removed: number[]) => {
+    ({
+      added,
+      currentUpdate,
+      removed,
+      updates,
+    }: {
+      updates: DatagridChange[];
+      added: number[];
+      removed: number[];
+      currentUpdate: DatagridChange;
+    }) => {
       if (onChange) {
         onChange(
           {
             updates,
             removed,
             added,
+            currentUpdate,
           },
           setMarkCellsDirty,
         );
@@ -105,7 +117,12 @@ function useDatagridChange(
         existingIndex === -1
           ? [...changes.current, update]
           : updateAtIndex(update, changes.current, existingIndex);
-      notify(changes.current, added, removed);
+      notify({
+        updates: changes.current,
+        added,
+        removed,
+        currentUpdate: update,
+      });
     },
     [availableColumns, notify, added, removed],
   );
@@ -132,15 +149,25 @@ function useDatagridChange(
         }));
       setAdded(newAdded);
 
-      notify(changes.current, newAdded, newRemoved);
+      notify({
+        updates: changes.current,
+        added: newAdded,
+        removed: newRemoved,
+        currentUpdate: undefined,
+      });
     },
     [added, removed, notify],
   );
 
   const onRowAdded = useCallback(() => {
     const newAdded = [...added, rows - removed.length + added.length];
     setAdded(newAdded);
-    notify(changes.current, newAdded, removed);
+    notify({
+      updates: changes.current,
+      added: newAdded,
+      removed,
+      currentUpdate: undefined,
+    });
   }, [added, notify, removed, rows]);
 
   return {

diff --git a/src/orders/components/OrderDraftDetailsDatagrid/OrderDraftDetailsDatagrid.tsx b/src/orders/components/OrderDraftDetailsDatagrid/OrderDraftDetailsDatagrid.tsx
@@ -140,19 +140,17 @@ export const OrderDraftDetailsDatagrid = ({
 
   const handleDatagridChange = useCallback(
     async (
-      { updates }: DatagridChangeOpts,
+      { currentUpdate }: DatagridChangeOpts,
       setMarkCellsDirty: (areCellsDirty: boolean) => void,
     ) => {
-      await Promise.all(
-        updates.map(({ data, column, row }) => {
-          const orderId = lines[row].id;
+      if (!currentUpdate) return;
 
-          if (column === "quantity" && data.value !== "") {
-            return onOrderLineChange(orderId, { quantity: data.value });
-          }
-          return undefined;
-        }),
-      );
+      const { data, column, row } = currentUpdate;
+      const orderId = lines[row].id;
+
+      if (column === "quantity" && data.value !== "") {
+        await onOrderLineChange(orderId, { quantity: data.value });
+      }
 
       datagrid.changes.current = [];
       setMarkCellsDirty(false);