#260 - add native coin support

src/components/UnwrapNative.tsx

@@ -9,6 +9,7 @@ import {
  CHAIN_ID_NEON,
  CHAIN_ID_OASIS,
  CHAIN_ID_POLYGON,
+ CHAIN_ID_BASE,
  ethers_contracts,
 } from "@certusone/wormhole-sdk";
 import {
@@ -26,6 +27,7 @@ import { useCallback, useEffect, useState } from "react";
 import { useEthereumProvider } from "../contexts/EthereumProviderContext";
 import useIsWalletReady from "../hooks/useIsWalletReady";
 import arbitrumIcon from "../icons/arbitrum.svg";
+import baseIcon from "../icons/base.svg";
 import avaxIcon from "../icons/avax.svg";
 import bnbIcon from "../icons/bnb.svg";
 import ethIcon from "../icons/eth.svg";
@@ -64,6 +66,8 @@ import {
  WNEON_DECIMALS,
  WROSE_ADDRESS,
  WROSE_DECIMALS,
+ BASE_WETH_ADDRESS,
+ BASE_WETH_DECIMALS
 } from "../utils/consts";
 import parseError from "../utils/parseError";
 import ButtonWithLoader from "./ButtonWithLoader";
@@ -164,6 +168,12 @@ const supportedTokens = {
  address: ARBWETH_ADDRESS,
  decimals: ARBWETH_DECIMALS,
  },
+ [CHAIN_ID_BASE]: {
+ symbol: "WETH",
+ icon: baseIcon,
+ address: BASE_WETH_ADDRESS,
+ decimals: BASE_WETH_DECIMALS,
+ }
 } as const;
 
 type SupportedChain = keyof typeof supportedTokens;

src/hooks/useGetSourceParsedTokenAccounts.ts

@@ -26,6 +26,7 @@ import {
  CHAIN_ID_INJECTIVE,
  CHAIN_ID_SUI,
  CHAIN_ID_ARBITRUM,
+ CHAIN_ID_BASE,
 } from "@certusone/wormhole-sdk";
 import { Dispatch } from "@reduxjs/toolkit";
 import { TOKEN_PROGRAM_ID } from "@solana/spl-token";
@@ -53,6 +54,7 @@ import acalaIcon from "../icons/acala.svg";
 import arbitrumIcon from "../icons/arbitrum.svg";
 import auroraIcon from "../icons/aurora.svg";
 import avaxIcon from "../icons/avax.svg";
+import baseIcon from "../icons/base.svg";
 import bnbIcon from "../icons/bnb.svg";
 import celoIcon from "../icons/celo.svg";
 import ethIcon from "../icons/eth.svg";
@@ -130,10 +132,12 @@ import {
  WNEON_DECIMALS,
  WROSE_ADDRESS,
  WROSE_DECIMALS,
- CLUSTER,
- SUI_NATIVE_TOKEN_KEY,
  ARBWETH_ADDRESS,
  ARBWETH_DECIMALS,
+ BASE_WETH_ADDRESS,
+ BASE_WETH_DECIMALS,
+ CLUSTER,
+ SUI_NATIVE_TOKEN_KEY,
 } from "../utils/consts";
 import { makeNearAccount } from "../utils/near";
 import {
@@ -291,6 +295,29 @@ const createNativeEthParsedTokenAccount = (
  });
 };
 
+const createNativeBaseParsedTokenAccount = (
+ provider: Provider,
+ signerAddress: string | undefined
+) => {
+ return !(provider && signerAddress)
+ ? Promise.reject()
+ : provider.getBalance(signerAddress).then((balanceInWei) => {
+ const balanceInEth = ethers.utils.formatEther(balanceInWei);
+ return createParsedTokenAccount(
+ signerAddress, //public key
+ BASE_WETH_ADDRESS, //Mint key, On the other side this will be WETH, so this is hopefully a white lie.
+ balanceInWei.toString(), //amount, in wei
+ BASE_WETH_DECIMALS, //Luckily both ETH and WETH have 18 decimals, so this should not be an issue.
+ parseFloat(balanceInEth), //This loses precision, but is a limitation of the current datamodel. This field is essentially deprecated
+ balanceInEth.toString(), //This is the actual display field, which has full precision.
+ "baseETH", //A white lie for display purposes
+ "Base Ethereum", //A white lie for display purposes
+ baseIcon,
+ true //isNativeAsset
+ );
+ });
+};
+
 const createNativeBscParsedTokenAccount = (
  provider: Provider,
  signerAddress: string | undefined
@@ -1355,6 +1382,40 @@ function useGetAvailableTokens(nft: boolean = false) {
  };
  }, [lookupChain, provider, signerAddress, nft, ethNativeAccount]);
 
+ //Base native asset load
+ useEffect(() => {
+ let cancelled = false;
+ if (
+ signerAddress &&
+ lookupChain === CHAIN_ID_BASE &&
+ !ethNativeAccount &&
+ !nft
+ ) {
+ setEthNativeAccountLoading(true);
+ createNativeBaseParsedTokenAccount(provider, signerAddress).then(
+ (result) => {
+ console.log("create native account returned with value", result);
+ if (!cancelled) {
+ setEthNativeAccount(result);
+ setEthNativeAccountLoading(false);
+ setEthNativeAccountError("");
+ }
+ },
+ (error) => {
+ if (!cancelled) {
+ setEthNativeAccount(undefined);
+ setEthNativeAccountLoading(false);
+ setEthNativeAccountError("Unable to retrieve your ETH balance.");
+ }
+ }
+ );
+ }
+
+ return () => {
+ cancelled = true;
+ };
+ }, [lookupChain, provider, signerAddress, nft, ethNativeAccount]);
+
  //Binance Smart Chain native asset load
  useEffect(() => {
  let cancelled = false;

src/utils/consts.ts

@@ -1360,6 +1360,14 @@ export const WETH_ADDRESS =
  : "0xDDb64fE46a91D46ee29420539FC25FD07c5FEa3E";
 export const WETH_DECIMALS = 18;
 
+export const BASE_WETH_ADDRESS =
+ CLUSTER === "mainnet"
+ ? "0x4200000000000000000000000000000000000006"
+ : CLUSTER === "testnet"
+ ? "0x4200000000000000000000000000000000000006"
+ : "0xDDb64fE46a91D46ee29420539FC25FD07c5FEa3E";
+export const BASE_WETH_DECIMALS = 18;
+
 export const WBNB_ADDRESS =
  CLUSTER === "mainnet"
  ? "0xbb4CdB9CBd36B01bD1cBaEBF2De08d9173bc095c"