chore: update chart price usd

oraichain · Sep 25, 2024 · 1a3c388 · 1a3c388
1 parent af78e99
commit 1a3c388
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 3 deletions.
diff --git a/src/pages/UniversalSwap/Component/HeaderTab.tsx b/src/pages/UniversalSwap/Component/HeaderTab.tsx
@@ -108,10 +108,26 @@ export const UsdPrice = ({
 }: Pick<HeaderTabPropsType, 'percentChangeUsd' | 'priceUsd' | 'chartTokenType'>) => {
   const isIncrementUsd = percentChangeUsd && Number(percentChangeUsd) > 0;
 
+  const minimize = (input: string) => {
+    let isNeedSub = false;
+    const replaceItem = input.replace(/(?<=\.)0+/, (m) => {
+      isNeedSub = m.length > 3;
+      return isNeedSub ? `0<sub>${m.length}</sub>` : m;
+    });
+
+    if (!isNeedSub) return numberWithCommas(priceUsd, undefined, { maximumFractionDigits: 6 });
+
+    const SUB_ELEMENT_LENGTH = 5; // </sub>
+    const DECIMALS_AFTER_SUB_LENGTH = 5;
+    const decimalAfterSub = replaceItem.indexOf('</sub>') + SUB_ELEMENT_LENGTH + DECIMALS_AFTER_SUB_LENGTH;
+    return replaceItem.slice(0, decimalAfterSub);
+  };
+
   const headerTabSimple = () => {
     return (
       <div>
-        <span>${!priceUsd ? '--' : numberWithCommas(priceUsd, undefined, { maximumFractionDigits: 6 })}</span>
+        <span dangerouslySetInnerHTML={{ __html: `\$${!priceUsd ? '--' : minimize(priceUsd.toString())}` }} />
+
         <span
           className={cx('percent', isIncrementUsd ? 'increment' : 'decrement', {
             hidePercent: chartTokenType === ChartTokenType.Volume

diff --git a/src/pages/UniversalSwap/hooks/useChartUsdPrice.ts b/src/pages/UniversalSwap/hooks/useChartUsdPrice.ts
@@ -80,7 +80,7 @@ export const useChartUsdPrice = (
       const fmtData = (data || []).map((item) => {
         return {
           time: Number(item.time) * 1000,
-          value: item.close || 0,
+          value: item.price || 0,
           volume: toFixedIfNecessary(toDisplay(Number(item.volume || 0).toString()).toString(), 2)
         };
       });
@@ -150,7 +150,7 @@ export const FILTER_DAYS = {
 export const getDataPriceMarket = async (tokenDenom: string, type: FILTER_TIME_CHART = FILTER_TIME_CHART.DAY) => {
   try {
     const now = Math.floor(Date.now() / 1000);
-    const res = await axios.get(`v2/candles`, {
+    const res = await axios.get(`v1/price-usd-chart`, {
       params: {
         denom: tokenDenom,
         tf: FILTER_DAYS[type].tf,