diff --git a/package.json b/package.json
index 653cd06..25af142 100644
--- a/package.json
+++ b/package.json
@@ -8,6 +8,7 @@
     "@ethersproject/contracts": "^5.0.12",
     "@ethersproject/providers": "^5.0.24",
     "@ethersproject/solidity": "^5.0.10",
+    "@ethersproject/units": "^5.0.11",
     "@pancakeswap-libs/sdk": "^1.0.1",
     "@reduxjs/toolkit": "^1.5.0",
     "@testing-library/jest-dom": "^5.11.4",
diff --git a/src/views/Vault/components/VaultsListItem.tsx b/src/views/Vault/components/VaultsListItem.tsx
index 7db6c82..51cc605 100644
--- a/src/views/Vault/components/VaultsListItem.tsx
+++ b/src/views/Vault/components/VaultsListItem.tsx
@@ -7,6 +7,7 @@ import DepositModal from './subcomponent/DespositModal';
 import { UnsupportedChainIdError, useWeb3React } from '@web3-react/core'
 import useSWR from 'swr'
 import { Web3Provider } from '@ethersproject/providers'
+import { formatEther } from '@ethersproject/units'
 
 interface Item {
   item: any;
@@ -92,7 +93,7 @@ const VaultsListItem: React.FC<Item> = ({ item }) => {
                   </WalletTitle>
                   <WalletValue>
                     <span style={{ color: "#6c757d", fontSize: "0.9em" }}>
-                      { balance? <div>Balance: {balance.toString()}</div> : <div>--</div> }
+                      { balance? <div>Balance: {parseFloat(formatEther(balance)).toPrecision(4)}</div> : <div>--</div> }
                     </span>
                   </WalletValue>
                 </WalletContent>
diff --git a/tsconfig.json b/tsconfig.json
index 283510e..d48d3f4 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -18,7 +18,7 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "preserve"
+    "jsx": "react-jsx"
   },
   "include": [
     "src"
diff --git a/yarn.lock b/yarn.lock
index 123dfb1..7b12516 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1595,6 +1595,15 @@
     "@ethersproject/rlp" "^5.0.7"
     "@ethersproject/signing-key" "^5.0.8"
 
+"@ethersproject/units@^5.0.11":
+  version "5.0.11"
+  resolved "https://registry.npmjs.org/@ethersproject/units/-/units-5.0.11.tgz#f82f6e353ac0d6fa43b17337790f1f9aa72cb4c8"
+  integrity sha512-nOSPmcCWyB/dwoBRhhTtPGCsTbiXqmc7Q0Adwvafc432AC7hy3Fj3IFZtnSXsbtJ/GdHCIUIoA8gtvxSsFuBJg==
+  dependencies:
+    "@ethersproject/bignumber" "^5.0.13"
+    "@ethersproject/constants" "^5.0.8"
+    "@ethersproject/logger" "^5.0.8"
+
 "@ethersproject/web@^5.0.12":
   version "5.0.14"
   resolved "https://registry.yarnpkg.com/@ethersproject/web/-/web-5.0.14.tgz#6e7bebdd9fb967cb25ee60f44d9218dc0803bac4"
@@ -14141,6 +14150,11 @@ swarm-js@^0.1.40:
     tar "^4.0.2"
     xhr-request "^1.0.1"
 
+swr@^0.5.3:
+  version "0.5.3"
+  resolved "https://registry.npmjs.org/swr/-/swr-0.5.3.tgz#7290a9a61329d930583ef365317e636b8dbaa8bb"
+  integrity sha512-RUE3RWn3jt9e4qLPat2A9vbHG/5N6konsc27xKjE65jFSiGv0P7HLD8IGvwAv6DRKktL7Od2UcayX0plKb2awg==
+
 symbol-observable@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.2.0.tgz#c22688aed4eab3cdc2dfeacbb561660560a00804"