add less than symbol for small amounts

rsksmart · Sep 27, 2023 · 13db0c9 · 13db0c9
1 parent cbd8f66
commit 13db0c9
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 8 deletions.
diff --git a/src/components/token/index.tsx b/src/components/token/index.tsx
@@ -122,7 +122,7 @@ export const TokenBalance = ({
                   {'<'}
                 </Typography>
               )}
-              <DollarIcon size={16} color={sharedColors.subTitle} />
+              <DollarIcon size={16} color={sharedColors.labelLight} />
             </>
           )}
           {!isNaN(Number(secondValue?.balance)) && (

diff --git a/src/lib/utils.ts b/src/lib/utils.ts
@@ -20,10 +20,7 @@ export const roundBalance = (num: number, decimalPlaces?: number) => {
 }
 
 export const displayRoundBalance = (num: number): string => {
-  let rounded = roundBalance(num, 4)
-  if (!rounded) {
-    rounded = roundBalance(num, 8)
-  }
+  const rounded = roundBalance(num, 4) || roundBalance(num, 8)
   return rounded.toString()
 }
 

diff --git a/src/screens/transactionSummary/TransactionSummaryComponent.tsx b/src/screens/transactionSummary/TransactionSummaryComponent.tsx
@@ -225,6 +225,11 @@ export const TransactionSummaryComponent = ({
             </View>
           </View>
           <View style={styles.dollarAmountWrapper}>
+            {usdValue.symbol === '<' && (
+              <Typography type="body1" color={sharedColors.labelLight}>
+                {'<'}
+              </Typography>
+            )}
             <DollarIcon size={14} color={sharedColors.labelLight} />
             <Typography
               type={'body2'}

diff --git a/src/ux/requestsModal/ReviewRelayTransaction/ReviewTransactionContainer.tsx b/src/ux/requestsModal/ReviewRelayTransaction/ReviewTransactionContainer.tsx
@@ -187,7 +187,7 @@ export const ReviewTransactionContainer = ({
     // get usd values
     const tokenUsd = convertToUSD(Number(value), tokenQuote)
     const feeUsd = convertToUSD(Number(feeValue), feeQuote)
-    const smallAmount = !Number(tokenUsd) && !!Number(value)
+    const isAmountSmall = !Number(tokenUsd) && !!Number(value)
 
     return {
       transaction: {
@@ -197,9 +197,9 @@ export const ReviewTransactionContainer = ({
           balance: value.toString(),
         },
         usdValue: {
-          symbol: smallAmount ? '<' : '$',
+          symbol: isAmountSmall ? '<' : '$',
           symbolType: 'usd',
-          balance: smallAmount ? '0.01' : tokenUsd,
+          balance: isAmountSmall ? '0.01' : tokenUsd,
         },
         fee: {
           tokenValue: feeValue,