@orderly.network/trading 2.11.3-rc.0 → 2.12.0

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { useAccount, useLocalStorage, useConfig, useWalletConnector, useMutation, useChains, useReferralInfo, useCurEpochEstimate, TWType, useEpochInfo, usePositionStream, useOrderStream, useFundingDetails, useFundingRateBySymbol, useFundingRate, useSymbolsInfo, useOrderbookStream, useEventEmitter, useCollateral, useMarginRatio, useLeverage, useDebouncedCallback, useMediaQuery, useAssetsHistory, useGetRwaSymbolInfo, useGetRwaSymbolOpenStatus, useGetRwaSymbolCloseTimeInterval, useMarketTradeStream, useAccountInstance, useComputedLTV, useTickerStream } from '@orderly.network/hooks';
+import { useAccount, useLocalStorage, useConfig, useWalletConnector, useMutation, useChains, useReferralInfo, useCurEpochEstimate, TWType, useEpochInfo, usePositionStream, useOrderStream, useFundingDetails, useFundingRateBySymbol, useFundingRate, useSymbolsInfo, useOrderbookStream, useEventEmitter, useCollateral, useMarginRatio, useLeverage, useDebouncedCallback, useMediaQuery, useAssetsHistory, useGetRwaSymbolInfo, useBadgeBySymbol, useGetRwaSymbolOpenStatus, useGetRwaSymbolCloseTimeInterval, useMarketTradeStream, useAccountInstance, useComputedLTV, useTickerStream } from '@orderly.network/hooks';
 import React12, { forwardRef, useMemo, createContext, useContext, useState, useCallback, useEffect, useRef, createElement } from 'react';
 import { useDataTap, useAppContext } from '@orderly.network/react-app';
 import { AccountStatusEnum, ChainNamespace, AlgoOrderRootType, OrderStatus, OrderSide, AssetHistoryStatusEnum, AssetHistorySideEnum, TradingviewFullscreenKey, OrderEntrySortKeys, EMPTY_LIST } from '@orderly.network/types';
@@ -20,7 +20,7 @@ import { useSensors, useSensor, PointerSensor, KeyboardSensor, DndContext, close
 import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
 import { sortableKeyboardCoordinates, SortableContext, verticalListSortingStrategy, useSortable, arrayMove } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
-import { SymbolInfoBarWidget, MarketsSheetWidget, HorizontalMarketsWidget, SideMarketsWidget, SymbolInfoBarFullWidget } from '@orderly.network/markets';
+import { SymbolInfoBarWidget, SymbolInfoBarRiskNotice, MarketsSheetWidget, HorizontalMarketsWidget, SideMarketsWidget, SymbolInfoBarFullWidget } from '@orderly.network/markets';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropNames = Object.getOwnPropertyNames;
@@ -2791,14 +2791,21 @@ var init_markPrice_desktop = __esm({
         if (bids.length === 0 && asks.length === 0) {
           return 0;
         }
-        const bid1 = Number.isNaN(bids[0][0]) ? 0 : bids[0][0];
-        const index = asks.reverse().findIndex((item) => !Number.isNaN(item[0]));
-        let ask1 = 0;
+        const bidRaw = bids[0]?.[0];
+        const bid1 = bidRaw === void 0 || Number.isNaN(bidRaw) ? new Decimal(0) : new Decimal(bidRaw);
+        const asksReversed = [...asks].reverse();
+        const index = asksReversed.findIndex((item) => !Number.isNaN(item[0]));
+        let ask1 = new Decimal(0);
         if (index !== -1) {
-          ask1 = Number.isNaN(asks[index][0]) ? 0 : asks[index][0];
+          const askRaw = asksReversed[index][0];
+          ask1 = Number.isNaN(askRaw) ? new Decimal(0) : new Decimal(askRaw);
         }
-        const dValue = new Decimal(ask1).sub(bid1).div(new Decimal(ask1).add(bid1).div(2));
-        return Math.ceil(dValue.toNumber() * 1e6 + 0.1) / 1e4;
+        const mid = ask1.add(bid1).div(2);
+        if (mid.isZero()) {
+          return 0;
+        }
+        const dValue = ask1.sub(bid1).div(mid);
+        return dValue.mul(1e6).add(0.1).toDecimalPlaces(0, Decimal.ROUND_CEIL).div(1e4).toNumber();
       }, [asks, bids]);
       return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
         Tooltip,
@@ -8306,9 +8313,18 @@ var DesktopLayout4 = (props) => {
     dataListMinHeight
   } = props;
   const { showCountdown, closeCountdown } = useShowRwaCountdown(props.symbol);
+  const { brokerName } = useBadgeBySymbol(props.symbol);
   const symbolInfoBarHeight2 = useMemo(() => {
-    return showCountdown ? 104 : 56;
-  }, [showCountdown]);
+    let height = 56;
+    if (brokerName) {
+      height += 46;
+      height += 8;
+    }
+    if (showCountdown) {
+      height += 48;
+    }
+    return height;
+  }, [showCountdown, brokerName]);
   const { isRwa, open } = useGetRwaSymbolOpenStatus(props.symbol);
   useEffect(() => {
     if (isRwa && !open) {
@@ -8445,9 +8461,6 @@ var DesktopLayout4 = (props) => {
     Box,
     {
       className: "oui-trading-symbolInfoBar-container",
-      intensity: 900,
-      r: "2xl",
-      px: 3,
       width: "100%",
       style: {
         minHeight: symbolInfoBarHeight2,
@@ -9108,6 +9121,12 @@ var MaybeEqual = () => {
 var MobileLayout4 = (props) => {
   const { t } = useTranslation();
   const { isRwa, open, closeTimeInterval } = useGetRwaSymbolInfo(props.symbol);
+  const { brokerId, brokerName, brokerNameRaw, displayName } = useBadgeBySymbol(
+    props.symbol
+  );
+  const isCommunityListed = Boolean(brokerId ?? brokerName);
+  const baseFromSymbol = props.symbol?.split("_")[1] ?? props.symbol ?? "";
+  const symbolWithBroker = brokerName != null ? `${baseFromSymbol}-${brokerNameRaw}` : displayName ?? props.symbol ?? "";
   useEffect(() => {
     if (isRwa && !open) {
       showRwaOutsideMarketHoursNotify();
@@ -9201,7 +9220,17 @@ var MobileLayout4 = (props) => {
       )
     }
   );
-  const topBar = /* @__PURE__ */ jsxs(Box, { intensity: 900, className: "oui-rounded-xl", mx: 1, px: 3, py: 2, children: [
+  const topBar = /* @__PURE__ */ jsxs(Box, { children: [
+    /* @__PURE__ */ jsx(Flex, { mx: 1, children: /* @__PURE__ */ jsx(
+      SymbolInfoBarRiskNotice,
+      {
+        visible: isCommunityListed,
+        symbolWithBroker,
+        brokerName: brokerNameRaw ?? brokerName ?? "",
+        autoHeight: true,
+        className: "oui-my-1"
+      }
+    ) }),
     symbolInfoBar,
     /* @__PURE__ */ jsx(
       SimpleSheet,
@@ -9209,7 +9238,7 @@ var MobileLayout4 = (props) => {
         open: props.openMarketsSheet,
         onOpenChange: props.onOpenMarketsSheetChange,
         classNames: {
-          body: "oui-h-full oui-pb-0",
+          body: "oui-h-full oui-pb-0 ",
           content: "!oui-w-[372px] !oui-max-w-[372px] !oui-p-0"
         },
         contentProps: { side: "left", closeable: false },
@@ -9243,6 +9272,7 @@ var MobileLayout4 = (props) => {
 };
 var Trading = (props) => {
   const { isMobile } = useScreen();
+  const { t } = useTranslation();
   if (isMobile) {
     return /* @__PURE__ */ jsx(MobileLayout4, { ...props });
   }