diff --git a/src/App.vue b/src/App.vue index e684b8d..7bbedfa 100644 --- a/src/App.vue +++ b/src/App.vue @@ -14,9 +14,10 @@ const targetNetwork = ref(DEFAULT_NETWORK); const web3Onboard = init({ wallets: [injected], - chains: Object.entries(Networks).map(([, network]) => ({ + chains: Object.values(Networks).map((network) => ({ id: network.id, - label: network.nativeCurrency.symbol, + token: network.nativeCurrency.symbol, + label: network.name, rpcUrl: network.rpcUrls.default.http[0], })), connect: { diff --git a/src/components/TopBar/TopBar.vue b/src/components/TopBar/TopBar.vue index d705a22..3567f05 100644 --- a/src/components/TopBar/TopBar.vue +++ b/src/components/TopBar/TopBar.vue @@ -80,9 +80,10 @@ const closeMenu = (): void => { const networkChange = async (network: NetworkConfig): Promise => { currencyMenuOpenToggle.value = false; + const chainId = network.id.toString(16) try { await setChain({ - chainId: String(network.id), + chainId: `0x${chainId}`, wallet: connectedWallet.value?.label || "", }); user.setNetwork(network); diff --git a/src/components/ui/ToasterComponent.vue b/src/components/ui/ToasterComponent.vue index b240ed4..98a10c2 100644 --- a/src/components/ui/ToasterComponent.vue +++ b/src/components/ui/ToasterComponent.vue @@ -23,11 +23,12 @@ const checkNetwork = () => { const switchNetwork = async () => { try { if (connectedWallet.value && connectedWallet.value.provider) { + let chainId = network.value.id.toString(16); await connectedWallet.value.provider.request({ method: "wallet_switchEthereumChain", params: [ { - chainId: network.value.id, + chainId: `0x${chainId}`, }, ], }); diff --git a/src/config/networks.ts b/src/config/networks.ts index a236ba2..0192dad 100644 --- a/src/config/networks.ts +++ b/src/config/networks.ts @@ -12,7 +12,7 @@ export const Networks: {[key:string]: NetworkConfig} = { subgraphUrls: [import.meta.env.VITE_SEPOLIA_SUBGRAPH_URL] }, rootstockTestnet: { ...rootstockTestnet, - rpcUrls: { default: { http: [import.meta.env.VITE_ROOTSTOCK_API_URL]}}, + rpcUrls: { default: { http: [import.meta.env.VITE_RSK_API_URL]}}, contracts: { ...rootstockTestnet.contracts, p2pix: {address:"0x57Dcba05980761169508886eEdc6f5E7EC0411Dc"} }, tokens: { diff --git a/src/utils/imagesPath.ts b/src/utils/imagesPath.ts index 5100d43..cded67c 100644 --- a/src/utils/imagesPath.ts +++ b/src/utils/imagesPath.ts @@ -7,17 +7,16 @@ export const imagesPath = import.meta.glob("@/assets/*.{png,svg}", { }); export const getNetworkImage = (networkName: string): string => { + const imageName = networkName + .toLowerCase() + .replace(/[^a-z0-9]/g, '-'); try { const path = Object.keys(imagesPath).find((key) => - key.endsWith(`${networkName.toLowerCase()}.svg`) + key.endsWith(`${imageName}.svg`) ); return path ? imagesPath[path] : ""; } catch (error) { console.error("Error fetching network image"); - const path = Object.keys(imagesPath).find((key) => - key.endsWith(`invalidIcon.svg`) - ); - return path ? imagesPath[path] : ""; return ""; } };