@orderly.network/ui-positions 2.8.10-alpha.0 → 2.8.11-alpha.0

package/dist/index.js

@@ -284,8 +284,7 @@ var FundingFeeHistoryUI = ({ total, symbol, start_t, end_t }) => {
     });
   }, [setSize]);
   const flattenData = React2.useMemo(() => {
-    if (!Array.isArray(data))
-      return [];
+    if (!Array.isArray(data)) return [];
     return data.flat().map((item) => {
       return {
         ...item,
@@ -369,7 +368,7 @@ var FundingFeeLabelButton = ({ label, tooltip, size }) => {
   const { t } = i18n.useTranslation();
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-items-center oui-gap-1", children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { children: label }),
-    /* @__PURE__ */ jsxRuntime.jsx(
+    tooltip && /* @__PURE__ */ jsxRuntime.jsx(
       "button",
       {
         className: "oui-flex oui-items-center",
@@ -390,14 +389,10 @@ var FundingFeeLabelButton = ({ label, tooltip, size }) => {
     )
   ] });
 };
-var FundingFeeLabel = ({
-  label,
-  tooltip,
-  size
-}) => {
+var FundingFeeLabel = ({ label, tooltip, size }) => {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-items-center oui-gap-1", children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { children: label }),
-    /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { content: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-w-64", children: tooltip }), children: /* @__PURE__ */ jsxRuntime.jsx(
+    tooltip && /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { content: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-w-64", children: tooltip }), children: /* @__PURE__ */ jsxRuntime.jsx(
       ui.ExclamationFillIcon,
       {
         className: "oui-cursor-pointer oui-text-base-contrast-54",
@@ -419,14 +414,7 @@ var HistoryDataListView = ({ isLoading, data, loadMore }) => {
         }
       },
       {
-        title: /* @__PURE__ */ jsxRuntime.jsx(
-          FundingFeeLabel,
-          {
-            label: t("funding.fundingRate"),
-            tooltip: t("positions.fundingRate.tooltip"),
-            size: 12
-          }
-        ),
+        title: /* @__PURE__ */ jsxRuntime.jsx(FundingFeeLabel, { label: t("funding.fundingRate"), size: 12 }),
         dataIndex: "funding_rate",
         formatter: (value) => new utils.Decimal(value).mul(100).toString(),
         render: (value) => {
@@ -442,7 +430,14 @@ var HistoryDataListView = ({ isLoading, data, loadMore }) => {
         render: (value) => /* @__PURE__ */ jsxRuntime.jsx("span", { children: value })
       },
       {
-        title: `${t("funding.fundingFee")} (USDC)`,
+        title: /* @__PURE__ */ jsxRuntime.jsx(
+          FundingFeeLabel,
+          {
+            label: t("common.amount"),
+            tooltip: t("positions.fundingRate.tooltip"),
+            size: 12
+          }
+        ),
         dataIndex: "funding_fee",
         render: (value) => {
           return /* @__PURE__ */ jsxRuntime.jsx(ui.Text.numeral, { rule: "price", coloring: true, showIdentifier: true, ignoreDP: true, children: value });
@@ -488,29 +483,30 @@ var FundingFeeItem = ({ item }) => {
       /* @__PURE__ */ jsxRuntime.jsx(
         ui.Statistic,
         {
-          label: /* @__PURE__ */ jsxRuntime.jsx(
-            FundingFeeLabelButton,
-            {
-              label: t("funding.fundingRate"),
-              tooltip: t("positions.fundingRate.tooltip"),
-              size: 12
-            }
-          ),
+          label: /* @__PURE__ */ jsxRuntime.jsx(FundingFeeLabelButton, { label: t("funding.fundingRate"), size: 12 }),
           classNames: {
             label: "oui-text-2xs"
           },
           valueProps: {
             ignoreDP: true,
-            rule: "percentages",
-            className: "oui-text-xs"
+            as: "div",
+            className: "oui-text-xs",
+            suffix: "%"
           },
-          children: item.funding_rate
+          children: new utils.Decimal(item.funding_rate).mul(100).toNumber()
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(
         ui.Statistic,
         {
-          label: t("common.amount"),
+          label: /* @__PURE__ */ jsxRuntime.jsx(
+            FundingFeeLabelButton,
+            {
+              label: t("common.amount"),
+              tooltip: t("positions.fundingRate.tooltip"),
+              size: 12
+            }
+          ),
           className: "oui-items-end",
           classNames: {
             label: "oui-text-2xs"
@@ -903,12 +899,9 @@ var groupDataByAccount = (data, options) => {
 var TRADING_POSITIONS_SORT_STORAGE_KEY = "orderly_trading_positions_sort";
 var LIQ_DISTANCE_THRESHOLD = 10;
 var compareValues = (aValue, bValue) => {
-  if (aValue == null && bValue == null)
-    return 0;
-  if (aValue == null)
-    return 1;
-  if (bValue == null)
-    return -1;
+  if (aValue == null && bValue == null) return 0;
+  if (aValue == null) return 1;
+  if (bValue == null) return -1;
   const aStr = String(aValue).trim();
   const bStr = String(bValue).trim();
   const aNum = Number(aStr);
@@ -1231,42 +1224,35 @@ var useReversePositionScript = (options) => {
   });
   const rawPositionRows = reactApp.useDataTap(positionData?.rows, { fallbackData: [] });
   const unrealizedPnL = React2.useMemo(() => {
-    if (!rawPositionRows || !symbol)
-      return position?.unrealized_pnl;
+    if (!rawPositionRows || !symbol) return position?.unrealized_pnl;
     const currentPosition = rawPositionRows.find(
       (p) => p.symbol === symbol && p.position_qty !== 0
     );
     return currentPosition?.unrealized_pnl ?? position?.unrealized_pnl;
   }, [rawPositionRows, symbol]);
   const baseMin = React2.useMemo(() => {
-    if (!symbolInfo)
-      return 0;
+    if (!symbolInfo) return 0;
     return symbolInfo("base_min") || 0;
   }, [symbolInfo]);
   const baseMax = React2.useMemo(() => {
-    if (!symbolInfo)
-      return 0;
+    if (!symbolInfo) return 0;
     return symbolInfo("base_max") || 0;
   }, [symbolInfo]);
   const baseDp = React2.useMemo(() => {
-    if (!symbolInfo)
-      return 6;
+    if (!symbolInfo) return 6;
     return symbolInfo("base_dp") || 6;
   }, [symbolInfo]);
   const positionQty = React2.useMemo(() => {
-    if (!position)
-      return 0;
+    if (!position) return 0;
     return Math.abs(position.position_qty);
   }, [position]);
   const isLong = React2.useMemo(() => {
-    if (!position)
-      return false;
+    if (!position) return false;
     return position.position_qty > 0;
   }, [position]);
   const reverseQty = positionQty;
   const validationError = React2.useMemo(() => {
-    if (!position || !symbolInfo)
-      return null;
+    if (!position || !symbolInfo) return null;
     if (baseMin > 0 && reverseQty < baseMin) {
       return "belowMin";
     }
@@ -2342,8 +2328,7 @@ var PartialTPSL = (props) => {
   });
   const child = React2.useMemo(() => {
     const children = [];
-    if (!order?.symbol)
-      return /* @__PURE__ */ jsxRuntime.jsx(AddIcon, { positionType: types.PositionType.PARTIAL });
+    if (!order?.symbol) return /* @__PURE__ */ jsxRuntime.jsx(AddIcon, { positionType: types.PositionType.PARTIAL });
     if (tpTriggerPrice) {
       children.push(
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -2587,8 +2572,7 @@ var TPSLTriggerPrice = (props) => {
   const { t } = i18n.useTranslation();
   const pnl = React2.useMemo(() => {
     const msgs = [];
-    if (!props.tooltip || !order || !position)
-      return;
+    if (!props.tooltip || !order || !position) return;
     let quantity = order.quantity;
     if (quantity === 0) {
       if (order.child_orders[0].type === "CLOSE_POSITION") {
@@ -2638,8 +2622,7 @@ var TPSLTriggerPrice = (props) => {
   ]);
   const child = React2.useMemo(() => {
     const children = [];
-    if (!order?.symbol)
-      return /* @__PURE__ */ jsxRuntime.jsx(AddIcon, { positionType: types.PositionType.FULL });
+    if (!order?.symbol) return /* @__PURE__ */ jsxRuntime.jsx(AddIcon, { positionType: types.PositionType.FULL });
     if (props.takeProfitPrice) {
       children.push(
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -2930,7 +2913,19 @@ var useColumn = (config) => {
           ui.Tooltip,
           {
             className: "oui-max-w-[280px] oui-bg-base-8 oui-p-3 oui-text-2xs oui-text-base-contrast-54",
-            content: t("positions.column.liqPrice.tooltip"),
+            content: /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-text-pretty", children: t("common.liquidationPrice.tooltip") }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(
+                "a",
+                {
+                  href: "https://orderly.network/docs/introduction/trade-on-orderly/perpetual-futures/liquidations",
+                  target: "_blank",
+                  rel: "noopener noreferrer",
+                  className: "oui-text-primary oui-underline",
+                  children: t("common.liquidationPrice.tooltip.learnMore")
+                }
+              ) })
+            ] }),
             children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { children: t("positions.column.liqPrice") })
           }
         ),
@@ -3279,10 +3274,8 @@ var LiqPrice = (props) => {
   const liqPrice = React2.useMemo(() => {
     const estLiqPrice = item.est_liq_price;
     const markPrice = item.mark_price;
-    if (!estLiqPrice || estLiqPrice <= 0)
-      return "-";
-    if (!markPrice || markPrice === 0)
-      return "-";
+    if (!estLiqPrice || estLiqPrice <= 0) return "-";
+    if (!markPrice || markPrice === 0) return "-";
     if (Math.abs(estLiqPrice - markPrice) / markPrice >= LIQ_DISTANCE_THRESHOLD) {
       return "-";
     }
@@ -3752,8 +3745,7 @@ var usePositionHistoryColumn = (props) => {
         dataIndex: "netPnL",
         width: 140,
         onSort: (a, b) => {
-          if (a.netPnL == null || b.netPnL == null)
-            return -1;
+          if (a.netPnL == null || b.netPnL == null) return -1;
           return (a.netPnL ?? 0) - (b.netPnL ?? 0);
         },
         render: (_, record) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gapX: 1, children: [
@@ -3997,8 +3989,7 @@ var NetPnL = (props) => {
       children: netPnl ?? "--"
     }
   );
-  if (record.netPnL == null)
-    return text();
+  if (record.netPnL == null) return text();
   return /* @__PURE__ */ jsxRuntime.jsx(
     ui.Tooltip,
     {
@@ -4056,15 +4047,13 @@ var LeverageDisplay2 = ({ symbol }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(ui.Text.numeral, { dp: 0, size: "2xs", unit: "X", children: leverage });
 };
 function offsetStartOfDay(date) {
-  if (date == null)
-    return date;
+  if (date == null) return date;
   const newDate = new Date(date);
   newDate.setHours(0, 0, 0, 0);
   return newDate;
 }
 function offsetEndOfDay(date) {
-  if (date == null)
-    return date;
+  if (date == null) return date;
   const newDate = new Date(date);
   newDate.setHours(23, 59, 59, 999);
   return newDate;
@@ -4129,8 +4118,7 @@ var usePositionHistoryScript = (props) => {
     setPage(1);
   }, [status, side, dateRange, filterDays, symbol]);
   const filterData = React2.useMemo(() => {
-    if (data == null)
-      return data;
+    if (data == null) return data;
     return data.filter((item) => {
       const sideFilter = side === "all" /* all */ ? true : item.side.toLowerCase() === side.toLowerCase();
       const statusFilter = status === "all" /* all */ ? true : item.position_status.toLowerCase() === status.toLowerCase();
@@ -5031,12 +5019,10 @@ var Body2 = (props) => {
   const position = props.item.positions_by_perp?.[0];
   const { t } = i18n.useTranslation();
   const mr = React2.useMemo(() => {
-    if (isNaN(props.item?.margin_ratio))
-      return "--";
+    if (isNaN(props.item?.margin_ratio)) return "--";
     return `${new utils.Decimal(props.item.margin_ratio).mul(100).todp(2, utils.Decimal.ROUND_DOWN).toNumber()}%`;
   }, [props.item?.margin_ratio]);
-  if (!position)
-    return null;
+  if (!position) return null;
   return /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { direction: "column", width: "100%", gap: 1, children: [
     /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 2, width: "100%", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -5439,8 +5425,7 @@ var useFilter2 = () => {
   };
 };
 var generateKeyFun = (args) => (pageIndex, previousPageData) => {
-  if (previousPageData && !previousPageData.rows?.length)
-    return null;
+  if (previousPageData && !previousPageData.rows?.length) return null;
   const { symbol, size = 10, page, end_t, start_t } = args;
   const search = new URLSearchParams([
     ["size", size.toString()],
@@ -5496,8 +5481,7 @@ var useCloseAllPositionsScript = (options) => {
   const { tracking } = hooks.useTrack();
   const [positionsData] = hooks.usePositionStream(symbol);
   const openPositions = React2.useMemo(() => {
-    if (!positionsData?.rows)
-      return [];
+    if (!positionsData?.rows) return [];
     return positionsData.rows.filter(
       (position) => position.position_qty !== 0 && position.position_qty !== void 0
     );
@@ -5510,8 +5494,7 @@ var useCloseAllPositionsScript = (options) => {
     "POST"
   );
   const closeAllPositions = React2.useCallback(async () => {
-    if (!hasOpenPositions)
-      return;
+    if (!hasOpenPositions) return;
     try {
       const closePromises = openPositions.map(
         (position) => {
@@ -5607,5 +5590,5 @@ exports.useReversePositionEnabled = useReversePositionEnabled;
 exports.useReversePositionScript = useReversePositionScript;
 exports.useSort = useSort;
 exports.useTabSort = useTabSort;
-//# sourceMappingURL=out.js.map
+//# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map