fix borrow modal rounding

components/BorrowForm.tsx

@@ -21,7 +21,11 @@ import {
   INPUT_TOKEN_DEFAULT,
 } from './../utils/constants'
 import { notify } from './../utils/notifications'
-import { floorToDecimal, formatFixedDecimals } from './../utils/numbers'
+import {
+  floorToDecimal,
+  formatDecimal,
+  formatFixedDecimals,
+} from './../utils/numbers'
 import ActionTokenList from './account/ActionTokenList'
 import ButtonGroup from './forms/ButtonGroup'
 import Label from './forms/Label'
@@ -327,18 +331,25 @@ function BorrowForm({ onSuccess, token }: BorrowFormProps) {
                     <p className="font-mono text-th-fgd-2">
                       {isBorrow ? (
                         <>
-                          {tokenBalance.toNumber()}{' '}
+                          {formatDecimal(
+                            Number(tokenBalance),
+                            bank.mintDecimals
+                          )}{' '}
                           <span className="text-xs text-th-fgd-3">
                             (
                             {formatFixedDecimals(
                               bank.uiPrice * tokenBalance.toNumber(),
                               true
                             )}
+                            )
                           </span>
                         </>
                       ) : inputAmount ? (
                         <>
-                          {inputAmount}{' '}
+                          {formatDecimal(
+                            Number(inputAmount),
+                            bank.mintDecimals
+                          )}{' '}
                           <span className="text-xs text-th-fgd-3">
                             (
                             {formatFixedDecimals(
@@ -362,7 +373,10 @@ function BorrowForm({ onSuccess, token }: BorrowFormProps) {
                   <p className="font-mono text-th-fgd-2">
                     {isBorrow ? (
                       <>
-                        {parseFloat(inputAmount) - tokenBalance.toNumber()}{' '}
+                        {formatDecimal(
+                          Number(inputAmount) - Number(tokenBalance),
+                          bank.mintDecimals
+                        )}{' '}
                         <span className="text-xs text-th-fgd-3">
                           (
                           {formatFixedDecimals(
@@ -388,14 +402,20 @@ function BorrowForm({ onSuccess, token }: BorrowFormProps) {
                     </p>
                   </Tooltip>
                   <p className="font-mono text-th-fgd-2">
-                    {isBorrow
+                    {isBorrow ? (
-                      ? formatFixedDecimals(
+                      <>
-                          bank.uiPrice *
+                        {formatDecimal(
                           bank.loanOriginationFeeRate.toNumber() *
                             (parseFloat(inputAmount) - tokenBalance.toNumber()),
-                          true
+                          bank.mintDecimals
-                        )
+                        )}{' '}
-                      : '$0.00'}
+                        <span className="font-body text-th-fgd-3">
+                          {bank.name}
+                        </span>
+                      </>
+                    ) : (
+                      'N/A'
+                    )}
                   </p>
                 </div>
               </div>

utils/numbers.ts

@@ -59,33 +59,28 @@ const usdFormatter3 = Intl.NumberFormat('en', {
 
 export const formatFixedDecimals = (
   value: number,
-  isCurrency?: boolean,
+  isPrice?: boolean,
-  isPercentage?: boolean
+  isValue?: boolean
 ): string => {
   let formattedValue
   if (value === 0) {
-    formattedValue = isCurrency ? '$0.00' : '0'
+    formattedValue = isPrice ? '$0.00' : '0'
-  } else if (isPercentage) {
+  } else if (isValue) {
-    formattedValue = Number(floorToDecimal(value, 2)).toLocaleString(
+    formattedValue = usdFormatter2.format(value)
-      undefined,
-      {
-        maximumFractionDigits: 2,
-      }
-    )
   } else if (Math.abs(value) >= 1000) {
-    formattedValue = isCurrency
+    formattedValue = isPrice
       ? usdFormatter0.format(value)
       : Number(floorToDecimal(value, 0)).toLocaleString(undefined, {
           maximumFractionDigits: 0,
         })
   } else if (Math.abs(value) >= 0.1) {
-    formattedValue = isCurrency
+    formattedValue = isPrice
       ? usdFormatter2.format(value)
       : Number(floorToDecimal(value, 3)).toLocaleString(undefined, {
           maximumFractionDigits: 3,
         })
   } else {
-    formattedValue = isCurrency
+    formattedValue = isPrice
       ? usdFormatter3.format(value)
       : Number(floorToDecimal(value, 8)).toLocaleString(undefined, {
           maximumFractionDigits: 8,