Add wallet service and fix switchChain

packages/boba/gateway/src/services/networkService.js

@@ -745,18 +745,19 @@ class NetworkService {
       // 4902 = the chain has not been added to MetaMask.
       // So, lets add it
       if (error.code === 4902) {
+        const rpcURL = targetLayer === 'L1' ? this.L1Provider.connection.url : networkDetail[targetLayer].rpcURL
         try {
           //the chainParams are only needed for the L2s
           const chainParam = {
             chainId: '0x' + networkDetail[targetLayer].chainId.toString(16),
             chainName: networkDetail[targetLayer].name,
-            rpcUrls: this.L1Provider.connection.url,
+            rpcUrls: rpcURL,
             nativeCurrency: {
-              name: 'BOBA TOKEN',
-              symbol: 'BOBA',
+              name: networkDetail[targetLayer].tokenName,
+              symbol: networkDetail[targetLayer].symbol,
               decimals: 18,
             },
-            blockExplorerUrls: [networkDetail['L2']?.blockExplorer?.slice(0, -1)]
+            blockExplorerUrls: [networkDetail[targetLayer]?.blockExplorer?.slice(0, -1)]
           }
 
           await this.provider.send('wallet_addEthereumChain', [chainParam, this.account])

packages/boba/gateway/src/services/wallet.service.js

@@ -0,0 +1,72 @@
+/* eslint-disable quotes */
+/*
+Copyright 2021-present Boba Network.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+     http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License. */
+
+import { providers } from "ethers"
+
+class WalletService {
+  constructor() {
+    this.provider = null
+    this.account = null
+  }
+
+  async connectWallet() {
+    try {
+      await window.ethereum.request({ method: 'eth_requestAccounts' })
+      this.provider = new providers.Web3Provider(window.ethereum)
+      this.account = await this.provider.getSigner().getAddress()
+    } catch (e) {
+      console.log(`Error connecting wallet: ${e}`)
+    }
+  }
+
+  async disconnectWallet() {
+    try {
+      await window.ethereum.request({ method: "eth_requestAccounts", params: [{ eth_accounts: {} }] })
+      this.provider = null
+      this.account = null
+    } catch (e) {
+      console.log(`Error disconnecting wallet: ${e}`)
+    }
+  }
+
+  async switchChain(chainId, chainInfo) {
+    try {
+      await window.ethereum.request({
+        method: "wallet_switchEthereumChain",
+        params: [{ chainId }],
+      })
+    } catch (error) {
+      if (error.code === 4902) {
+        try {
+          await window.ethereum.request({
+            method: "wallet_addEthereumChain",
+            params: [chainInfo, this.account],
+          })
+        } catch (addError) {
+          console.log(`Error adding chain: ${addError}`)
+          throw new Error(addError.code)
+        }
+      } else {
+        console.log(`Error switching chain: ${error}`)
+        throw new Error(error.code)
+      }
+    }
+  }
+}
+
+const walletService = new WalletService();
+
+export default walletService;

packages/boba/gateway/src/util/network/config/avax.js

@@ -26,6 +26,8 @@ export const avaxConfig = {
       blockExplorer: `https://blockexplorer.testnet.avax.boba.network/`,
       transaction: `https://blockexplorer.testnet.avax.boba.network/tx/`,
       blockExplorerUrl: `https://blockexplorer.testnet.avax.boba.network/`,
+      symbol: "BOBA",
+      tokenName: "Boba Token",
     },
     gasEstimateAccount: `0xdb5a187FED81c735ddB1F6E47F28f2A5F74639b2`,
     twitterFaucetPromotionText: `https://twitter.com/intent/tweet?text=I%27m%20developing%20on%20Boba%20Avalanche%20Testnet%20for%20Avalanche%20`
@@ -57,6 +59,8 @@ export const avaxConfig = {
       blockExplorer: `https://blockexplorer.avax.boba.network/`,
       transaction: `https://blockexplorer.avax.boba.network/tx/`,
       blockExplorerUrl: `https://blockexplorer.avax.boba.network`,
+      symbol: "BOBA",
+      tokenName: "Boba Token",
     },
     gasEstimateAccount: `0xdb5a187FED81c735ddB1F6E47F28f2A5F74639b2`,
     twitterFaucetPromotionText: `https://twitter.com/intent/tweet?text=I%27m%20developing%20on%20Boba%20Avalanche%20Testnet%20for%20Avalanche%20`

packages/boba/gateway/src/util/network/config/bnb.js

@@ -27,6 +27,8 @@ export const bnbConfig = {
       blockExplorer: `https://blockexplorer.testnet.bnb.boba.network/`,
       transaction: `https://blockexplorer.testnet.bnb.boba.network/tx/`,
       blockExplorerUrl: `https://blockexplorer.testnet.bnb.boba.network/`,
+      symbol: "BOBA",
+      tokenName: "Boba Token",
     },
     gasEstimateAccount: `0xdb5a187FED81c735ddB1F6E47F28f2A5F74639b2`,
     twitterFaucetPromotionText: `https://twitter.com/intent/tweet?text=I%27m%20developing%20on%20Boba%20BNB%20Testnet%20for%20BNB%20`
@@ -58,6 +60,8 @@ export const bnbConfig = {
       blockExplorer: `https://blockexplorer.bnb.boba.network/`,
       transaction: `https://blockexplorer.bnb.boba.network/tx/`,
       blockExplorerUrl: `https://blockexplorer.bnb.boba.network/`,
+      symbol: "BOBA",
+      tokenName: "Boba Token",
     },
     gasEstimateAccount: `0xdb5a187FED81c735ddB1F6E47F28f2A5F74639b2`,
     twitterFaucetPromotionText: `https://twitter.com/intent/tweet?text=I%27m%20developing%20on%20Boba%20BNB%20Testnet%20for%20BNB%20`

packages/boba/gateway/src/util/network/config/ethereum.js

@@ -27,7 +27,9 @@ export const ethereumConfig = {
       rpcUrl: `https://goerli.boba.network`,
       blockExplorer: `https://testnet.bobascan.com/`,
       transaction: `https://testnet.bobascan.com/tx/`,
-      blockExplorerUrl: `https://testnet.bobascan.com/`
+      blockExplorerUrl: `https://testnet.bobascan.com/`,
+      symbol: 'ETH',
+      tokenName: 'ETH',
     },
     payloadForL1SecurityFee: {
       from: '0x122816e7A7AeB40601d0aC0DCAA8402F7aa4cDfA',
@@ -73,7 +75,9 @@ export const ethereumConfig = {
       rpcUrl: `https://mainnet.boba.network`,
       blockExplorer: `https://bobascan.com/`,
       transaction: `https://bobascan.com/tx/`,
-      blockExplorerUrl: `https://bobascan.com/`
+      blockExplorerUrl: `https://bobascan.com/`,
+      symbol: 'ETH',
+      tokenName: 'ETH',
     },
     payloadForL1SecurityFee: {
       from: '0x5E7a06025892d8Eef0b5fa263fA0d4d2E5C3B549',

packages/boba/gateway/src/util/network/config/fantom.js

@@ -27,6 +27,8 @@ export const fantomConfig = {
       blockExplorer: `https://blockexplorer.testnet.bobaopera.boba.network/`,
       transaction: `https://blockexplorer.testnet.bobaopera.boba.network/tx/`,
       blockExplorerUrl: `https://blockexplorer.testnet.bobaopera.boba.network/`,
+      symbol: "BOBA",
+      tokenName: "Boba Token",
     },
     gasEstimateAccount: `0xdb5a187FED81c735ddB1F6E47F28f2A5F74639b2`,
     twitterFaucetPromotionText: `https://twitter.com/intent/tweet?text=I%27m%20developing%20on%20Bobaopera%20Testnet%20for%20Fantom%20`
@@ -58,6 +60,8 @@ export const fantomConfig = {
       blockExplorer: `https://blockexplorer.bobaopera.boba.network/`,
       transaction: `https://blockexplorer.bobaopera.boba.network/tx/`,
       blockExplorerUrl: `https://blockexplorer.bobaopera.boba.network/`,
+      symbol: "BOBA",
+      tokenName: "Boba Token",
     },
     gasEstimateAccount: `0xdb5a187FED81c735ddB1F6E47F28f2A5F74639b2`,
     twitterFaucetPromotionText: `https://twitter.com/intent/tweet?text=I%27m%20developing%20on%20Bobaopera%20Testnet%20for%20Fantom%20`

packages/boba/gateway/src/util/network/config/moonbeam.js

@@ -26,6 +26,8 @@ export const moonbeamConfig = {
       blockExplorer: `https://blockexplorer.bobabase.boba.network/`,
       transaction: `https://blockexplorer.bobabase.boba.network/tx/`,
       blockExplorerUrl: `https://blockexplorer.bobabase.boba.network`,
+      symbol: "BOBA",
+      tokenName: "Boba Token",
     },
     gasEstimateAccount: `0xdb5a187FED81c735ddB1F6E47F28f2A5F74639b2`,
     twitterFaucetPromotionText: `https://twitter.com/intent/tweet?text=I%27m%20developing%20on%20Bobabase%20for%20Moonbeam%20`
@@ -57,6 +59,8 @@ export const moonbeamConfig = {
       blockExplorer: `https://blockexplorer.bobabeam.boba.network/`,
       transaction: `https://blockexplorer.bobabeam.boba.network/tx/`,
       blockExplorerUrl: `https://blockexplorer.bobabeam.boba.network/`,
+      symbol: "BOBA",
+      tokenName: "Boba Token",
     },
     gasEstimateAccount: `0xdb5a187FED81c735ddB1F6E47F28f2A5F74639b2`,
     twitterFaucetPromotionText: `https://twitter.com/intent/tweet?text=I%27m%20developing%20on%20Bobabeam%20for%20Moonbeam%20`