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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,9 +1,9 @@
1
1
  'use strict';
2
2
 
3
+ var React = require('react');
3
4
  var net = require('@orderly.network/net');
4
5
  var useSWR5 = require('swr');
5
6
  var types = require('@orderly.network/types');
6
- var React = require('react');
7
7
  var utils = require('@orderly.network/utils');
8
8
  var useSWRMutation = require('swr/mutation');
9
9
  var useConstant = require('use-constant');
@@ -46,8 +46,8 @@ function _interopNamespace(e) {
46
46
  return Object.freeze(n);
47
47
  }
48
48
 
49
- var useSWR5__namespace = /*#__PURE__*/_interopNamespace(useSWR5);
50
49
  var React__default = /*#__PURE__*/_interopDefault(React);
50
+ var useSWR5__namespace = /*#__PURE__*/_interopNamespace(useSWR5);
51
51
  var useSWRMutation__default = /*#__PURE__*/_interopDefault(useSWRMutation);
52
52
  var useConstant__default = /*#__PURE__*/_interopDefault(useConstant);
53
53
  var useSWRInfinite__default = /*#__PURE__*/_interopDefault(useSWRInfinite);
@@ -60,13 +60,24 @@ var __export = (target, all) => {
60
60
  for (var name in all)
61
61
  __defProp(target, name, { get: all[name], enumerable: true });
62
62
  };
63
+ var MarketCategoriesConfigContext = React.createContext(void 0);
64
+ var MarketCategoriesConfigProvider = ({ value, children }) => {
65
+ return React.createElement(
66
+ MarketCategoriesConfigContext.Provider,
67
+ { value },
68
+ children
69
+ );
70
+ };
71
+ function useMarketCategoriesConfig() {
72
+ return React.useContext(MarketCategoriesConfigContext);
73
+ }
63
74
 
64
75
  // src/version.ts
65
76
  if (typeof window !== "undefined") {
66
77
  window.__ORDERLY_VERSION__ = window.__ORDERLY_VERSION__ || {};
67
- window.__ORDERLY_VERSION__["@orderly.network/hooks"] = "2.11.3-rc.0";
78
+ window.__ORDERLY_VERSION__["@orderly.network/hooks"] = "2.12.0-alpha.0";
68
79
  }
69
- var version_default = "2.11.3-rc.0";
80
+ var version_default = "2.12.0-alpha.0";
70
81
  var fetcher = (url, init2 = {}, queryOptions) => net.get(url, init2, queryOptions?.formatter);
71
82
  var noCacheConfig = {
72
83
  dedupingInterval: 0,
@@ -2602,16 +2613,12 @@ var createDataStore = (config) => {
2602
2613
  const brokerIdQuery = typeof options?.brokerId === "string" && options?.brokerId !== "orderly" ? `?broker_id=${options?.brokerId}` : "";
2603
2614
  const url = `${dynamicBaseUrl || baseUrl || ""}${endpoint}${brokerIdQuery}`;
2604
2615
  const data = await fetcher(url, {}, { formatter });
2605
- const dataWithBrokerId = data.map((item) => ({
2606
- ...item,
2607
- broker_id: options?.brokerId
2608
- }));
2609
2616
  set({
2610
- data: dataWithBrokerId,
2617
+ data,
2611
2618
  loading: false,
2612
2619
  error: null
2613
2620
  });
2614
- return dataWithBrokerId;
2621
+ return data;
2615
2622
  } catch (error) {
2616
2623
  set({ error, loading: false });
2617
2624
  return null;
@@ -3443,6 +3450,7 @@ var MarketsType = /* @__PURE__ */ ((MarketsType2) => {
3443
3450
  MarketsType2[MarketsType2["ALL"] = 2] = "ALL";
3444
3451
  MarketsType2[MarketsType2["RWA"] = 3] = "RWA";
3445
3452
  MarketsType2[MarketsType2["NEW_LISTING"] = 4] = "NEW_LISTING";
3453
+ MarketsType2[MarketsType2["COMMUNITY"] = 5] = "COMMUNITY";
3446
3454
  return MarketsType2;
3447
3455
  })(MarketsType || {});
3448
3456
  var MarketsStorageKey = "orderly_markets";
@@ -3612,6 +3620,8 @@ var addFieldToMarkets = (futures, symbolsInfo, rwaSymbolsInfo) => {
3612
3620
  const rwaInfo = !rwaSymbolsInfo.isNil ? rwaSymbolsInfo[item.symbol]() : null;
3613
3621
  return {
3614
3622
  ...item,
3623
+ broker_id: item.broker_id,
3624
+ display_symbol_name: item.display_symbol_name,
3615
3625
  quote_dp: info("quote_dp"),
3616
3626
  created_time: info("created_time"),
3617
3627
  displayName: info("displayName"),
@@ -3633,7 +3643,7 @@ var addFieldToMarkets = (futures, symbolsInfo, rwaSymbolsInfo) => {
3633
3643
  var filterMarkets = (params) => {
3634
3644
  const { markets, favorites, recent, newListing, type } = params;
3635
3645
  let curData = [];
3636
- if (type === 2 /* ALL */) {
3646
+ if (type === 2 /* ALL */ || type === 5 /* COMMUNITY */) {
3637
3647
  curData = markets;
3638
3648
  } else if (type === 3 /* RWA */) {
3639
3649
  curData = markets.filter((item) => item.isRwa);
@@ -4555,7 +4565,7 @@ var useMarket = (type) => {
4555
4565
  const getData = (type2) => {
4556
4566
  const localData = type2 === 0 /* FAVORITES */ ? [...favorites] : [...recent];
4557
4567
  const keys = localData.map((item) => item.name);
4558
- const filter = type2 == 2 /* ALL */ ? marketsList : marketsList?.filter((item) => keys.includes(item.symbol));
4568
+ const filter = type2 == 2 /* ALL */ || type2 == 4 /* COMMUNITY */ ? marketsList : marketsList?.filter((item) => keys.includes(item.symbol));
4559
4569
  const favoritesData = [...favorites];
4560
4570
  const favoriteKeys = favoritesData.map((item) => item.name);
4561
4571
  if (filter) {
@@ -4754,6 +4764,80 @@ var useSymbolLeverageMap = () => {
4754
4764
  refresh: mutate6
4755
4765
  };
4756
4766
  };
4767
+
4768
+ // src/trading-rewards/useAllBrokers.ts
4769
+ var useAllBrokers = () => {
4770
+ const { data } = useQuery("/v1/public/broker/name", {
4771
+ formatter: (res) => {
4772
+ const { rows } = res;
4773
+ return rows?.map((item) => ({ [item.broker_id]: item.broker_name })).reduce((acc, curr) => ({ ...acc, ...curr }), {});
4774
+ },
4775
+ revalidateOnFocus: false
4776
+ });
4777
+ return [data];
4778
+ };
4779
+
4780
+ // src/useBadgeBySymbol.ts
4781
+ function brokerNameBaseFromRaw(rawBrokerName) {
4782
+ if (!rawBrokerName) return void 0;
4783
+ const first = rawBrokerName.trim().split(/[ _-]/, 1)[0]?.trim() ?? "";
4784
+ return first.length > 0 ? first : void 0;
4785
+ }
4786
+ var useBadgeBySymbol = (symbol) => {
4787
+ const symbolsInfo = useSymbolsInfo();
4788
+ const [brokers] = useAllBrokers();
4789
+ return React.useMemo(() => {
4790
+ if (!symbol || symbolsInfo.isNil) {
4791
+ return {
4792
+ displayName: symbol ?? "",
4793
+ brokerId: void 0,
4794
+ brokerName: void 0,
4795
+ brokerNameRaw: void 0
4796
+ };
4797
+ }
4798
+ const getter = symbolsInfo[symbol];
4799
+ const info = typeof getter === "function" ? getter() : void 0;
4800
+ const displayName = info?.displayName ?? info?.display_symbol_name ?? symbol;
4801
+ const brokerId = info?.broker_id ?? void 0;
4802
+ const rawBrokerName = brokerId ? brokers?.[brokerId] : void 0;
4803
+ const base = brokerNameBaseFromRaw(rawBrokerName);
4804
+ const brokerName = base ? base.length > 7 ? `${base.slice(0, 7)}...` : base : void 0;
4805
+ return {
4806
+ displayName,
4807
+ brokerId,
4808
+ brokerName,
4809
+ brokerNameRaw: rawBrokerName
4810
+ };
4811
+ }, [brokers, symbolsInfo, symbol]);
4812
+ };
4813
+ function formatSymbolWithBroker(symbol, symbolsInfo, brokers) {
4814
+ if (!symbol) return "";
4815
+ let brokerNameBase;
4816
+ if (!symbolsInfo.isNil) {
4817
+ const getter = symbolsInfo[symbol];
4818
+ const info = typeof getter === "function" ? getter() : void 0;
4819
+ const brokerId = info?.broker_id ?? void 0;
4820
+ const rawBrokerName = brokerId ? brokers?.[brokerId] : void 0;
4821
+ brokerNameBase = brokerNameBaseFromRaw(rawBrokerName);
4822
+ }
4823
+ const parts = symbol.split("_");
4824
+ const base = parts.length >= 3 ? parts[1] ?? "" : symbol.match(/^([A-Za-z]+)/)?.[1] ?? symbol;
4825
+ const hasBrokerSuffix = symbol.includes("-") || symbol.split("_").length > 3;
4826
+ if (brokerNameBase && hasBrokerSuffix) {
4827
+ return `${base}-${brokerNameBase}`;
4828
+ }
4829
+ return base;
4830
+ }
4831
+ var useSymbolWithBroker = (symbol) => {
4832
+ const symbolsInfo = useSymbolsInfo();
4833
+ const [brokers] = useAllBrokers();
4834
+ return React.useMemo(
4835
+ () => formatSymbolWithBroker(symbol, symbolsInfo, brokers),
4836
+ [brokers, symbolsInfo, symbol]
4837
+ );
4838
+ };
4839
+
4840
+ // src/orderly/useMarginModes.ts
4757
4841
  var useMarginModes = () => {
4758
4842
  const { data, error, isLoading, mutate: mutate6 } = usePrivateQuery("/v1/client/margin_modes", {
4759
4843
  revalidateOnFocus: false,
@@ -4795,22 +4879,28 @@ var useMarginModes = () => {
4795
4879
  };
4796
4880
  var useMarginModeBySymbol = (symbol, fallback = types.MarginMode.CROSS) => {
4797
4881
  const { marginModes, isLoading, error, refresh, updateMarginMode } = useMarginModes();
4798
- const marginMode = fallback === null ? marginModes[symbol] : marginModes[symbol] ?? fallback;
4882
+ const { brokerId } = useBadgeBySymbol(symbol);
4883
+ const marginMode = React.useMemo(() => {
4884
+ if (brokerId) return types.MarginMode.ISOLATED;
4885
+ return fallback === null ? marginModes[symbol] : marginModes[symbol] ?? fallback;
4886
+ }, [brokerId, fallback, marginModes, symbol]);
4799
4887
  const update = React.useCallback(
4800
4888
  async (mode) => {
4889
+ if (brokerId) mode = types.MarginMode.ISOLATED;
4801
4890
  return updateMarginMode({
4802
4891
  symbol_list: [symbol],
4803
4892
  default_margin_mode: mode
4804
4893
  });
4805
4894
  },
4806
- [symbol, updateMarginMode]
4895
+ [brokerId, symbol, updateMarginMode]
4807
4896
  );
4808
4897
  return {
4809
4898
  marginMode,
4810
4899
  isLoading,
4811
4900
  error,
4812
4901
  refresh,
4813
- update
4902
+ update,
4903
+ isPermissionlessListing: !!brokerId
4814
4904
  };
4815
4905
  };
4816
4906
 
@@ -12712,6 +12802,9 @@ var DataPaint = class extends BasePaint {
12712
12802
  this.DEFAULT_LOSS_COLOR = "rgb(255,103,194)";
12713
12803
  this.transformTop = 0;
12714
12804
  this.QRCODE_SIZE = 56;
12805
+ this.BROKER_BADGE_HEIGHT = 18;
12806
+ this.BROKER_BADGE_PADDING_X = 8;
12807
+ this.BROKER_BADGE_RADIUS = 4;
12715
12808
  }
12716
12809
  formatMarginMode(marginMode) {
12717
12810
  return marginMode === types.MarginMode.ISOLATED ? "Isolated" : "Cross";
@@ -12801,6 +12894,49 @@ var DataPaint = class extends BasePaint {
12801
12894
  fontSize: this._ratio(fontSize),
12802
12895
  fontFamily: options.fontFamily
12803
12896
  });
12897
+ const brokerName = options.data?.position.brokerName?.trim();
12898
+ if (brokerName) {
12899
+ left += (prevElementBoundingBox.width ?? 0) + this._ratio(10);
12900
+ const badgeHeight = this._ratio(this.BROKER_BADGE_HEIGHT);
12901
+ const badgePaddingX = this._ratio(this.BROKER_BADGE_PADDING_X);
12902
+ const badgeRadius = this._ratio(this.BROKER_BADGE_RADIUS);
12903
+ const badgeFontSize = this._ratio(12);
12904
+ const badgeFontWeight = 600;
12905
+ const textMetrics = this._drawText(
12906
+ brokerName,
12907
+ {
12908
+ left: 0,
12909
+ top: 0,
12910
+ fontSize: badgeFontSize,
12911
+ fontWeight: badgeFontWeight,
12912
+ fontFamily: options.fontFamily
12913
+ },
12914
+ true
12915
+ );
12916
+ const badgeWidth = (textMetrics.width ?? 0) + badgePaddingX * 2;
12917
+ const badgeTop = this._ratio(top) - badgeHeight / 2;
12918
+ this._fillRoundedRect(
12919
+ left,
12920
+ badgeTop,
12921
+ badgeWidth,
12922
+ badgeHeight,
12923
+ badgeRadius,
12924
+ "rgba(255,255,255,0.06)"
12925
+ );
12926
+ this._drawText(brokerName, {
12927
+ color: "rgba(255,255,255,0.36)",
12928
+ left: left + badgePaddingX,
12929
+ top: badgeTop + badgeHeight / 2,
12930
+ fontSize: badgeFontSize,
12931
+ fontWeight: badgeFontWeight,
12932
+ fontFamily: options.fontFamily,
12933
+ textBaseline: "middle"
12934
+ });
12935
+ prevElementBoundingBox = {
12936
+ ...prevElementBoundingBox,
12937
+ width: badgeWidth
12938
+ };
12939
+ }
12804
12940
  }
12805
12941
  const marginMode = options.data?.position.marginMode;
12806
12942
  if (marginMode) {
@@ -12848,6 +12984,20 @@ var DataPaint = class extends BasePaint {
12848
12984
  );
12849
12985
  }
12850
12986
  }
12987
+ _fillRoundedRect(x, y, width, height, radius, color) {
12988
+ const r = Math.min(radius, width / 2, height / 2);
12989
+ this.ctx.save();
12990
+ this.ctx.fillStyle = color;
12991
+ this.ctx.beginPath();
12992
+ this.ctx.moveTo(x + r, y);
12993
+ this.ctx.arcTo(x + width, y, x + width, y + height, r);
12994
+ this.ctx.arcTo(x + width, y + height, x, y + height, r);
12995
+ this.ctx.arcTo(x, y + height, x, y, r);
12996
+ this.ctx.arcTo(x, y, x + width, y, r);
12997
+ this.ctx.closePath();
12998
+ this.ctx.fill();
12999
+ this.ctx.restore();
13000
+ }
12851
13001
  drawUnrealizedPnL(options, offsetTop = 0) {
12852
13002
  const layout = ramda.path(
12853
13003
  ["layout", "unrealizedPnl"],
@@ -13301,18 +13451,6 @@ var useEpochInfo = (type) => {
13301
13451
  }, [epochInfo]);
13302
13452
  return [epochInfo, { isLoading, curEpochInfo, isNotStared, refresh }];
13303
13453
  };
13304
-
13305
- // src/trading-rewards/useAllBrokers.ts
13306
- var useAllBrokers = () => {
13307
- const { data } = useQuery("/v1/public/broker/name", {
13308
- formatter: (res) => {
13309
- const { rows } = res;
13310
- return rows?.map((item) => ({ [item.broker_id]: item.broker_name })).reduce((acc, curr) => ({ ...acc, ...curr }), {});
13311
- },
13312
- revalidateOnFocus: false
13313
- });
13314
- return [data];
13315
- };
13316
13454
  var useCurEpochEstimate = (type) => {
13317
13455
  const [data, setData] = React.useState(void 0);
13318
13456
  const { account: account9 } = useAccount();
@@ -18668,6 +18806,19 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
18668
18806
  orderEntryActions.updateOrder(newValues);
18669
18807
  return newValues;
18670
18808
  };
18809
+ const setValuesRaw = (values) => {
18810
+ if (!symbolInfo) {
18811
+ orderEntryActions.updateOrder(values);
18812
+ return;
18813
+ }
18814
+ const currentEntry = useOrderStore.getState().entry;
18815
+ const newValues = {
18816
+ ...currentEntry,
18817
+ ...values
18818
+ };
18819
+ orderEntryActions.updateOrder(newValues);
18820
+ return newValues;
18821
+ };
18671
18822
  const onMarkPriceUpdated = React.useCallback(
18672
18823
  (markPrice, baseOn = []) => {
18673
18824
  if (!options.symbolInfo) return;
@@ -18731,6 +18882,7 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
18731
18882
  formattedOrder: orderEntity,
18732
18883
  setValue,
18733
18884
  setValues,
18885
+ setValuesRaw,
18734
18886
  submit: submitOrder,
18735
18887
  reset: resetOrder,
18736
18888
  generateOrder,
@@ -18746,6 +18898,8 @@ var useOrderEntry2 = (symbol, options = {}) => {
18746
18898
  }
18747
18899
  const ee = useEventEmitter();
18748
18900
  const { track: track2 } = useTrack();
18901
+ const apiBaseUrl = useConfig("apiBaseUrl");
18902
+ const fetchSymbols = useSymbolStore((state) => state.fetchData);
18749
18903
  const [meta, setMeta] = React.useState({
18750
18904
  dirty: {},
18751
18905
  submitted: false,
@@ -18775,6 +18929,7 @@ var useOrderEntry2 = (symbol, options = {}) => {
18775
18929
  formattedOrder,
18776
18930
  setValue: setValueInternal,
18777
18931
  setValues: setValuesInternal,
18932
+ setValuesRaw: setValuesRawInternal,
18778
18933
  validate,
18779
18934
  generateOrder,
18780
18935
  reset,
@@ -18974,6 +19129,21 @@ var useOrderEntry2 = (symbol, options = {}) => {
18974
19129
  interactiveValidate(newValues);
18975
19130
  }
18976
19131
  };
19132
+ const setValuesRaw = (values) => {
19133
+ if (!Object.keys(values).every(
19134
+ (key) => canSetTPSLPrice(
19135
+ key,
19136
+ values[key],
19137
+ formattedOrder.order_type
19138
+ )
19139
+ )) {
19140
+ return;
19141
+ }
19142
+ const newValues = setValuesRawInternal(values);
19143
+ if (newValues) {
19144
+ interactiveValidate(newValues);
19145
+ }
19146
+ };
18977
19147
  async function validateFunc(order) {
18978
19148
  const creator = getOrderCreator(order);
18979
19149
  return validate(order, creator, prepareData());
@@ -19028,7 +19198,7 @@ var useOrderEntry2 = (symbol, options = {}) => {
19028
19198
  markPrice: markPrice2,
19029
19199
  totalCollateral,
19030
19200
  futures_taker_fee_rate: accountInfo.futures_taker_fee_rate,
19031
- imr_factor: accountInfo.imr_factor[symbol],
19201
+ imr_factor: accountInfo.imr_factor?.[symbol] ?? 0,
19032
19202
  symbol,
19033
19203
  positions: positions3,
19034
19204
  symbolInfo,
@@ -19117,6 +19287,9 @@ var useOrderEntry2 = (symbol, options = {}) => {
19117
19287
  orders: appendOrderMetadata(order.orders, orderMetadata)
19118
19288
  } : appendOrderMetadata(order, orderMetadata);
19119
19289
  const result = await doCreateOrder(params);
19290
+ if (!result.success && (order.order_type === types.OrderType.MARKET || order.order_type === types.OrderType.STOP_MARKET)) {
19291
+ void fetchSymbols(apiBaseUrl);
19292
+ }
19120
19293
  if (result.success) {
19121
19294
  let trackParams = {
19122
19295
  side: order.side,
@@ -19183,6 +19356,7 @@ var useOrderEntry2 = (symbol, options = {}) => {
19183
19356
  freeCollateral: effectiveMarginMode === types.MarginMode.ISOLATED ? freeCollateralUSDCOnly : freeCollateral,
19184
19357
  setValue: useMemoizedFn(setValue),
19185
19358
  setValues: useMemoizedFn(setValues),
19359
+ setValuesRaw: useMemoizedFn(setValuesRaw),
19186
19360
  symbolInfo: symbolInfo || types.EMPTY_OBJECT,
19187
19361
  metaState: meta,
19188
19362
  isMutating,
@@ -19664,6 +19838,7 @@ exports.EpochStatus = EpochStatus;
19664
19838
  exports.ExtendedConfigStore = ExtendedConfigStore;
19665
19839
  exports.FlagKeys = FlagKeys;
19666
19840
  exports.MaintenanceStatus = MaintenanceStatus;
19841
+ exports.MarketCategoriesConfigProvider = MarketCategoriesConfigProvider;
19667
19842
  exports.MarketsStorageKey = MarketsStorageKey;
19668
19843
  exports.MarketsType = MarketsType;
19669
19844
  exports.ORDERLY_ORDERBOOK_DEPTH_KEY = ORDERLY_ORDERBOOK_DEPTH_KEY;
@@ -19680,6 +19855,7 @@ exports.fetcher = fetcher;
19680
19855
  exports.findPositionTPSLFromOrders = findPositionTPSLFromOrders;
19681
19856
  exports.findTPSLFromOrder = findTPSLFromOrder;
19682
19857
  exports.findTPSLOrderPriceFromOrder = findTPSLOrderPriceFromOrder;
19858
+ exports.formatSymbolWithBroker = formatSymbolWithBroker;
19683
19859
  exports.getMinNotional = getMinNotional;
19684
19860
  exports.getPriceKey = getPriceKey;
19685
19861
  exports.indexedDBManager = indexedDBManager;
@@ -19700,6 +19876,7 @@ exports.useApiKeyManager = useApiKeyManager;
19700
19876
  exports.useAppStore = useAppStore;
19701
19877
  exports.useAssetsHistory = useAssetsHistory;
19702
19878
  exports.useAudioPlayer = useAudioPlayer;
19879
+ exports.useBadgeBySymbol = useBadgeBySymbol;
19703
19880
  exports.useBalanceSubscription = useBalanceSubscription;
19704
19881
  exports.useBalanceTopic = useBalanceTopic;
19705
19882
  exports.useBoolean = useBoolean;
@@ -19758,6 +19935,7 @@ exports.useMarkPrice = useMarkPrice;
19758
19935
  exports.useMarkPriceBySymbol = useMarkPriceBySymbol;
19759
19936
  exports.useMarkPricesStream = useMarkPricesStream;
19760
19937
  exports.useMarket = useMarket;
19938
+ exports.useMarketCategoriesConfig = useMarketCategoriesConfig;
19761
19939
  exports.useMarketList = useMarketList;
19762
19940
  exports.useMarketMap = useMarketMap;
19763
19941
  exports.useMarketTradeStream = useMarketTradeStream;
@@ -19815,6 +19993,7 @@ exports.useSymbolInfo = useSymbolInfo;
19815
19993
  exports.useSymbolLeverage = useSymbolLeverage;
19816
19994
  exports.useSymbolLeverageMap = useSymbolLeverageMap;
19817
19995
  exports.useSymbolPriceRange = useSymbolPriceRange;
19996
+ exports.useSymbolWithBroker = useSymbolWithBroker;
19818
19997
  exports.useSymbolsInfo = useSymbolsInfo;
19819
19998
  exports.useSymbolsInfoStore = useSymbolsInfoStore;
19820
19999
  exports.useTPSLOrder = useTPSLOrder;