wip: feat: uses yttrium via walletkit for chain abstraction

advanced/wallets/react-wallet-v2/package.json

@@ -29,8 +29,8 @@
     "@noble/curves": "^1.6.0",
     "@polkadot/keyring": "^10.1.2",
     "@polkadot/types": "^9.3.3",
-    "@reown/walletkit": "1.1.2-canary-wasm-3",
     "@reown/appkit-experimental": "1.1.5",
+    "@reown/walletkit": "1.1.2-canary-wasm-5",
     "@rhinestone/module-sdk": "0.1.25",
     "@solana/web3.js": "1.89.2",
     "@taquito/signer": "^15.1.0",

advanced/wallets/react-wallet-v2/src/components/BridgeBadge.tsx

@@ -0,0 +1,26 @@
+import { Icon } from '@mui/material'
+import bridgeIcon from './../../public/bridge.png'
+
+export default function BridgeBadge() {
+  return (
+    <div
+      style={{
+        width: 27,
+        height: 27,
+        borderRadius: 12,
+        backgroundColor: '#363636',
+        flexDirection: 'row',
+        justifyContent: 'space-evenly'
+      }}
+    >
+      <img
+        style={{
+          width: 16,
+          height: 16,
+          margin: 5
+        }}
+        src="./../../bridge.png"
+      />
+    </div>
+  )
+}

advanced/wallets/react-wallet-v2/src/components/ChainAbstractionBalanceCard.tsx

@@ -11,7 +11,7 @@ import { Hex } from 'viem'
 
 export default function ChainAbstractionBalanceCard() {
   const { eip155Address } = useSnapshot(SettingsStore.state)
-  const [balances, setBalances] = useState<Record<string, Record<string, number>>>({})
+  const [balances, setBalances] = useState<Record<string, Record<string, string>>>({})
   const [totalBalance, setTotalBalance] = useState<Record<string, number>>({})
   const [loading, setLoading] = useState(true)
   useEffect(() => {
@@ -20,7 +20,7 @@ export default function ChainAbstractionBalanceCard() {
 
       const fetchedBalances: Record<string, any> = {}
       for (const asset of Object.keys(multibridgeSupportedAssets)) {
-        const assetBalances: Record<string, number> = {}
+        const assetBalances: Record<string, string> = {}
         for (const chainId of Object.keys(multibridgeSupportedAssets[asset])) {
           const tokenAddress = multibridgeSupportedAssets[asset][Number(chainId)]
           const balance = await getErc20TokenBalance(
@@ -43,7 +43,7 @@ export default function ChainAbstractionBalanceCard() {
     for (const asset of Object.keys(balances)) {
       let total = 0
       for (const chainBalance of Object.values(balances[asset])) {
-        total += chainBalance
+        total += parseFloat(chainBalance)
       }
       totalBalances[asset] = total
     }