wallet balance formatted

src/components/MyWallet/Balance.jsx

@@ -4,6 +4,7 @@ import RecentActivityTable from './WalletComponent/RecentActivityTable'
 import PurchasesTable from './WalletComponent/PurchasesTable'
 import CouponTable from './WalletComponent/CouponTable'
 import LoadingSpinner from '../Spinners/LoadingSpinner'
+import { PriceFormatter } from '../Helpers/PriceFormatter'
 
 function Balance({wallet, coupon}) {
     return (
@@ -42,11 +43,11 @@ function Balance({wallet, coupon}) {
                                     </div>
                                     <div className='balance-info'>
                                         <p className='py-2'>Balance</p>
-                                        <span className='py-1 px-2 bg-green-100 text-green-500 rounded-lg'>{item.symbol}{(item.amount*0.01).toFixed(2)}</span>
+                                        <span className='py-1 px-2 bg-green-100 text-green-500 rounded-lg flex flex-start gap-1'>{PriceFormatter(item.amount * 0.01, item.code)}</span>
                                     </div>
                                     <div className='balance-info'>
                                         <p className='py-2'>Escrow</p>
-                                        <span className='py-1 px-2 bg-red-100 text-red-500 rounded-lg'>{item.symbol}{(item.escrow*0.01).toFixed(2)}</span>
+                                        <span className='py-1 px-2 bg-red-100 text-red-500 rounded-lg flex flex-start gap-1'>{PriceFormatter(item.escrow * 0.01, item.code)}</span>
                                     </div>
                                 </div>
 

src/components/MyWallet/WalletHeader.jsx

@@ -5,6 +5,7 @@ import bank2 from "../../assets/images/bank-2.png";
 import bank3 from "../../assets/images/bank-3.png";
 import bank4 from "../../assets/images/bank-4.png";
 import Accordion from "../Helpers/Accordion";
+import { PriceFormatter } from "../Helpers/PriceFormatter";
 
 export default function WalletHeader(props) {
   //  debugger;
@@ -58,10 +59,7 @@ export default function WalletHeader(props) {
                       </div>
                       <div>
                         <p className="eth text-xl font-bold text-purple">
-                          {(value.amount * 0.01).toFixed(2)} {value.code}
-                        </p>
-                        <p className="usd text-base text-thin-light-gray text-right">
-                          {/*(773.69 USD)*/}
+                          {PriceFormatter(value.amount * 0.01, value.code)}
                         </p>
                       </div>
                     </div>