Development Process

[doutv]

https://doutv.notion.site/WalletUnity-6bc37344fe73444185675a5b75ca8e23?pvs=4

WalletUnity

Multi-chain asset consolidation Dapp, manages multi-chain assets, and with one click consolidates them to the designated chain when needed.

Scenario: Assets in user's wallet are scattered across multiple chains.

Features:

• Connect wallet, display mainstream tokens inside the wallet, and calculate their total value, like DeBank

  • display several mainstream tokens.

• For each wallet to be consolidated:

  • Use 1inch / Uniswap to convert ETH, USDT, and other tokens into USDC.
  • Use CCTP to transfer USDC cross-chain to the designated account on the designated chain.

Technical architecture: frontend + Solidity smart contract, no backend.

MVP

Connect user's wallet, display USDC amount on Arbitrum, Avalanche, Ethereum, OP Mainnet, and bridge USDC via CCTP.

Supported Chains

Mainnet:

• Arbitrum, Avalanche, Ethereum, OP Mainnet

Testnet:

• Arbitrum Goerli, Avalanche Fuji, Ethereum Goerli, OP Goerli

[doutv]

Add support for OP Goerli testnet

I develop WalletUnity based on Circle's cctp-sample-app, which already implemented bridging USDC via CCTP.

cctp-sample-app only support 3 chains for now: ETH, Avalanche, Arbitrum.

I add support for Optimism Goerli, and open a PR to contribute my code: https://github.com/circlefin/cctp-sample-app/pull/21

[doutv]

Display mainstream tokens and calculate the account value in USD

Through Debank API, I can get the total balance of certain account. However, this is a paid API: https://cloud.debank.com/#section-openapi

Thus, I decided to use multiple free APIs to obtain the token details and real-time total value of the account:

• Token amount: If querying ERC-20 contract through web3.js, only the token amount of the currently connected blockchain can be obtained. I cannot obtain the token amount on multiple chains at the same time. Therefore, I found the free API provided by Etherscan:
  • For native tokens: https://docs.etherscan.io/api-endpoints/accounts#get-ether-balance-for-a-single-address
  • Ethereum, OP, Arb: ETH
  • AVAX: Avalanche
  • For ERC-20 tokens, https://docs.etherscan.io/api-endpoints/tokens#get-erc20-token-account-balance-for-tokencontractaddress
• Token real-time price: Use the free API provided by CoinCap https://docs.coincap.io/#f8869879-171f-4240-adfd-dd2947506adc

The token details and total value in USD can be calculated.

Result

Commit: https://github.com/doutv/wallet-unity/commit/ebdfbf9413f0486a39dbe26744b45fe4d941b016

Frontend dashboard

[doutv]

Integrate Uniswap Widget for token swap

Since CCTP only bridge USDC, if I want to bridge other tokens, I shall first swap them into USDC.

Integrate Uniswap Widget into my Dapp, so that users can swap tokens without leaving my site.

Implementation

• alert switch network when user is in a different blockchain.
• customize default input token as the selected token, and output token as USDC
• customize token list
• refresh token details when swap finish

Result

Since Uniswap Widget does not support Avalanche and Arbitrum testnets, I disable swap buttons of them.

[doutv]

Support more tokens

Refactor the code, allowing to add new tokens easily.