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

package/dist/index.js

@@ -1,9 +1,9 @@
 'use strict';
 
+var React = require('react');
 var net = require('@orderly.network/net');
 var useSWR5 = require('swr');
 var types = require('@orderly.network/types');
-var React = require('react');
 var utils = require('@orderly.network/utils');
 var useSWRMutation = require('swr/mutation');
 var useConstant = require('use-constant');
@@ -46,8 +46,8 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var useSWR5__namespace = /*#__PURE__*/_interopNamespace(useSWR5);
 var React__default = /*#__PURE__*/_interopDefault(React);
+var useSWR5__namespace = /*#__PURE__*/_interopNamespace(useSWR5);
 var useSWRMutation__default = /*#__PURE__*/_interopDefault(useSWRMutation);
 var useConstant__default = /*#__PURE__*/_interopDefault(useConstant);
 var useSWRInfinite__default = /*#__PURE__*/_interopDefault(useSWRInfinite);
@@ -60,13 +60,24 @@ var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
+var MarketCategoriesConfigContext = React.createContext(void 0);
+var MarketCategoriesConfigProvider = ({ value, children }) => {
+  return React.createElement(
+    MarketCategoriesConfigContext.Provider,
+    { value },
+    children
+  );
+};
+function useMarketCategoriesConfig() {
+  return React.useContext(MarketCategoriesConfigContext);
+}
 
 // src/version.ts
 if (typeof window !== "undefined") {
   window.__ORDERLY_VERSION__ = window.__ORDERLY_VERSION__ || {};
-  window.__ORDERLY_VERSION__["@orderly.network/hooks"] = "2.11.3-rc.0";
+  window.__ORDERLY_VERSION__["@orderly.network/hooks"] = "2.12.0";
 }
-var version_default = "2.11.3-rc.0";
+var version_default = "2.12.0";
 var fetcher = (url, init2 = {}, queryOptions) => net.get(url, init2, queryOptions?.formatter);
 var noCacheConfig = {
   dedupingInterval: 0,
@@ -2602,16 +2613,12 @@ var createDataStore = (config) => {
               const brokerIdQuery = typeof options?.brokerId === "string" && options?.brokerId !== "orderly" ? `?broker_id=${options?.brokerId}` : "";
               const url = `${dynamicBaseUrl || baseUrl || ""}${endpoint}${brokerIdQuery}`;
               const data = await fetcher(url, {}, { formatter });
-              const dataWithBrokerId = data.map((item) => ({
-                ...item,
-                broker_id: options?.brokerId
-              }));
               set({
-                data: dataWithBrokerId,
+                data,
                 loading: false,
                 error: null
               });
-              return dataWithBrokerId;
+              return data;
             } catch (error) {
               set({ error, loading: false });
               return null;
@@ -3443,6 +3450,7 @@ var MarketsType = /* @__PURE__ */ ((MarketsType2) => {
   MarketsType2[MarketsType2["ALL"] = 2] = "ALL";
   MarketsType2[MarketsType2["RWA"] = 3] = "RWA";
   MarketsType2[MarketsType2["NEW_LISTING"] = 4] = "NEW_LISTING";
+  MarketsType2[MarketsType2["COMMUNITY"] = 5] = "COMMUNITY";
   return MarketsType2;
 })(MarketsType || {});
 var MarketsStorageKey = "orderly_markets";
@@ -3612,6 +3620,8 @@ var addFieldToMarkets = (futures, symbolsInfo, rwaSymbolsInfo) => {
     const rwaInfo = !rwaSymbolsInfo.isNil ? rwaSymbolsInfo[item.symbol]() : null;
     return {
       ...item,
+      broker_id: item.broker_id,
+      display_symbol_name: item.display_symbol_name,
       quote_dp: info("quote_dp"),
       created_time: info("created_time"),
       displayName: info("displayName"),
@@ -3633,7 +3643,7 @@ var addFieldToMarkets = (futures, symbolsInfo, rwaSymbolsInfo) => {
 var filterMarkets = (params) => {
   const { markets, favorites, recent, newListing, type } = params;
   let curData = [];
-  if (type === 2 /* ALL */) {
+  if (type === 2 /* ALL */ || type === 5 /* COMMUNITY */) {
     curData = markets;
   } else if (type === 3 /* RWA */) {
     curData = markets.filter((item) => item.isRwa);
@@ -4555,7 +4565,7 @@ var useMarket = (type) => {
   const getData = (type2) => {
     const localData = type2 === 0 /* FAVORITES */ ? [...favorites] : [...recent];
     const keys = localData.map((item) => item.name);
-    const filter = type2 == 2 /* ALL */ ? marketsList : marketsList?.filter((item) => keys.includes(item.symbol));
+    const filter = type2 == 2 /* ALL */ || type2 == 4 /* COMMUNITY */ ? marketsList : marketsList?.filter((item) => keys.includes(item.symbol));
     const favoritesData = [...favorites];
     const favoriteKeys = favoritesData.map((item) => item.name);
     if (filter) {
@@ -4754,6 +4764,80 @@ var useSymbolLeverageMap = () => {
     refresh: mutate6
   };
 };
+
+// src/trading-rewards/useAllBrokers.ts
+var useAllBrokers = () => {
+  const { data } = useQuery("/v1/public/broker/name", {
+    formatter: (res) => {
+      const { rows } = res;
+      return rows?.map((item) => ({ [item.broker_id]: item.broker_name })).reduce((acc, curr) => ({ ...acc, ...curr }), {});
+    },
+    revalidateOnFocus: false
+  });
+  return [data];
+};
+
+// src/useBadgeBySymbol.ts
+function brokerNameBaseFromRaw(rawBrokerName) {
+  if (!rawBrokerName) return void 0;
+  const first = rawBrokerName.trim().split(/[ _-]/, 1)[0]?.trim() ?? "";
+  return first.length > 0 ? first : void 0;
+}
+var useBadgeBySymbol = (symbol) => {
+  const symbolsInfo = useSymbolsInfo();
+  const [brokers] = useAllBrokers();
+  return React.useMemo(() => {
+    if (!symbol || symbolsInfo.isNil) {
+      return {
+        displayName: symbol ?? "",
+        brokerId: void 0,
+        brokerName: void 0,
+        brokerNameRaw: void 0
+      };
+    }
+    const getter = symbolsInfo[symbol];
+    const info = typeof getter === "function" ? getter() : void 0;
+    const displayName = info?.displayName ?? info?.display_symbol_name ?? symbol;
+    const brokerId = info?.broker_id ?? void 0;
+    const rawBrokerName = brokerId ? brokers?.[brokerId] : void 0;
+    const base = brokerNameBaseFromRaw(rawBrokerName);
+    const brokerName = base ? base.length > 7 ? `${base.slice(0, 7)}...` : base : void 0;
+    return {
+      displayName,
+      brokerId,
+      brokerName,
+      brokerNameRaw: rawBrokerName
+    };
+  }, [brokers, symbolsInfo, symbol]);
+};
+function formatSymbolWithBroker(symbol, symbolsInfo, brokers) {
+  if (!symbol) return "";
+  let brokerNameBase;
+  if (!symbolsInfo.isNil) {
+    const getter = symbolsInfo[symbol];
+    const info = typeof getter === "function" ? getter() : void 0;
+    const brokerId = info?.broker_id ?? void 0;
+    const rawBrokerName = brokerId ? brokers?.[brokerId] : void 0;
+    brokerNameBase = brokerNameBaseFromRaw(rawBrokerName);
+  }
+  const parts = symbol.split("_");
+  const base = parts.length >= 3 ? parts[1] ?? "" : symbol.match(/^([A-Za-z]+)/)?.[1] ?? symbol;
+  const hasBrokerSuffix = symbol.includes("-") || symbol.split("_").length > 3;
+  if (brokerNameBase && hasBrokerSuffix) {
+    return `${base}-${brokerNameBase}`;
+  }
+  return base;
+}
+var useSymbolWithBroker = (symbol) => {
+  const symbolsInfo = useSymbolsInfo();
+  const [brokers] = useAllBrokers();
+  return React.useMemo(
+    () => formatSymbolWithBroker(symbol, symbolsInfo, brokers),
+    [brokers, symbolsInfo, symbol]
+  );
+};
+
+// src/orderly/useMarginModes.ts
 var useMarginModes = () => {
   const { data, error, isLoading, mutate: mutate6 } = usePrivateQuery("/v1/client/margin_modes", {
     revalidateOnFocus: false,
@@ -4795,22 +4879,28 @@ var useMarginModes = () => {
 };
 var useMarginModeBySymbol = (symbol, fallback = types.MarginMode.CROSS) => {
   const { marginModes, isLoading, error, refresh, updateMarginMode } = useMarginModes();
-  const marginMode = fallback === null ? marginModes[symbol] : marginModes[symbol] ?? fallback;
+  const { brokerId } = useBadgeBySymbol(symbol);
+  const marginMode = React.useMemo(() => {
+    if (brokerId) return types.MarginMode.ISOLATED;
+    return fallback === null ? marginModes[symbol] : marginModes[symbol] ?? fallback;
+  }, [brokerId, fallback, marginModes, symbol]);
   const update = React.useCallback(
     async (mode) => {
+      if (brokerId) mode = types.MarginMode.ISOLATED;
       return updateMarginMode({
         symbol_list: [symbol],
         default_margin_mode: mode
       });
     },
-    [symbol, updateMarginMode]
+    [brokerId, symbol, updateMarginMode]
   );
   return {
     marginMode,
     isLoading,
     error,
     refresh,
-    update
+    update,
+    isPermissionlessListing: !!brokerId
   };
 };
 
@@ -12712,6 +12802,9 @@ var DataPaint = class extends BasePaint {
     this.DEFAULT_LOSS_COLOR = "rgb(255,103,194)";
     this.transformTop = 0;
     this.QRCODE_SIZE = 56;
+    this.BROKER_BADGE_HEIGHT = 18;
+    this.BROKER_BADGE_PADDING_X = 8;
+    this.BROKER_BADGE_RADIUS = 4;
   }
   formatMarginMode(marginMode) {
     return marginMode === types.MarginMode.ISOLATED ? "Isolated" : "Cross";
@@ -12801,6 +12894,49 @@ var DataPaint = class extends BasePaint {
         fontSize: this._ratio(fontSize),
         fontFamily: options.fontFamily
       });
+      const brokerName = options.data?.position.brokerName?.trim();
+      if (brokerName) {
+        left += (prevElementBoundingBox.width ?? 0) + this._ratio(10);
+        const badgeHeight = this._ratio(this.BROKER_BADGE_HEIGHT);
+        const badgePaddingX = this._ratio(this.BROKER_BADGE_PADDING_X);
+        const badgeRadius = this._ratio(this.BROKER_BADGE_RADIUS);
+        const badgeFontSize = this._ratio(12);
+        const badgeFontWeight = 600;
+        const textMetrics = this._drawText(
+          brokerName,
+          {
+            left: 0,
+            top: 0,
+            fontSize: badgeFontSize,
+            fontWeight: badgeFontWeight,
+            fontFamily: options.fontFamily
+          },
+          true
+        );
+        const badgeWidth = (textMetrics.width ?? 0) + badgePaddingX * 2;
+        const badgeTop = this._ratio(top) - badgeHeight / 2;
+        this._fillRoundedRect(
+          left,
+          badgeTop,
+          badgeWidth,
+          badgeHeight,
+          badgeRadius,
+          "rgba(255,255,255,0.06)"
+        );
+        this._drawText(brokerName, {
+          color: "rgba(255,255,255,0.36)",
+          left: left + badgePaddingX,
+          top: badgeTop + badgeHeight / 2,
+          fontSize: badgeFontSize,
+          fontWeight: badgeFontWeight,
+          fontFamily: options.fontFamily,
+          textBaseline: "middle"
+        });
+        prevElementBoundingBox = {
+          ...prevElementBoundingBox,
+          width: badgeWidth
+        };
+      }
     }
     const marginMode = options.data?.position.marginMode;
     if (marginMode) {
@@ -12848,6 +12984,20 @@ var DataPaint = class extends BasePaint {
       );
     }
   }
+  _fillRoundedRect(x, y, width, height, radius, color) {
+    const r = Math.min(radius, width / 2, height / 2);
+    this.ctx.save();
+    this.ctx.fillStyle = color;
+    this.ctx.beginPath();
+    this.ctx.moveTo(x + r, y);
+    this.ctx.arcTo(x + width, y, x + width, y + height, r);
+    this.ctx.arcTo(x + width, y + height, x, y + height, r);
+    this.ctx.arcTo(x, y + height, x, y, r);
+    this.ctx.arcTo(x, y, x + width, y, r);
+    this.ctx.closePath();
+    this.ctx.fill();
+    this.ctx.restore();
+  }
   drawUnrealizedPnL(options, offsetTop = 0) {
     const layout = ramda.path(
       ["layout", "unrealizedPnl"],
@@ -13301,18 +13451,6 @@ var useEpochInfo = (type) => {
   }, [epochInfo]);
   return [epochInfo, { isLoading, curEpochInfo, isNotStared, refresh }];
 };
-
-// src/trading-rewards/useAllBrokers.ts
-var useAllBrokers = () => {
-  const { data } = useQuery("/v1/public/broker/name", {
-    formatter: (res) => {
-      const { rows } = res;
-      return rows?.map((item) => ({ [item.broker_id]: item.broker_name })).reduce((acc, curr) => ({ ...acc, ...curr }), {});
-    },
-    revalidateOnFocus: false
-  });
-  return [data];
-};
 var useCurEpochEstimate = (type) => {
   const [data, setData] = React.useState(void 0);
   const { account: account9 } = useAccount();
@@ -18668,6 +18806,19 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
     orderEntryActions.updateOrder(newValues);
     return newValues;
   };
+  const setValuesRaw = (values) => {
+    if (!symbolInfo) {
+      orderEntryActions.updateOrder(values);
+      return;
+    }
+    const currentEntry = useOrderStore.getState().entry;
+    const newValues = {
+      ...currentEntry,
+      ...values
+    };
+    orderEntryActions.updateOrder(newValues);
+    return newValues;
+  };
   const onMarkPriceUpdated = React.useCallback(
     (markPrice, baseOn = []) => {
       if (!options.symbolInfo) return;
@@ -18731,6 +18882,7 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
     formattedOrder: orderEntity,
     setValue,
     setValues,
+    setValuesRaw,
     submit: submitOrder,
     reset: resetOrder,
     generateOrder,
@@ -18746,6 +18898,8 @@ var useOrderEntry2 = (symbol, options = {}) => {
   }
   const ee = useEventEmitter();
   const { track: track2 } = useTrack();
+  const apiBaseUrl = useConfig("apiBaseUrl");
+  const fetchSymbols = useSymbolStore((state) => state.fetchData);
   const [meta, setMeta] = React.useState({
     dirty: {},
     submitted: false,
@@ -18775,6 +18929,7 @@ var useOrderEntry2 = (symbol, options = {}) => {
     formattedOrder,
     setValue: setValueInternal,
     setValues: setValuesInternal,
+    setValuesRaw: setValuesRawInternal,
     validate,
     generateOrder,
     reset,
@@ -18974,6 +19129,21 @@ var useOrderEntry2 = (symbol, options = {}) => {
       interactiveValidate(newValues);
     }
   };
+  const setValuesRaw = (values) => {
+    if (!Object.keys(values).every(
+      (key) => canSetTPSLPrice(
+        key,
+        values[key],
+        formattedOrder.order_type
+      )
+    )) {
+      return;
+    }
+    const newValues = setValuesRawInternal(values);
+    if (newValues) {
+      interactiveValidate(newValues);
+    }
+  };
   async function validateFunc(order) {
     const creator = getOrderCreator(order);
     return validate(order, creator, prepareData());
@@ -19028,7 +19198,7 @@ var useOrderEntry2 = (symbol, options = {}) => {
       markPrice: markPrice2,
       totalCollateral,
       futures_taker_fee_rate: accountInfo.futures_taker_fee_rate,
-      imr_factor: accountInfo.imr_factor[symbol],
+      imr_factor: accountInfo.imr_factor?.[symbol] ?? 0,
       symbol,
       positions: positions3,
       symbolInfo,
@@ -19117,6 +19287,9 @@ var useOrderEntry2 = (symbol, options = {}) => {
       orders: appendOrderMetadata(order.orders, orderMetadata)
     } : appendOrderMetadata(order, orderMetadata);
     const result = await doCreateOrder(params);
+    if (!result.success && (order.order_type === types.OrderType.MARKET || order.order_type === types.OrderType.STOP_MARKET)) {
+      void fetchSymbols(apiBaseUrl);
+    }
     if (result.success) {
       let trackParams = {
         side: order.side,
@@ -19183,6 +19356,7 @@ var useOrderEntry2 = (symbol, options = {}) => {
     freeCollateral: effectiveMarginMode === types.MarginMode.ISOLATED ? freeCollateralUSDCOnly : freeCollateral,
     setValue: useMemoizedFn(setValue),
     setValues: useMemoizedFn(setValues),
+    setValuesRaw: useMemoizedFn(setValuesRaw),
     symbolInfo: symbolInfo || types.EMPTY_OBJECT,
     metaState: meta,
     isMutating,
@@ -19664,6 +19838,7 @@ exports.EpochStatus = EpochStatus;
 exports.ExtendedConfigStore = ExtendedConfigStore;
 exports.FlagKeys = FlagKeys;
 exports.MaintenanceStatus = MaintenanceStatus;
+exports.MarketCategoriesConfigProvider = MarketCategoriesConfigProvider;
 exports.MarketsStorageKey = MarketsStorageKey;
 exports.MarketsType = MarketsType;
 exports.ORDERLY_ORDERBOOK_DEPTH_KEY = ORDERLY_ORDERBOOK_DEPTH_KEY;
@@ -19680,6 +19855,7 @@ exports.fetcher = fetcher;
 exports.findPositionTPSLFromOrders = findPositionTPSLFromOrders;
 exports.findTPSLFromOrder = findTPSLFromOrder;
 exports.findTPSLOrderPriceFromOrder = findTPSLOrderPriceFromOrder;
+exports.formatSymbolWithBroker = formatSymbolWithBroker;
 exports.getMinNotional = getMinNotional;
 exports.getPriceKey = getPriceKey;
 exports.indexedDBManager = indexedDBManager;
@@ -19700,6 +19876,7 @@ exports.useApiKeyManager = useApiKeyManager;
 exports.useAppStore = useAppStore;
 exports.useAssetsHistory = useAssetsHistory;
 exports.useAudioPlayer = useAudioPlayer;
+exports.useBadgeBySymbol = useBadgeBySymbol;
 exports.useBalanceSubscription = useBalanceSubscription;
 exports.useBalanceTopic = useBalanceTopic;
 exports.useBoolean = useBoolean;
@@ -19758,6 +19935,7 @@ exports.useMarkPrice = useMarkPrice;
 exports.useMarkPriceBySymbol = useMarkPriceBySymbol;
 exports.useMarkPricesStream = useMarkPricesStream;
 exports.useMarket = useMarket;
+exports.useMarketCategoriesConfig = useMarketCategoriesConfig;
 exports.useMarketList = useMarketList;
 exports.useMarketMap = useMarketMap;
 exports.useMarketTradeStream = useMarketTradeStream;
@@ -19815,6 +19993,7 @@ exports.useSymbolInfo = useSymbolInfo;
 exports.useSymbolLeverage = useSymbolLeverage;
 exports.useSymbolLeverageMap = useSymbolLeverageMap;
 exports.useSymbolPriceRange = useSymbolPriceRange;
+exports.useSymbolWithBroker = useSymbolWithBroker;
 exports.useSymbolsInfo = useSymbolsInfo;
 exports.useSymbolsInfoStore = useSymbolsInfoStore;
 exports.useTPSLOrder = useTPSLOrder;