@orderly.network/ui-positions 2.11.1 → 2.11.2

package/dist/index.js

@@ -1593,16 +1593,19 @@ var RwaStatusTag = ({ symbol }) => {
     return null;
   }
   return /* @__PURE__ */ jsxRuntime.jsx(
-    ui.Flex,
+    ui.Tips,
     {
-      r: "base",
-      px: 2,
-      height: 18,
-      className: ui.cn(
-        "oui-shrink-0",
-        open ? "oui-bg-success/15" : "oui-bg-danger/15"
-      ),
-      children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "2xs", color: open ? "success" : "danger", children: open ? t("trading.rwa.marketHours") : t("trading.rwa.outsideMarketHours") })
+      title: t("common.tips"),
+      content: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { color: open ? "success" : "danger", children: open ? t("trading.rwa.marketHours") : t("trading.rwa.outsideMarketHours") }),
+      trigger: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { p: 2, className: "oui-flex oui-cursor-pointer oui-items-center", children: /* @__PURE__ */ jsxRuntime.jsx(
+        ui.Box,
+        {
+          width: 4,
+          height: 4,
+          r: "full",
+          className: ui.cn(open ? "oui-bg-success" : "oui-bg-danger")
+        }
+      ) })
     }
   );
 };
@@ -3469,11 +3472,11 @@ var useColumn = (config) => {
         title: t("common.symbol"),
         dataIndex: "symbol",
         fixed: "left",
-        width: 200,
+        width: 176,
         onSort: (r1, r2) => {
           return r1.symbol?.localeCompare(r2.symbol || "");
         },
-        render: (value, record) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, children: [
+        render: (value, record) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, className: "oui-py-1", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             ui.Box,
             {
@@ -3485,32 +3488,32 @@ var useColumn = (config) => {
               )
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { direction: "column", itemAlign: "start", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              ui.Text.formatted,
-              {
-                formatString: "base-type",
-                className: "oui-cursor-pointer",
-                onClick: (e) => {
-                  onSymbolChange?.({ symbol: value });
-                  e.stopPropagation();
-                  e.preventDefault();
-                },
-                children: `${value.split("_")[1]}-PERP`
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 1, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { direction: "column", itemAlign: "start", gap: 1, children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 1, itemAlign: "center", children: [
               /* @__PURE__ */ jsxRuntime.jsx(
-                LeverageBadge,
+                ui.Text.formatted,
                 {
-                  symbol: value,
-                  leverage: record.leverage,
-                  modalId: uiLeverage.SymbolLeverageDialogId,
-                  marginMode: record.margin_mode
+                  formatString: "base-type",
+                  className: "oui-cursor-pointer",
+                  onClick: (e) => {
+                    onSymbolChange?.({ symbol: value });
+                    e.stopPropagation();
+                    e.preventDefault();
+                  },
+                  children: `${value.split("_")[1]}-PERP`
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsx(RwaStatusTag, { symbol: value })
-            ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { gap: 1, wrap: "wrap", children: /* @__PURE__ */ jsxRuntime.jsx(
+              LeverageBadge,
+              {
+                symbol: value,
+                leverage: record.leverage,
+                modalId: uiLeverage.SymbolLeverageDialogId,
+                marginMode: record.margin_mode
+              }
+            ) })
           ] })
         ] })
       },
@@ -3782,31 +3785,36 @@ var SymbolToken = (props) => {
   const { item } = props;
   const isBuy = item.position_qty > 0;
   const { t } = i18n.useTranslation();
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    ui.Text.formatted,
-    {
-      rule: "symbol",
-      formatString: "base-type",
-      size: "2xs",
-      suffix: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-items-center oui-gap-1", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: isBuy ? "success" : "danger", size: "xs", children: isBuy ? t("common.long") : t("common.short") }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          LeverageBadge,
-          {
-            symbol: item.symbol,
-            leverage: item.leverage,
-            modalId: uiLeverage.SymbolLeverageSheetId,
-            marginMode: item.margin_mode
-          }
-        )
-      ] }),
-      showIcon: true,
-      onClick: () => {
-        props.onSymbolChange?.({ symbol: item.symbol });
-      },
-      children: item.symbol
-    }
-  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { direction: "column", itemAlign: "start", gap: 1, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 1, itemAlign: "center", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        ui.Text.formatted,
+        {
+          rule: "symbol",
+          formatString: "base-type",
+          size: "2xs",
+          showIcon: true,
+          onClick: () => {
+            props.onSymbolChange?.({ symbol: item.symbol });
+          },
+          children: item.symbol
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(RwaStatusTag, { symbol: item.symbol })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 1, itemAlign: "center", wrap: "wrap", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: isBuy ? "success" : "danger", size: "xs", children: isBuy ? t("common.long") : t("common.short") }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        LeverageBadge,
+        {
+          symbol: item.symbol,
+          leverage: item.leverage,
+          modalId: uiLeverage.SymbolLeverageSheetId,
+          marginMode: item.margin_mode
+        }
+      )
+    ] })
+  ] });
 };
 var UnrealPnL = (props) => {
   const { item } = props;
@@ -4445,7 +4453,7 @@ var usePositionHistoryColumn = (props) => {
         title: t("common.symbol"),
         dataIndex: "symbol",
         fixed: "left",
-        width: 200,
+        width: 210,
         onSort: (r1, r2) => {
           return r1.symbol?.localeCompare(r2.symbol || "");
         },
@@ -4636,6 +4644,19 @@ var SymbolInfo2 = (props) => {
         )
       );
     }
+    if (record.margin_mode != null) {
+      list.push(
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Badge,
+          {
+            color: "neutral",
+            size: "xs",
+            children: record.margin_mode === types.MarginMode.ISOLATED ? t("marginMode.isolated") : t("marginMode.cross")
+          },
+          `margin-mode-${record.margin_mode}`
+        )
+      );
+    }
     list.push(
       /* @__PURE__ */ jsxRuntime.jsx(
         LeverageBadge2,
@@ -4648,7 +4669,7 @@ var SymbolInfo2 = (props) => {
     );
     return list;
   }, [record, t]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, height: 48, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, className: "oui-py-1", children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       ui.Box,
       {
@@ -4660,7 +4681,7 @@ var SymbolInfo2 = (props) => {
         )
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { direction: "column", itemAlign: "start", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { direction: "column", itemAlign: "start", gap: 1, children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         ui.Text.formatted,
         {
@@ -4674,7 +4695,7 @@ var SymbolInfo2 = (props) => {
           children: `${record.symbol.split("_")[1]}-PERP`
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { gap: 1, children: tags })
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { gap: 1, wrap: "wrap", children: tags })
     ] })
   ] });
 };
@@ -4786,6 +4807,15 @@ var areDatesEqual = (date1, date2) => {
 };
 
 // src/components/positionHistory/positionHistory.script.tsx
+var normalizeMarginMode = (value) => {
+  if (value === 1 || value === types.MarginMode.ISOLATED) {
+    return types.MarginMode.ISOLATED;
+  }
+  if (value === 0 || value === types.MarginMode.CROSS) {
+    return types.MarginMode.CROSS;
+  }
+  return void 0;
+};
 var usePositionHistoryScript = (props) => {
   const {
     onSymbolChange,
@@ -4805,20 +4835,16 @@ var usePositionHistoryScript = (props) => {
     symbol ? `/v1/position_history?symbol=${symbol}&limit=1000` : "/v1/position_history?limit=1000",
     {
       formatter(data2) {
-        return (data2.rows ?? null)?.map(
-          (item) => {
-            if (item.realized_pnl != null && item.accumulated_funding_fee != null && item.trading_fee != null) {
-              const netPnL = item.realized_pnl - item.accumulated_funding_fee - item.trading_fee;
-              return {
-                ...item,
-                // convert margin_mode to MarginMode
-                margin_mode: item.margin_mode === 1 || item.margin_mode === types.MarginMode.ISOLATED ? types.MarginMode.ISOLATED : types.MarginMode.CROSS,
-                netPnL
-              };
-            }
-            return item;
+        return (data2.rows ?? null)?.map((item) => {
+          const result = {
+            ...item,
+            margin_mode: normalizeMarginMode(item.margin_mode)
+          };
+          if (item.realized_pnl != null && item.accumulated_funding_fee != null && item.trading_fee != null) {
+            result.netPnL = item.realized_pnl - item.accumulated_funding_fee - item.trading_fee;
           }
-        );
+          return result;
+        });
       },
       revalidateOnFocus: true
     }
@@ -5089,8 +5115,13 @@ var PositionHistoryType = (props) => {
         )
       );
     }
+    if (record.margin_mode != null) {
+      list.push(
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { color: "neutral", size: "xs", children: record.margin_mode === types.MarginMode.ISOLATED ? t("marginMode.isolated") : t("marginMode.cross") }, `margin-${record.margin_mode}`)
+      );
+    }
     return list;
-  }, [record]);
+  }, [record, t]);
   return /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { gap: 1, children: tags });
 };
 var ClosedQty = (props) => {