From fbd979715d02425f22baa811e3929333fcf64bcd Mon Sep 17 00:00:00 2001
From: "nature.xie" <nature@ref.finance>
Date: Tue, 2 Jan 2024 16:35:40 +0800
Subject: [PATCH] fix price ui issue

---
 screens/Market/table.tsx      |  6 +++---
 screens/TokenDetail/index.tsx | 10 ++++++----
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/screens/Market/table.tsx b/screens/Market/table.tsx
index 1311a637..7d766b62 100644
--- a/screens/Market/table.tsx
+++ b/screens/Market/table.tsx
@@ -6,12 +6,12 @@ import type { UIAsset } from "../../interfaces";
 import { isMobileDevice } from "../../helpers/helpers";
 import { useAPY } from "../../hooks/useAPY";
 import { IToken } from "../../interfaces/asset";
-import { standardizeAsset } from "../../utils";
 import {
   toInternationalCurrencySystem_number,
   toInternationalCurrencySystem_usd,
   format_apy,
   isInvalid,
+  formatWithCommas_usd,
 } from "../../utils/uiNumber";
 import { APYCell } from "./APYCell";
 import getConfig from "../../utils/config";
@@ -369,7 +369,7 @@ function TableRowPc({
           {getIcons()}
           <div className="flex flex-col items-start ml-3">
             <div className="flex items-end">{getSymbols()}</div>
-            <span className="text-xs text-gray-300">${row.price}</span>
+            <span className="text-xs text-gray-300">{formatWithCommas_usd(row?.price)}</span>
           </div>
           {is_new ? (
             <NewTagIcon
@@ -512,7 +512,7 @@ function TableRowMobile({
               row.can_borrow ? toInternationalCurrencySystem_usd(row.availableLiquidityMoney) : ""
             }
           />
-          <TemplateMobile title="Price" value={`$${row.price}`} />
+          <TemplateMobile title="Price" value={formatWithCommas_usd(row?.price)} />
         </div>
       </div>
     </Link>
diff --git a/screens/TokenDetail/index.tsx b/screens/TokenDetail/index.tsx
index 0afd1187..4714da49 100644
--- a/screens/TokenDetail/index.tsx
+++ b/screens/TokenDetail/index.tsx
@@ -176,7 +176,7 @@ function TokenDetailView({ tokenRow, assets }: { tokenRow: UIAsset; assets: UIAs
   function getSymbols() {
     const { isLpToken, tokens } = tokenRow;
     return (
-      <div className="flex items-center flex-wrap flex-shrink-0 xsm:max-w-[146px] ml-2">
+      <div className="flex items-center flex-wrap flex-shrink-0 xsm:max-w-[146px] xsm:ml-2">
         {isLpToken ? (
           tokens.map((token: IToken, index) => {
             return (
@@ -480,7 +480,7 @@ function TokenOverviewMobile() {
         title="# of borrowers"
         value={!tokenRow?.can_borrow ? "-" : formatWithCommas_number(borrowers_number, 0)}
       />
-      <LabelMobile title="Price" value={`$${tokenRow?.price}`} />
+      <LabelMobile title="Price" value={formatWithCommas_usd(tokenRow?.price)} />
     </div>
   );
 }
@@ -507,7 +507,7 @@ function TokenOverview() {
         <div className="flex flex-col ml-3">
           <div className="flex">{getSymbols()}</div>
           <span className="text-xs text-gray-300 transform -translate-y-1.5">
-            ${tokenRow?.price}
+            {formatWithCommas_usd(tokenRow?.price)}
           </span>
         </div>
       </div>
@@ -795,7 +795,9 @@ function TokenUserInfo() {
     );
   }
   function getUserLpUsd() {
-    return `$${digitalProcess(new Decimal(supplyBalance || 0).mul(price || 0).toFixed(), 2)}`;
+    return accountId
+      ? `$${digitalProcess(new Decimal(supplyBalance || 0).mul(price || 0).toFixed(), 2)}`
+      : "-";
   }
   const totalBorrowAmount = Object.values(maxBorrowAmountPositions)?.reduce(
     (acc, { maxBorrowAmount }) => acc + maxBorrowAmount,