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

package/dist/index.mjs

@@ -1,5 +1,5 @@
 import { i18n, useTranslation, Trans } from '@orderly.network/i18n';
-import { registerSimpleDialog, registerSimpleSheet, Tabs, TabPanel, ArrowDownSquareFillIcon, ArrowUpSquareFillIcon, ExtensionSlot, ExtensionPositionEnum, toast, Box, textVariants, Flex, Text, cn, Button, useDocumentDirection, Spinner, Select, Input, inputFormatter, useScreen, modal, Tooltip, Tips, AlertDialog, EditIcon, ArrowLeftRightIcon, WalletIcon, DropdownMenuRoot, DropdownMenuTrigger, DropdownMenuPortal, DropdownMenuContent, ScrollArea, ChainIcon, Badge, CaretUpIcon, CaretDownIcon, SimpleDialog, CloseRoundFillIcon, ExclamationFillIcon, TokenIcon, WarningIcon, SelectItem, ChevronRightIcon, Checkbox, CloseIcon } from '@orderly.network/ui';
+import { registerSimpleDialog, registerSimpleSheet, Tabs, TabPanel, ArrowDownSquareFillIcon, ArrowUpSquareFillIcon, ExtensionSlot, ExtensionPositionEnum, toast, Box, Flex, textVariants, Text, cn, Button, useDocumentDirection, Spinner, Select, Input, inputFormatter, useScreen, modal, Tooltip, Tips, AlertDialog, EditIcon, ArrowLeftRightIcon, WalletIcon, DropdownMenuRoot, DropdownMenuTrigger, DropdownMenuPortal, DropdownMenuContent, ScrollArea, ChainIcon, Badge, CaretUpIcon, CaretDownIcon, SimpleDialog, CloseRoundFillIcon, ExclamationFillIcon, TokenIcon, WarningIcon, SelectItem, ChevronRightIcon, Checkbox, CloseIcon } from '@orderly.network/ui';
 import { forwardRef, useState, isValidElement, useMemo, useEffect, useCallback, useRef } from 'react';
 import { useConfig, useWalletConnector, useLocalStorage, useConvert, useSwapQuote as useSwapQuote$1, useComputedLTV, useAccount, useAppStore, useTransfer, useSubAccountDataObserver, useSubAccountMaxWithdrawal, useMainTokenStore, useEventEmitter, usePositionStream, useIndexPricesStream, useOrderlyContext, useDeposit, useAssetsHistory, useChains, useMemoizedFn, useWithdraw, useWalletTopic, useQuery, useSWR, useTokenInfo, useTokensInfo, useHoldingStream, useInternalTransfer, useDebouncedCallback, usePrivateQuery, useTransferHistory, useBalanceTopic } from '@orderly.network/hooks';
 import { Decimal, zero, praseChainIdToNumber, int2hex, toNonExponential, formatWithPrecision, isSolana } from '@orderly.network/utils';
@@ -2393,11 +2393,16 @@ function useDepositAction(options2) {
   const { quantity, approve, deposit, swapDeposit, onSuccess, needSwap } = options2;
   const [isMutating, setIsMutating] = useState(false);
   const [depositError, setDepositError] = useState("");
+  const mutationLock = useRef(false);
   const ee = useEventEmitter();
   const { t } = useTranslation();
-  const doDeposit = useCallback(async () => {
+  const runDeposit = useCallback(async () => {
     try {
-      await deposit();
+      if (needSwap) {
+        await swapDeposit?.();
+      } else {
+        await deposit();
+      }
       setDepositError("");
     } catch (err) {
       console.error("orderly deposit error", err);
@@ -2420,57 +2425,94 @@ function useDepositAction(options2) {
       }
       throw err;
     }
-  }, [deposit, onSuccess, t, ee]);
-  const onDeposit = useCallback(async () => {
+  }, [deposit, needSwap, swapDeposit, t]);
+  const runApprove = useCallback(async () => {
+    try {
+      await approve(quantity);
+      toast.success(t("transfer.deposit.approve.success"));
+    } catch (err) {
+      console.error("approve error", err);
+      toast.error(
+        err.message || err?.errorCode || t("transfer.deposit.approve.failed")
+      );
+      throw err;
+    }
+  }, [approve, quantity, t]);
+  const isValidQuantity = useCallback(() => {
     const num = Number(quantity);
     if (isNaN(num) || num <= 0) {
       toast.error(t("transfer.quantity.invalid"));
-      return;
+      return false;
+    }
+    return true;
+  }, [quantity, t]);
+  const startMutation = useCallback(() => {
+    if (mutationLock.current) {
+      return false;
     }
-    if (isMutating) return;
+    mutationLock.current = true;
     setIsMutating(true);
+    return true;
+  }, []);
+  const finishMutation = useCallback(() => {
+    mutationLock.current = false;
+    setIsMutating(false);
+  }, []);
+  const onDeposit = useCallback(async () => {
+    if (mutationLock.current) return;
+    if (!isValidQuantity() || !startMutation()) {
+      return;
+    }
     try {
-      if (needSwap) {
-        await swapDeposit?.();
-      } else {
-        await doDeposit();
-      }
+      await runDeposit();
       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 = useCallback(async () => {
-    if (isMutating) return;
-    setIsMutating(true);
+    if (!startMutation()) return;
     try {
-      await approve(quantity);
-      toast.success(t("transfer.deposit.approve.success"));
-    } catch (err) {
-      console.error("approve error", err);
-      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 = useCallback(async () => {
-    if (isMutating) return;
-    setIsMutating(true);
+    if (mutationLock.current) return;
+    if (!isValidQuantity() || !startMutation()) return;
     try {
-      await onApprove();
-      await onDeposit();
+      await runApprove();
+      await runDeposit();
+      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,