@orderly.network/markets 2.8.13-rc.0 → 2.8.13

package/dist/index.mjs

@@ -1,7 +1,7 @@
 import React6, { memo, createContext, useState, useRef, useEffect, useCallback, useMemo, useContext } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { useSymbolsInfo, useMarkets, MarketsType, useFundingRateHistory, useFundingRates, useQuery, useMarketsStream, useLocalStorage, useGetRwaSymbolInfo, useTickerStream, useFundingRate, useMarketsStore, useFundingDetails, useSessionStorage, useFundingRateBySymbol, usePositionStream, isCurrentlyTrading } from '@orderly.network/hooks';
-import { Flex, TokenIcon, Text, Box, cn, Marquee, Checkbox, Divider, useEmblaCarousel, useScreen, Badge, Tooltip, CloseIcon, CheckedSquareFillIcon, CheckSquareEmptyIcon, Button, DropdownMenuRoot, DropdownMenuTrigger, DropdownMenuPortal, DropdownMenuContent, Input, CloseCircleFillIcon, PlusIcon, DataTable, usePagination, Tabs, TabPanel, EmptyDataState, NewsFillIcon, modal, GradientText, EmptyStateIcon, Picker, Select } from '@orderly.network/ui';
+import { Flex, TokenIcon, Text, Box, cn, Marquee, Checkbox, Divider, useEmblaCarousel, useScreen, Badge, Tooltip, CloseIcon, CheckedSquareFillIcon, CheckSquareEmptyIcon, Button, DropdownMenuRoot, DropdownMenuTrigger, DropdownMenuPortal, DropdownMenuContent, Input, CloseCircleFillIcon, PlusIcon, DataTable, usePagination, Tabs, TabPanel, EmptyDataState, NewsFillIcon, modal, RwaIcon, GradientText, EmptyStateIcon, Picker, Select } from '@orderly.network/ui';
 import { useTranslation, Trans, i18n } from '@orderly.network/i18n';
 import { Decimal, formatSymbol } from '@orderly.network/utils';
 import { pick } from 'ramda';
@@ -1851,9 +1851,23 @@ var init_marketsList = __esm({
     init_marketsList_widget();
   }
 });
-var RwaTab;
+var RwaIconTab, RwaTab;
 var init_rwaTab = __esm({
   "src/components/rwaTab.tsx"() {
+    RwaIconTab = (props) => {
+      const { iconSize = 12 } = props;
+      const { t } = useTranslation();
+      return /* @__PURE__ */ jsxs(Flex, { gap: 1, children: [
+        /* @__PURE__ */ jsx(
+          RwaIcon,
+          {
+            size: iconSize,
+            className: "group-data-[state=active]:oui-text-base-contrast group-data-[state=inactive]:oui-text-base-contrast-36"
+          }
+        ),
+        /* @__PURE__ */ jsx(Text, { children: t("common.rwa") })
+      ] });
+    };
     RwaTab = () => {
       const { t } = useTranslation();
       return /* @__PURE__ */ jsxs(Flex, { gap: 1, children: [
@@ -2525,7 +2539,7 @@ var init_marketsDataList_mobile_ui = __esm({
                 children: renderTab("all" /* All */)
               }
             ),
-            /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(RwaTab, {}), value: "rwa", children: renderTab("rwa" /* Rwa */) }),
+            /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(RwaIconTab, {}), value: "rwa", children: renderTab("rwa" /* Rwa */) }),
             /* @__PURE__ */ jsx(
               TabPanel,
               {
@@ -2916,7 +2930,7 @@ var init_marketsListFull_ui = __esm({
                 onSymbolChange?.(record);
                 favorite.addToHistory(record);
               },
-              "data-testid": `oui-testid-markets-${type === "new" ? "newListing" : "all"}-tr-${record.symbol}`
+              "data-testid": `oui-testid-markets-${type === "new" ? "newListing" : type === "rwa" ? "rwa" : "all"}-tr-${record.symbol}`
             };
           },
           generatedRowKey: (record) => record.symbol,
@@ -2933,17 +2947,23 @@ var init_marketsListFull_ui = __esm({
     };
   }
 });
-var useMarketsListFullScript;
+var MarketsTypeMap2, useMarketsListFullScript;
 var init_marketsListFull_script = __esm({
   "src/components/marketsListFull/marketsListFull.script.ts"() {
     init_marketsProvider();
     init_utils();
+    MarketsTypeMap2 = {
+      all: MarketsType.ALL,
+      new: MarketsType.NEW_LISTING,
+      rwa: MarketsType.RWA
+    };
     useMarketsListFullScript = (options) => {
+      const { type = "all" } = options;
       const [loading, setLoading] = useState(true);
       const { setPage, pagination } = usePagination({
         pageSize: 10
       });
-      const [data, favorite] = useMarkets(MarketsType.ALL);
+      const [data, favorite] = useMarkets(MarketsTypeMap2[type]);
       const { searchValue } = useMarketsContext();
       const { onSort, getSortedList, sort } = useSort(options.initialSort);
       const dataSource = useMemo(() => {
@@ -2957,17 +2977,17 @@ var init_marketsListFull_script = __esm({
         setPage(1);
       }, [searchValue]);
       useEffect(() => {
-        if (options.type === "all") {
+        if (type === "all") {
           favorite.updateTabsSortState("all", sort?.sortKey, sort?.sortOrder);
         }
-      }, [sort, options.type]);
+      }, [sort, type]);
       const initialSort = useMemo(() => {
-        const sortStore = options.type === "all" ? favorite.tabSort?.all : void 0;
+        const sortStore = type === "all" ? favorite.tabSort?.all : void 0;
         return {
           sortKey: sortStore?.sortKey || options?.initialSort?.sortKey,
           sort: sortStore?.sortOrder || options?.initialSort?.sortOrder
         };
-      }, [favorite.tabSort, options.initialSort, options.type]);
+      }, [favorite.tabSort, options.initialSort, type]);
       return {
         loading,
         dataSource,
@@ -3009,6 +3029,7 @@ var LazySearchInput, LazyFavoritesListFullWidget, LazyMarketsListFullWidget, Mar
 var init_marketsDataList_ui = __esm({
   "src/pages/home/marketsDataList/marketsDataList.ui.tsx"() {
     init_favoritesEmpty();
+    init_rwaTab();
     init_icons();
     init_type();
     LazySearchInput = React6.lazy(
@@ -3073,6 +3094,21 @@ var init_marketsDataList_ui = __esm({
                 ) })
               }
             ),
+            /* @__PURE__ */ jsx(
+              TabPanel,
+              {
+                title: /* @__PURE__ */ jsx(RwaIconTab, {}),
+                value: "rwa",
+                testid: "oui-testid-markets-rwa-tab",
+                children: /* @__PURE__ */ jsx(React6.Suspense, { fallback: null, children: /* @__PURE__ */ jsx(
+                  LazyMarketsListFullWidget,
+                  {
+                    type: "rwa",
+                    initialSort: { sortKey: "24h_amount", sortOrder: "desc" }
+                  }
+                ) })
+              }
+            ),
             /* @__PURE__ */ jsx(
               TabPanel,
               {
@@ -4999,7 +5035,7 @@ var SubMenuMarkets = (props) => {
                   onSort: onTabSort("all" /* All */)
                 }
               ) }),
-              /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(RwaTab, {}), value: "rwa" /* Rwa */, children: /* @__PURE__ */ jsx(
+              /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(RwaIconTab, {}), value: "rwa" /* Rwa */, children: /* @__PURE__ */ jsx(
                 MarketTabPanel,
                 {
                   type: "rwa" /* Rwa */,
@@ -6255,7 +6291,7 @@ var useHorizontalMarketsScript = (options) => {
     SIDE_MARKETS_SEL_TAB_KEY,
     defaultMarketType || "all"
   );
-  const MarketsTypeMap2 = {
+  const MarketsTypeMap3 = {
     all: MarketsType.ALL,
     recent: MarketsType.RECENT,
     newListing: MarketsType.NEW_LISTING,
@@ -6263,7 +6299,7 @@ var useHorizontalMarketsScript = (options) => {
   };
   const marketTypeKey = selectedMarketType || "all";
   const [markets, favorite] = useMarkets(
-    MarketsTypeMap2[marketTypeKey] || MarketsType.ALL
+    MarketsTypeMap3[marketTypeKey] || MarketsType.ALL
   );
   const filteredMarkets = useMemo(() => {
     if (selectedMarketType === "favorites") {