feat: support eip-6963.

fix: switch the Polygon Mumbai test network to the Polygon Amoy test network.
dotbitHQ · Jul 17, 2024 · fbd6f22 · fbd6f22
1 parent d548106
commit fbd6f22
Show file tree

Hide file tree

Showing 13 changed files with 138 additions and 78 deletions.
diff --git a/README-CN.md b/README-CN.md
@@ -62,7 +62,7 @@ const { Wallet } = await import('wallet-bridge')
 ```js
 import { Wallet } from 'wallet-bridge'
 import { createConfig, http } from '@wagmi/core'
-import { bsc, bscTestnet, holesky, mainnet as ethereum, polygon, polygonMumbai } from '@wagmi/core/chains'
+import { bsc, bscTestnet, holesky, mainnet as ethereum, polygon, polygonAmoy } from '@wagmi/core/chains'
 import { injected, walletConnect } from '@wagmi/connectors'
 
 const walletConnectOptions = {
@@ -76,14 +76,14 @@ const walletConnectOptions = {
 }
 
 const wagmiConfig = createConfig({
-  chains: [ethereum, holesky, bsc, bscTestnet, polygon, polygonMumbai],
+  chains: [ethereum, holesky, bsc, bscTestnet, polygon, polygonAmoy],
   transports: {
     [ethereum.id]: http(),
     [holesky.id]: http(),
     [bsc.id]: http(),
     [bscTestnet.id]: http(),
     [polygon.id]: http(),
-    [polygonMumbai.id]: http(),
+    [polygonAmoy.id]: http(),
   },
   connectors: [injected(), walletConnect(walletConnectOptions)],
 })
@@ -244,7 +244,7 @@ await onClose()
   - `canAddDevice`: 是否可以添加备份设备，类型为`boolean`。
   - `iCloudPasskeySupport`: 当前环境是否支持将 passkey 存储在 iCloud 中，类型为`boolean`。
   - `customChains`: 自定义显示的链，类型为`CustomChain[]`。
-  - `customWallets`: 自定义显示的钱包，类型为`CustomWallet[]`。
+  - `customWallets`: 自定义显示的钱包，类型为`string[]`。
   - `alias`: 当前登录的钱包地址设置的 .bit alias，类型为`string`。
   - `locale`: 当前使用的语言，类型为`string`。
   - `chainId`: 当使用 EVM 链钱包登录时表示对应的链 ID，类型为`number`。当使用 TRON 钱包登录时表示对应的链 ID，类型为`string`。

diff --git a/README.md b/README.md
@@ -62,7 +62,7 @@ To create a new `Wallet` object, you can use its constructor and provide the fol
 ```js
 import { Wallet } from 'wallet-bridge'
 import { createConfig, http } from '@wagmi/core'
-import { bsc, bscTestnet, holesky, mainnet as ethereum, polygon, polygonMumbai } from '@wagmi/core/chains'
+import { bsc, bscTestnet, holesky, mainnet as ethereum, polygon, polygonAmoy } from '@wagmi/core/chains'
 import { injected, walletConnect } from '@wagmi/connectors'
 
 const walletConnectOptions = {
@@ -76,14 +76,14 @@ const walletConnectOptions = {
 }
 
 const wagmiConfig = createConfig({
-  chains: [ethereum, holesky, bsc, bscTestnet, polygon, polygonMumbai],
+  chains: [ethereum, holesky, bsc, bscTestnet, polygon, polygonAmoy],
   transports: {
     [ethereum.id]: http(),
     [holesky.id]: http(),
     [bsc.id]: http(),
     [bscTestnet.id]: http(),
     [polygon.id]: http(),
-    [polygonMumbai.id]: http(),
+    [polygonAmoy.id]: http(),
   },
   connectors: [injected(), walletConnect(walletConnectOptions)],
 })
@@ -244,7 +244,7 @@ await onClose()
   - `canAddDevice`: Whether a backup device can be added or not, of type `boolean`.
   - `iCloudPasskeySupport`: Whether the current environment supports storing the passkey in iCloud, of type `boolean`.
   - `customChains`: Custom chains to be displayed, of type `CustomChain[]`.
-  - `customWallets`: Custom wallets to be displayed, of type `CustomWallet[]`.
+  - `customWallets`: Custom wallets to be displayed, of type `string[]`.
   - `alias`: The .bit alias set for the currently logged-in wallet address, of type `string`.
   - `locale`: The language currently in use, of type `string`.
   - `chainId`: When logging in with an EVM chain wallet, it represents the corresponding chain ID, of type `number`. When logging in with an TRON wallet, it represents the corresponding chain ID, of type `string`.

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "wallet-bridge",
   "private": false,
-  "version": "1.0.0-beta.11",
+  "version": "1.0.0-beta.12",
   "main": "./dist/wallet-bridge.umd.js",
   "module": "./dist/wallet-bridge.es.js",
   "types": "./dist/index.d.ts",

diff --git a/src/lib/constant/chain.ts b/src/lib/constant/chain.ts
@@ -5,7 +5,7 @@ export enum ChainId {
   bsc = 56,
   bscTestnet = 97,
   polygon = 137,
-  polygonMumbai = 80001,
+  polygonAmoy = 80002,
   tron = '0x2b6653dc',
   tronNile = '0xcd8690dc',
   btc = 'livenet',
@@ -34,7 +34,7 @@ export const CoinTypeToChainIdMap: Record<string, number | string> = {
 export const CoinTypeToTestNetChainIdMap: Record<string, number | string> = {
   [CoinType.eth]: ChainId.ethHolesky,
   [CoinType.bsc]: ChainId.bscTestnet,
-  [CoinType.matic]: ChainId.polygonMumbai,
+  [CoinType.matic]: ChainId.polygonAmoy,
   [CoinType.trx]: ChainId.tronNile,
   [CoinType.btc]: ChainId.btcTestnet,
 }
@@ -48,7 +48,7 @@ export const CoinTypeToTorusHostMap: Record<string, string> = {
 export const CoinTypeToTorusHostTestNetMap: Record<string, string> = {
   [CoinType.eth]: 'holesky',
   [CoinType.bsc]: 'bsc_testnet',
-  [CoinType.matic]: 'mumbai',
+  [CoinType.matic]: 'amoy',
 }
 
 export const ChainIdToCoinTypeMap: Record<string, CoinType> = {
@@ -62,7 +62,7 @@ export const ChainIdToCoinTypeMap: Record<string, CoinType> = {
 export const ChainIdToCoinTypeTestNetMap: Record<string, CoinType> = {
   [ChainId.ethHolesky]: CoinType.eth,
   [ChainId.bscTestnet]: CoinType.bsc,
-  [ChainId.polygonMumbai]: CoinType.matic,
+  [ChainId.polygonAmoy]: CoinType.matic,
   [ChainId.tronNile]: CoinType.trx,
   [ChainId.btcTestnet]: CoinType.btc,
 }
@@ -155,7 +155,7 @@ export const Polygon: IMainChain = {
   icon: 'polygon',
   tokenId: 'polygon_matic',
   explorerTrx: 'https://polygonscan.com/tx/',
-  testExplorerTrx: 'https://mumbai.polygonscan.com/tx/',
+  testExplorerTrx: 'https://amoy.polygonscan.com/tx/',
 }
 
 export const DOGE: IMainChain = {
@@ -190,14 +190,14 @@ export const CoinTypeToChainMap: Record<string, IMainChain> = {
   [CoinType.ckb]: CKB,
 }
 
-export enum CustomWallet {
-  metaMask = 'MetaMask',
-  trustWallet = 'TrustWallet',
-  imToken = 'imToken',
-  tokenPocket = 'TokenPocket',
-  unisat = 'Unisat',
-  oneKey = 'OneKey',
-  iToken = 'iToken',
-  tronLink = 'TronLink',
-  walletConnect = 'WalletConnect',
+export const CustomWallet: Record<string, string> = {
+  metaMask: 'MetaMask',
+  trustWallet: 'TrustWallet',
+  imToken: 'imToken',
+  tokenPocket: 'TokenPocket',
+  unisat: 'Unisat',
+  oneKey: 'OneKey',
+  iToken: 'iToken',
+  tronLink: 'TronLink',
+  walletConnect: 'WalletConnect',
 }
diff --git a/src/lib/store/index.ts b/src/lib/store/index.ts
@@ -5,7 +5,6 @@ import {
   CoinTypeToChainIdMap,
   CoinTypeToTestNetChainIdMap,
   CustomChain,
-  CustomWallet,
   DotbitIndexerApi,
   DotbitIndexerTestApi,
   WalletProtocol,
@@ -39,7 +38,7 @@ export interface WalletState {
   isSwitchAddress?: boolean
   iCloudPasskeySupport?: boolean
   customChains?: CustomChain[]
-  customWallets?: CustomWallet[]
+  customWallets?: string[]
   alias?: string
   locale?: string
 }

diff --git a/src/lib/ui/Login/WalletList.tsx b/src/lib/ui/Login/WalletList.tsx
@@ -16,10 +16,11 @@ import OneKeyIcon from './icon/onekey-icon.svg'
 import TronLinkIcon from './icon/tronlink-icon.svg'
 import WalletConnectIcon from './icon/walletconnect-icon.svg'
 import { t } from '@lingui/macro'
+import { getConnectors } from '@wagmi/core'
 
 interface IWallet {
   icon: ReactNode
-  name: CustomWallet
+  name: string
   supportList: CoinType[]
 }
 
@@ -32,29 +33,19 @@ export const WalletList = ({ transitionRef, transitionStyle }: SwapChildProps) =
   const { walletSnap } = useWalletState()
 
   const wallets = useMemo<IWallet[]>(() => {
-    return [
+    const connectors = getConnectors(walletSDK.context.wagmiConfig)
+
+    let list = [
       {
         // eslint-disable-next-line lingui/no-unlocalized-strings
         icon: <img className="size-10" src={WalletConnectIcon} alt="WalletConnect" />,
         name: CustomWallet.walletConnect,
         supportList: [CoinType.eth, CoinType.bsc, CoinType.matic],
       },
-      {
-        // eslint-disable-next-line lingui/no-unlocalized-strings
-        icon: <img className="size-10" src={MetaMaskIcon} alt="MetaMask" />,
-        name: CustomWallet.metaMask,
-        supportList: [CoinType.eth, CoinType.bsc, CoinType.matic],
-      },
-      {
-        // eslint-disable-next-line lingui/no-unlocalized-strings
-        icon: <img className="size-10" src={TrustWalletIcon} alt="TrustWallet" />,
-        name: CustomWallet.trustWallet,
-        supportList: [CoinType.eth, CoinType.bsc, CoinType.matic],
-      },
       {
         icon: <img className="size-10" src={ImTokenIcon} alt="imToken" />,
         name: CustomWallet.imToken,
-        supportList: [CoinType.eth, CoinType.bsc, CoinType.matic, CoinType.trx],
+        supportList: [CoinType.trx],
       },
       // {
       //   icon: <img className="size-10" src={UnisatIcon} alt="Unisat" />,
@@ -65,27 +56,84 @@ export const WalletList = ({ transitionRef, transitionStyle }: SwapChildProps) =
         // eslint-disable-next-line lingui/no-unlocalized-strings
         icon: <img className="size-10" src={TokenPocketIcon} alt="TokenPocket" />,
         name: CustomWallet.tokenPocket,
-        supportList: [CoinType.eth, CoinType.bsc, CoinType.matic, CoinType.trx, CoinType.doge],
-      },
-      {
-        // eslint-disable-next-line lingui/no-unlocalized-strings
-        icon: <img className="size-10" src={OneKeyIcon} alt="OneKey" />,
-        name: CustomWallet.oneKey,
-        supportList: [CoinType.eth, CoinType.bsc, CoinType.matic],
+        supportList: [CoinType.trx, CoinType.doge],
       },
-      // {
-      //   icon: <img className="h-10 w-10" src={ITokenIcon} alt="iToken" />,
-      //   name: CustomWallet.iToken,
-      //   supportList: [CoinType.eth, CoinType.bsc, CoinType.matic],
-      // },
       {
         // eslint-disable-next-line lingui/no-unlocalized-strings
         icon: <img className="size-10" src={TronLinkIcon} alt="TronLink" />,
         name: CustomWallet.tronLink,
         supportList: [CoinType.trx],
       },
     ]
-  }, [])
+
+    if (connectors.length > 2) {
+      connectors.forEach((connector) => {
+        if (connector.name !== 'WalletConnect' && connector.name !== 'Injected') {
+          list.unshift({
+            icon: <img className="size-10" src={connector.icon} alt={connector.name} />,
+            name: connector.name,
+            supportList: [CoinType.eth, CoinType.bsc, CoinType.matic],
+          })
+        }
+      })
+    } else {
+      list = [
+        {
+          // eslint-disable-next-line lingui/no-unlocalized-strings
+          icon: <img className="size-10" src={WalletConnectIcon} alt="WalletConnect" />,
+          name: CustomWallet.walletConnect,
+          supportList: [CoinType.eth, CoinType.bsc, CoinType.matic],
+        },
+        {
+          // eslint-disable-next-line lingui/no-unlocalized-strings
+          icon: <img className="size-10" src={MetaMaskIcon} alt="MetaMask" />,
+          name: CustomWallet.metaMask,
+          supportList: [CoinType.eth, CoinType.bsc, CoinType.matic],
+        },
+        {
+          // eslint-disable-next-line lingui/no-unlocalized-strings
+          icon: <img className="size-10" src={TrustWalletIcon} alt="TrustWallet" />,
+          name: CustomWallet.trustWallet,
+          supportList: [CoinType.eth, CoinType.bsc, CoinType.matic],
+        },
+        {
+          icon: <img className="size-10" src={ImTokenIcon} alt="imToken" />,
+          name: CustomWallet.imToken,
+          supportList: [CoinType.eth, CoinType.bsc, CoinType.matic, CoinType.trx],
+        },
+        // {
+        //   icon: <img className="size-10" src={UnisatIcon} alt="Unisat" />,
+        //   name: CustomWallet.unisat,
+        //   supportList: [CoinType.btc],
+        // },
+        {
+          // eslint-disable-next-line lingui/no-unlocalized-strings
+          icon: <img className="size-10" src={TokenPocketIcon} alt="TokenPocket" />,
+          name: CustomWallet.tokenPocket,
+          supportList: [CoinType.eth, CoinType.bsc, CoinType.matic, CoinType.trx, CoinType.doge],
+        },
+        {
+          // eslint-disable-next-line lingui/no-unlocalized-strings
+          icon: <img className="size-10" src={OneKeyIcon} alt="OneKey" />,
+          name: CustomWallet.oneKey,
+          supportList: [CoinType.eth, CoinType.bsc, CoinType.matic],
+        },
+        // {
+        //   icon: <img className="h-10 w-10" src={ITokenIcon} alt="iToken" />,
+        //   name: CustomWallet.iToken,
+        //   supportList: [CoinType.eth, CoinType.bsc, CoinType.matic],
+        // },
+        {
+          // eslint-disable-next-line lingui/no-unlocalized-strings
+          icon: <img className="size-10" src={TronLinkIcon} alt="TronLink" />,
+          name: CustomWallet.tronLink,
+          supportList: [CoinType.trx],
+        },
+      ]
+    }
+
+    return list
+  }, [walletSDK.context.wagmiConfig])
 
   const showWallets = useMemo(() => {
     const { coinType } = loginCacheSnap

diff --git a/src/lib/ui/Wallet/wallet.stories.tsx b/src/lib/ui/Wallet/wallet.stories.tsx
@@ -3,7 +3,7 @@ import { Button } from '../../components'
 import { Wallet } from '../index'
 import { loadScript } from '../../utils'
 import { createConfig, http } from '@wagmi/core'
-import { bsc, bscTestnet, holesky, mainnet as ethereum, polygon, polygonMumbai } from '@wagmi/core/chains'
+import { bsc, bscTestnet, holesky, mainnet as ethereum, polygon, polygonAmoy } from '@wagmi/core/chains'
 import { injected, walletConnect } from '@wagmi/connectors'
 import handleError from '../../utils/handleError'
 
@@ -22,14 +22,14 @@ const walletConnectOptions = {
 }
 
 const wagmiConfig = createConfig({
-  chains: [ethereum, holesky, bsc, bscTestnet, polygon, polygonMumbai],
+  chains: [ethereum, holesky, bsc, bscTestnet, polygon, polygonAmoy],
   transports: {
     [ethereum.id]: http(),
     [holesky.id]: http(),
     [bsc.id]: http(),
     [bscTestnet.id]: http(),
     [polygon.id]: http(),
-    [polygonMumbai.id]: http(),
+    [polygonAmoy.id]: http(),
   },
   connectors: [injected(), walletConnect(walletConnectOptions)],
 })
@@ -94,10 +94,14 @@ const TemplateConnectWallet = () => {
     try {
       const message = '0x123abc'
       const signature = await signData(message)
-      console.log(signature)
+      // const { signData: signData2, onClose: onClose2 } = await wallet.walletSDK?.initSignContext()
+      // const signature2 = await signData2('0x123abcd')
+
+      console.log('signature: ', signature)
+      // console.log('signature2: ', signature2)
       // only Passkey-signed transactions can be verified.
-      const res = await wallet._verifyPasskeySignature({ message, signature: signature as string })
-      console.log(res)
+      // const res = await wallet._verifyPasskeySignature({ message, signature: signature as string })
+      // console.log(res)
     } catch (err: any) {
       handleError(err)
       onClose?.()

diff --git a/src/lib/ui/index.ts b/src/lib/ui/index.ts
@@ -2,7 +2,7 @@ import WalletSDK from '../wallets'
 import { useWalletState, getWalletState, setWalletState } from '../store'
 import { InitSignContextRes } from '../types'
 import { ISendTrxParams } from '../wallets/WalletTransactionHandler'
-import { CustomChain, CustomWallet } from '../constant'
+import { CustomChain } from '../constant'
 import { SignDataParams } from '../wallets/WalletSignerHandler'
 import { detect, fromNavigator, fromStorage, fromUrl } from '@lingui/detect-locale'
 import { getShadowDomRoot } from '../utils'
@@ -25,7 +25,7 @@ export class Wallet {
     isTestNet?: boolean
     loggedInSelectAddress?: boolean
     customChains?: CustomChain[]
-    customWallets?: CustomWallet[]
+    customWallets?: string[]
     wagmiConfig?: any
     gtag?: any
     event?: any

diff --git a/src/lib/utils/index.ts b/src/lib/utils/index.ts
@@ -503,7 +503,7 @@ export function getConnector(wagmiConfig: Config, walletName: string): Connector
     })
   } else {
     const connector = connectors.find((item: Connector) => {
-      return item.type === 'injected' && item.name !== 'Injected'
+      return item.type === 'injected' && item.name === walletName
     })
     if (connector) {
       return connector

diff --git a/src/lib/wallets/WalletContext.ts b/src/lib/wallets/WalletContext.ts
@@ -262,6 +262,15 @@ export class WalletContext {
                 ticker: 'ETH',
                 tickerName: 'Ethereum',
               }
+            : host === 'amoy'
+            ? {
+                host: 'https://rpc.ankr.com/polygon_amoy',
+                chainId: this.chainId as number,
+                networkName: 'Amoy Test Network',
+                blockExplorer: 'https://amoy.polygonscan.com',
+                ticker: 'Matic',
+                tickerName: 'Polygon',
+              }
             : {
                 host,
               },