@orderly.network/ui-transfer 3.1.8 → 3.1.9-alpha.1

package/dist/index.js

@@ -2395,11 +2395,16 @@ function useDepositAction(options2) {
   const { quantity, approve, deposit, swapDeposit, onSuccess, needSwap } = options2;
   const [isMutating, setIsMutating] = react.useState(false);
   const [depositError, setDepositError] = react.useState("");
+  const mutationLock = react.useRef(false);
   const ee = hooks.useEventEmitter();
   const { t } = i18n.useTranslation();
-  const doDeposit = react.useCallback(async () => {
+  const runDeposit = react.useCallback(async () => {
     try {
-      await deposit();
+      if (needSwap) {
+        await swapDeposit?.();
+      } else {
+        await deposit();
+      }
       setDepositError("");
     } catch (err) {
       console.error("orderly deposit error", err);
@@ -2422,57 +2427,94 @@ function useDepositAction(options2) {
       }
       throw err;
     }
-  }, [deposit, onSuccess, t, ee]);
-  const onDeposit = react.useCallback(async () => {
+  }, [deposit, needSwap, swapDeposit, t]);
+  const runApprove = react.useCallback(async () => {
+    try {
+      await approve(quantity);
+      ui.toast.success(t("transfer.deposit.approve.success"));
+    } catch (err) {
+      console.error("approve error", err);
+      ui.toast.error(
+        err.message || err?.errorCode || t("transfer.deposit.approve.failed")
+      );
+      throw err;
+    }
+  }, [approve, quantity, t]);
+  const isValidQuantity = react.useCallback(() => {
     const num = Number(quantity);
     if (isNaN(num) || num <= 0) {
       ui.toast.error(t("transfer.quantity.invalid"));
-      return;
+      return false;
+    }
+    return true;
+  }, [quantity, t]);
+  const startMutation = react.useCallback(() => {
+    if (mutationLock.current) {
+      return false;
     }
-    if (isMutating) return;
+    mutationLock.current = true;
     setIsMutating(true);
+    return true;
+  }, []);
+  const finishMutation = react.useCallback(() => {
+    mutationLock.current = false;
+    setIsMutating(false);
+  }, []);
+  const onDeposit = react.useCallback(async () => {
+    if (mutationLock.current) return;
+    if (!isValidQuantity() || !startMutation()) {
+      return;
+    }
     try {
-      if (needSwap) {
-        await swapDeposit?.();
-      } else {
-        await doDeposit();
-      }
+      await runDeposit();
       ui.toast.success(t("transfer.deposit.requested"));
       ee.emit("deposit:requested");
       onSuccess?.();
     } catch (err) {
     } finally {
-      setIsMutating(false);
+      finishMutation();
     }
-  }, [quantity, isMutating, needSwap, doDeposit, swapDeposit, t]);
+  }, [
+    ee,
+    finishMutation,
+    isValidQuantity,
+    onSuccess,
+    runDeposit,
+    startMutation,
+    t
+  ]);
   const onApprove = react.useCallback(async () => {
-    if (isMutating) return;
-    setIsMutating(true);
+    if (!startMutation()) return;
     try {
-      await approve(quantity);
-      ui.toast.success(t("transfer.deposit.approve.success"));
-    } catch (err) {
-      console.error("approve error", err);
-      ui.toast.error(
-        err.message || err?.errorCode || t("transfer.deposit.approve.failed")
-      );
-      throw err;
+      await runApprove();
     } finally {
-      setIsMutating(false);
+      finishMutation();
     }
-  }, [approve, isMutating, quantity, t]);
+  }, [finishMutation, runApprove, startMutation]);
   const onApproveAndDeposit = react.useCallback(async () => {
-    if (isMutating) return;
-    setIsMutating(true);
+    if (mutationLock.current) return;
+    if (!isValidQuantity() || !startMutation()) return;
     try {
-      await onApprove();
-      await onDeposit();
+      await runApprove();
+      await runDeposit();
+      ui.toast.success(t("transfer.deposit.requested"));
+      ee.emit("deposit:requested");
+      onSuccess?.();
     } catch (err) {
       console.error("approve and deposit error", err);
     } finally {
-      setIsMutating(false);
+      finishMutation();
     }
-  }, [isMutating, onApprove, onDeposit]);
+  }, [
+    ee,
+    finishMutation,
+    isValidQuantity,
+    onSuccess,
+    runApprove,
+    runDeposit,
+    startMutation,
+    t
+  ]);
   return {
     isMutating,
     depositError,