@orderly.network/ui-order-entry 3.1.12 → 3.2.0-alpha.0

package/dist/index.mjs

@@ -1,5 +1,5 @@
 import React3, { memo, forwardRef, useState, useImperativeHandle, useEffect, createContext, useMemo, useRef, useCallback, useContext, useId } from 'react';
-import { useLocalStorage, utils, useGetEstLiqPrice, useOrderlyContext, useMemoizedFn, ERROR_MSG_CODES, usePositionStream, useFeeState, useRwaSymbolsInfoStore, useMarkets, MarketsType, useMarginModes, useMarginModeBySymbol, useBadgeBySymbol, useEventEmitter, useDebouncedCallback, useHoldingStream, useAppStore, useIndexPricesStream, useComputedLTV, useBoolean, useFeatureFlag, FlagKeys, useQuery, useAccount, useOrderEntry, useMarginRatio, useTpslPriceChecker, useTrack } from '@orderly.network/hooks';
+import { useLocalStorage, utils, useGetEstLiqPrice, useOrderlyContext, useMemoizedFn, ERROR_MSG_CODES, USDCBorrowLimitExceededError, usePositionStream, useFeeState, useRwaSymbolsInfoStore, useMarkets, MarketsType, useMarginModes, useMarginModeBySymbol, useBadgeBySymbol, useEventEmitter, useDebouncedCallback, useHoldingStream, useConvertThreshold, useAppStore, useIndexPricesStream, useComputedLTV, useBoolean, useFeatureFlag, FlagKeys, useAccount, useOrderEntry, useMarginRatio, normalizeUSDCBorrowLimit, useTpslPriceChecker, useTrack } from '@orderly.network/hooks';
 import { i18n, useTranslation, Trans } from '@orderly.network/i18n';
 import { useOrderEntryFormErrorMsg, useCanTrade } from '@orderly.network/react-app';
 import { OrderSide, EMPTY_LIST, DistributionType, TrailingCallbackType, OrderType, MarginMode, PositionType, BBOOrderType, ORDER_ENTRY_EST_LIQ_PRICE_CHANGE, OrderLevel, TrackerEventName } from '@orderly.network/types';
@@ -605,9 +605,9 @@ var OrderConfirmDialog = (props) => {
   const { t } = useTranslation();
   const [{ rows: positions }] = usePositionStream(symbol);
   const position = useMemo(
-    () => orderMarginMode != null ? positions?.find(
-      (row) => row.symbol === symbol && row.margin_mode === orderMarginMode
-    ) : positions?.[0],
+    () => positions?.find(
+      (row) => row.symbol === symbol && (row.margin_mode ?? MarginMode.CROSS) === (orderMarginMode ?? MarginMode.CROSS)
+    ),
     [positions, symbol, orderMarginMode]
   );
   const positionQty = position?.position_qty;
@@ -680,15 +680,17 @@ var OrderConfirmDialog = (props) => {
     );
   };
   const renderTPSLQty = () => {
+    if (order.position_type === PositionType.FULL)
+      return /* @__PURE__ */ jsxs(Flex, { justify: "between", children: [
+        /* @__PURE__ */ jsx(Text, { children: t("common.orderQty") }),
+        /* @__PURE__ */ jsx(Text, { children: t("tpsl.entirePosition") })
+      ] });
     if (!positionQty || !order.order_quantity) {
       return null;
     }
-    let qty = new Decimal(order.order_quantity);
-    if (order.position_type === PositionType.FULL) {
-      qty = qty.plus(new Decimal(positionQty ?? 0));
-    }
+    const qty = new Decimal(order.order_quantity);
     return /* @__PURE__ */ jsxs(Flex, { justify: "between", children: [
-      /* @__PURE__ */ jsx(Text, { children: order.position_type === PositionType.FULL ? t("common.positionQty") : t("common.orderQty") }),
+      /* @__PURE__ */ jsx(Text, { children: t("common.orderQty") }),
       /* @__PURE__ */ jsx(
         Text.numeral,
         {
@@ -1907,18 +1909,6 @@ var LTVRiskTooltipUI = (props) => {
     }
   );
 };
-var useConvertThreshold = () => {
-  const { data, error, isLoading } = useQuery(
-    "/v1/public/auto_convert_threshold",
-    { errorRetryCount: 3 }
-  );
-  return {
-    ltv_threshold: new Decimal(data?.ltv_threshold ?? 0).mul(100).toNumber(),
-    negative_usdc_threshold: data?.negative_usdc_threshold,
-    isLoading,
-    error
-  };
-};
 var useLTVTooltipScript = (marginMode) => {
   const { isMobile } = useScreen();
   const { data: holdingList = [], isLoading: isHoldingLoading } = useHoldingStream();
@@ -1927,6 +1917,7 @@ var useLTVTooltipScript = (marginMode) => {
     negative_usdc_threshold,
     isLoading: isThresholdLoading
   } = useConvertThreshold();
+  const ltvThresholdPercentage = new Decimal(ltv_threshold ?? 0).mul(100).toNumber();
   const tokensInfo = useAppStore((state) => state.tokensInfo);
   const { getIndexPrice } = useIndexPricesStream();
   const holdingData = holdingList.map((item) => {
@@ -1957,7 +1948,7 @@ var useLTVTooltipScript = (marginMode) => {
   return {
     holdingData,
     isHoldingLoading,
-    ltv_threshold,
+    ltv_threshold: ltvThresholdPercentage,
     negative_usdc_threshold,
     isThresholdLoading,
     currentLtv,
@@ -3357,6 +3348,7 @@ var LeverageBadge = (props) => {
   const { enabled } = useFeatureFlag(FlagKeys.IsolatedMargin);
   const marginMode = props.marginMode;
   const isDisabled = !!disabled;
+  const isMarginModeDisabled = isDisabled || !enabled;
   const curLeverage = symbolLeverage ?? 1;
   const showLeverageModal = () => {
     if (isDisabled) return;
@@ -3369,7 +3361,7 @@ var LeverageBadge = (props) => {
     });
   };
   const showMarginModeModal = () => {
-    if (isDisabled || !enabled) {
+    if (isMarginModeDisabled) {
       return;
     }
     const modalId = isMobile ? MarginModeSwitchSheetId : MarginModeSwitchDialogId;
@@ -3396,11 +3388,11 @@ var LeverageBadge = (props) => {
               "oui-flex oui-flex-1 oui-items-center oui-justify-center oui-gap-x-1",
               "oui-px-3 oui-py-1.5",
               "oui-text-xs oui-font-semibold oui-text-base-contrast-54",
-              isDisabled ? "oui-cursor-not-allowed" : "oui-cursor-pointer"
+              isMarginModeDisabled ? "oui-cursor-not-allowed" : "oui-cursor-pointer"
             ),
             "data-testid": "oui-testid-orderEntry-margin-mode",
             "aria-label": t("marginMode.switchMarginMode"),
-            disabled: isDisabled,
+            disabled: isMarginModeDisabled,
             onClick: showMarginModeModal,
             children: /* @__PURE__ */ jsx(Text, { children: marginMode === void 0 ? "--" : marginMode === MarginMode.ISOLATED ? t("marginMode.isolated") : t("marginMode.cross") })
           }
@@ -5694,7 +5686,8 @@ var OrderEntry = (props) => {
     currentFocusInput,
     walletAddress,
     isPermissionlessListing,
-    symbol
+    symbol,
+    usdcBorrowLimit
   } = props;
   const [maxQtyConfirmOpen, setMaxQtyConfirmOpen] = useState(false);
   const [selectedExtraId, setSelectedExtraId] = useState(null);
@@ -5778,6 +5771,15 @@ var OrderEntry = (props) => {
         return Promise.reject();
       }
     ).then((order) => {
+      const projectedBorrow = helper.getProjectedUSDCBorrow(order);
+      if (projectedBorrow !== null && projectedBorrow > usdcBorrowLimit) {
+        throw new USDCBorrowLimitExceededError(
+          projectedBorrow,
+          usdcBorrowLimit
+        );
+      }
+      return order;
+    }).then((order) => {
       const shouldShowPermissionlessNotice = isPermissionlessListing && walletAddress && !(permissionlessAcknowledgedKeys ?? []).includes(
         `${walletAddress}_${symbol}`
       );
@@ -5809,7 +5811,10 @@ var OrderEntry = (props) => {
       }
       return true;
     }).then(() => {
-      return submit({ resetOnSuccess: false }).then((result) => {
+      return submit({
+        resetOnSuccess: false,
+        usdcBorrowLimit
+      }).then((result) => {
         if (!result.success && result.message) {
           toast.error(result.message);
         } else if (result.success && isScaledOrder) {
@@ -5820,6 +5825,17 @@ var OrderEntry = (props) => {
         }
       });
     }).catch((error) => {
+      if (error instanceof USDCBorrowLimitExceededError) {
+        modal.alert({
+          title: t("orderEntry.usdcBorrowLimit.title"),
+          message: t("orderEntry.usdcBorrowLimit.content", {
+            limit: new Intl.NumberFormat("en-US", {
+              maximumFractionDigits: 8
+            }).format(error.borrowLimit)
+          })
+        });
+        return;
+      }
       if (error?.message) {
         toast.error(error.message);
       }
@@ -6610,6 +6626,8 @@ var useOrderEntryScript = (inputs) => {
     }
   }, [isSymbolPostOnly, formattedOrder.order_type, setOrderValues]);
   const currentLtv = useComputedLTV();
+  const { negative_usdc_threshold } = useConvertThreshold();
+  const usdcBorrowLimit = normalizeUSDCBorrowLimit(negative_usdc_threshold);
   const askAndBid = useAskAndBid();
   const fillMiddleValue = () => {
     if (bboStatus === "on" /* ON */) {
@@ -6706,6 +6724,7 @@ var useOrderEntryScript = (inputs) => {
     onBBOChange,
     toggleBBO,
     currentLtv,
+    usdcBorrowLimit,
     fillMiddleValue,
     symbol,
     soundAlert,