@orderly.network/ui-tpsl 2.8.8 → 2.8.9

package/dist/index.d.mts

@@ -171,7 +171,7 @@ declare const useTPSLBuilder: (options: TPSLBuilderOptions$1 & PropsWithTriggerP
         readonly isCreateMutating: boolean;
         readonly isUpdateMutating: boolean;
     };
-    readonly position: API.PositionTPSLExt | undefined;
+    readonly position: API.Position | undefined;
     readonly setValues: (values: Partial<ComputedAlgoOrder>) => void;
 };
 type TPSLBuilderState = ReturnType<typeof useTPSLBuilder>;

package/dist/index.d.ts

@@ -171,7 +171,7 @@ declare const useTPSLBuilder: (options: TPSLBuilderOptions$1 & PropsWithTriggerP
         readonly isCreateMutating: boolean;
         readonly isUpdateMutating: boolean;
     };
-    readonly position: API.PositionTPSLExt | undefined;
+    readonly position: API.Position | undefined;
     readonly setValues: (values: Partial<ComputedAlgoOrder>) => void;
 };
 type TPSLBuilderState = ReturnType<typeof useTPSLBuilder>;

package/dist/index.js

@@ -1,10 +1,10 @@
 'use strict';
 
-var hooks = require('@orderly.network/hooks');
-var i18n = require('@orderly.network/i18n');
 var types = require('@orderly.network/types');
 var ui = require('@orderly.network/ui');
 var react = require('react');
+var hooks = require('@orderly.network/hooks');
+var i18n = require('@orderly.network/i18n');
 var reactApp = require('@orderly.network/react-app');
 var jsxRuntime = require('react/jsx-runtime');
 var utils = require('@orderly.network/utils');
@@ -907,6 +907,7 @@ var TPSL = (props) => {
     props.slPriceError
   );
   const isSlPriceWarning = props.slPriceError?.sl_trigger_price?.type === hooks.ERROR_MSG_CODES.SL_PRICE_WARNING;
+  const isSlPriceError = props.slPriceError?.sl_trigger_price?.type === hooks.ERROR_MSG_CODES.SL_PRICE_ERROR;
   if (!position) {
     return null;
   }
@@ -1043,7 +1044,7 @@ var TPSL = (props) => {
                   order_type: TPSL_OrderEntity.sl_order_type ?? types.OrderType.MARKET
                 },
                 hideOrderPrice: TPSL_OrderEntity.position_type === types.PositionType.FULL,
-                errors: validated ? slErrors : null,
+                errors: validated ? slErrors : isSlPriceError ? props.slPriceError : null,
                 quote_dp: symbolInfo("quote_dp"),
                 positionType: TPSL_OrderEntity.position_type ?? types.PositionType.PARTIAL,
                 disableOrderTypeSelector: isEditing,
@@ -1323,10 +1324,13 @@ var useTPSLBuilder = (options) => {
     throw new types.SDKError("order is required when isEditing is true");
   }
   const symbolInfo = hooks.useSymbolsInfo();
-  react.useRef(types.AlgoOrderRootType.TP_SL);
-  const [{ rows: positions }] = hooks.usePositionStream();
+  const { state } = hooks.useAccount();
+  const ee = hooks.useEventEmitter();
   const [needConfirm] = hooks.useLocalStorage("orderly_order_confirm", true);
-  const position = positions.find((item) => item.symbol === symbol);
+  const [{ rows: positions }] = hooks.usePositionStream();
+  const mainAccountPosition = positions.find((item) => item.symbol === symbol);
+  const isSubAccount = options.position?.account_id && options.position?.account_id !== state.mainAccountId;
+  const position = isSubAccount ? options.position : mainAccountPosition;
   const estLiqPrice = hooks.useEstLiqPriceBySymbol(symbol);
   react.useEffect(() => {
     if (!position) {
@@ -1454,6 +1458,7 @@ var useTPSLBuilder = (options) => {
         }
       }).then(
         () => {
+          ee.emit("tpsl:updateOrder", options2.position);
           return true;
         },
         () => {
@@ -1470,6 +1475,7 @@ var useTPSLBuilder = (options) => {
             accountId: position?.account_id
           });
           if (res.success) {
+            ee.emit("tpsl:updateOrder", options2.position);
             return res;
           }
           if (res.message) {
@@ -1583,8 +1589,6 @@ ui.registerSimpleDialog(TPSLDialogId, TPSLWidget, {
 });
 var PositionTPSLPopover = (props) => {
   const { position, order: order2, baseDP, quoteDP, buttonProps, isEditing } = props;
-  const [needConfirm] = hooks.useLocalStorage("orderly_order_confirm", true);
-  const { t } = i18n.useTranslation();
   const isPositionTPSL = isEditing ? order2?.algo_type === types.AlgoOrderRootType.POSITIONAL_TP_SL : void 0;
   const onEdit = () => {
     ui.modal.show(TPSLDialogId, {
@@ -1593,7 +1597,8 @@ var PositionTPSLPopover = (props) => {
       baseDP,
       quoteDP,
       positionType: isPositionTPSL ? types.PositionType.FULL : types.PositionType.PARTIAL,
-      isEditing
+      isEditing,
+      position
     });
   };
   return /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { onClick: onEdit, className: "oui-cursor-pointer", children: props.children || /* @__PURE__ */ jsxRuntime.jsx(
@@ -1625,6 +1630,7 @@ var TPSLAdvancedUI = (props) => {
   const { errors, validated } = props.metaState;
   const { getErrorMsg } = reactApp.useOrderEntryFormErrorMsg(props.slPriceError);
   const isSlPriceWarning = props.slPriceError?.sl_trigger_price?.type === hooks.ERROR_MSG_CODES.SL_PRICE_WARNING;
+  const isSlPriceError = props.slPriceError?.sl_trigger_price?.type === hooks.ERROR_MSG_CODES.SL_PRICE_ERROR;
   const {
     formattedOrder,
     setValue: setOrderValue,
@@ -1801,7 +1807,7 @@ var TPSLAdvancedUI = (props) => {
               side: formattedOrder.side,
               values: slValues,
               hideOrderPrice: formattedOrder.position_type === types.PositionType.FULL,
-              errors: validated ? errors : null,
+              errors: validated ? errors : isSlPriceError ? props.slPriceError : null,
               inputWarnNode: isSlPriceWarning && /* @__PURE__ */ jsxRuntime.jsx(
                 ui.DotStatus,
                 {
@@ -1957,13 +1963,18 @@ var useTPSLDetail = (props) => {
   const { position } = props;
   const symbol = position.symbol;
   const symbolInfo = hooks.useSymbolsInfo()[symbol];
+  const ee = hooks.useEventEmitter();
+  const { state } = hooks.useAccount();
   const { isMobile } = ui.useScreen();
-  const { t } = i18n.useTranslation();
   const [fullPositionOrders, setFullPositionOrders] = react.useState(
     []
   );
   const [partialPositionOrders, setPartialPositionOrders] = react.useState([]);
-  const [tpslOrders, { cancelAlgoOrder, cancelPostionOrdersByTypes, refresh }] = hooks.useOrderStream(
+  const isSubAccount = position.account_id && position.account_id !== state.mainAccountId;
+  const [
+    mainAccountTpslOrders,
+    { cancelAlgoOrder, cancelPostionOrdersByTypes }
+  ] = hooks.useOrderStream(
     {
       symbol: position.symbol,
       status: types.OrderStatus.INCOMPLETE,
@@ -1974,10 +1985,46 @@ var useTPSLDetail = (props) => {
       keeplive: true
     }
   );
+  const [
+    subAccountTpslOrders,
+    {
+      cancelAlgoOrder: cancelSubAccountAlgoOrder,
+      cancelPostionOrdersByTypes: cancelSubAccountPostionOrdersByTypes,
+      refresh: refreshSubAccountTpslOrders
+    }
+  ] = hooks.useSubAccountAlgoOrderStream(
+    {
+      symbol: position.symbol,
+      status: types.OrderStatus.INCOMPLETE,
+      includes: [types.AlgoOrderRootType.POSITIONAL_TP_SL, types.AlgoOrderRootType.TP_SL],
+      size: 100
+    },
+    {
+      accountId: position.account_id
+    }
+  );
+  const tpslOrders = isSubAccount ? subAccountTpslOrders : mainAccountTpslOrders;
   const onCancelOrder = async (order2) => {
+    if (isSubAccount) {
+      const res = await cancelSubAccountAlgoOrder(
+        order2.algo_order_id,
+        order2.symbol
+      );
+      refreshSubAccountTpslOrders();
+      ee.emit("tpsl:updateOrder", position);
+      return res;
+    }
     return await cancelAlgoOrder(order2.algo_order_id, order2.symbol);
   };
   const onCancelAllTPSLOrders = async () => {
+    if (isSubAccount) {
+      const res = await cancelSubAccountPostionOrdersByTypes(symbol, [
+        types.AlgoOrderRootType.TP_SL
+      ]);
+      refreshSubAccountTpslOrders();
+      ee.emit("tpsl:updateOrder", position);
+      return res;
+    }
     return await cancelPostionOrdersByTypes(symbol, [types.AlgoOrderRootType.TP_SL]);
   };
   const showTPSLDialog = ({
@@ -1989,6 +2036,7 @@ var useTPSLDetail = (props) => {
     ui.modal.show(dialogId, {
       order: order2,
       symbol: position.symbol,
+      position,
       positionType,
       isEditing
     });
@@ -3351,6 +3399,7 @@ var EditBracketOrderUI = (props) => {
   const { errors, validated } = props.metaState;
   const { isMobile } = ui.useScreen();
   const isSlPriceWarning = props.slPriceError?.sl_trigger_price?.type === hooks.ERROR_MSG_CODES.SL_PRICE_WARNING;
+  const isSlPriceError = props.slPriceError?.sl_trigger_price?.type === hooks.ERROR_MSG_CODES.SL_PRICE_ERROR;
   const { getErrorMsg } = reactApp.useOrderEntryFormErrorMsg(props.slPriceError);
   const {
     formattedOrder,
@@ -3501,7 +3550,7 @@ var EditBracketOrderUI = (props) => {
                       label: getErrorMsg("sl_trigger_price")
                     }
                   ),
-                  errors: validated ? errors : null,
+                  errors: validated ? errors : isSlPriceError ? props.slPriceError : null,
                   quote_dp: symbolInfo.quote_dp,
                   positionType: formattedOrder.position_type ?? types.PositionType.PARTIAL,
                   onChange: (key, value) => {