Skip to content

Commit e3783f9

Browse files
sdqedesdqede
committed
auto swit chain success
1 parent ec011ae commit e3783f9

File tree

5 files changed

+147
-40
lines changed

5 files changed

+147
-40
lines changed

‎examples/ethereum/app/page.tsx

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { MetaMaskInpageProvider } from "@metamask/providers";
88
import BigNumber from "bignumber.js";
99
import { useChain } from '@interchain-kit/react'
1010
import { WalletState } from "@interchain-kit/core"
11-
import { HOLESKY_TESTNET } from "./provider"
11+
import { BSC_TESTNET, HOLESKY_TESTNET, SEPOLIA_TESTNET } from "./provider"
1212

1313
type EthereumProvider = MetaMaskInpageProvider
1414

@@ -28,14 +28,14 @@ export default function WalletPage() {
2828
const [error, setError] = useState("")
2929
const [ethereum, setEthereum] = useState<EthereumProvider>()
3030

31-
const { wallet, status, connect, address: account, disconnect } = useChain('ethereum')
31+
const { wallet, status, connect, address: account, disconnect } = useChain(SEPOLIA_TESTNET.chainName) // chain name must be same as getProvider chain id
3232

3333
useEffect(() => {
3434
console.log('status from useChain:', status)
3535
if (status === WalletState.Connected) {
3636
const setEthProviderFromWallet = async () => {
3737
await new Promise(resolve => setTimeout(resolve, 500))
38-
const ethProviderFromWallet = await wallet.getProvider(HOLESKY_TESTNET.chainId) as EthereumProvider
38+
const ethProviderFromWallet = await wallet.getProvider(SEPOLIA_TESTNET.chainId) as EthereumProvider
3939
console.log("Ethereum provider:", ethProviderFromWallet)
4040
setEthereum(ethProviderFromWallet)
4141
}
@@ -157,8 +157,15 @@ export default function WalletPage() {
157157
</Box>
158158

159159
<Box className="flex flex-col space-y-1">
160-
<Box className="flex justify-between items-center">
161-
<FieldLabel htmlFor="balance" label="ETH Balance">ETH Balance</FieldLabel>
160+
<Box className="flex items-center">
161+
<Box className="flex-1">
162+
<FieldLabel htmlFor="balance" label="ETH Balance">ETH Balance</FieldLabel>
163+
</Box>
164+
<Button size="sm" className="mr-2">
165+
<a href="https://cloud.google.com/application/web3/faucet/ethereum/sepolia"
166+
target="_blank"
167+
>Faucet</a>
168+
</Button>
162169
<Button onClick={refreshBalance} disabled={isLoading} size="sm">
163170
<RefreshCw className="h-4 w-4" />
164171
</Button>

‎examples/ethereum/app/provider.tsx

Lines changed: 35 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,38 @@ import { ThemeProvider } from "@interchain-ui/react";
66
import { ChainProvider } from "@interchain-kit/react";
77
import { metaMaskWallet } from '@interchain-kit/metamask-extension'
88
import { assetList, chain } from '@chain-registry/v2/mainnet/ethereum'
9+
import { createChainFromEthereumChainInfo } from '@/lib/eth-test-net';
10+
11+
for (const asset of assetList.assets) {
12+
if (asset.symbol === 'ETH') {
13+
asset.logoURIs = {
14+
png: 'https://raw.githubusercontent.com/cosmos/chain-registry/master/_non-cosmos/ethereum/images/eth-white.png',
15+
svg: 'https://raw.githubusercontent.com/cosmos/chain-registry/master/_non-cosmos/ethereum/images/eth-white.svg'
16+
}
17+
}
18+
}
919

1020
const _wallets = [
1121
metaMaskWallet,
1222
];
1323

24+
export const SEPOLIA_TESTNET = {
25+
chainId: "11155111", // 11155111(0xaa36a7)
26+
chainName: "Sepolia",
27+
rpcUrls: ["https://1rpc.io/sepolia"],
28+
nativeCurrency: {
29+
name: "Sepolia ETH",
30+
symbol: "ETH",
31+
decimals: 18,
32+
},
33+
blockExplorerUrls: ["https://sepolia.etherscan.io"],
34+
}
35+
const sepoliaChain = createChainFromEthereumChainInfo(SEPOLIA_TESTNET)
36+
1437
// reference: https://github.com/hyperweb-io/interchain-kit/blob/main/examples/react/src/main.tsx#L86
1538
export const HOLESKY_TESTNET = {
16-
chainId: "0x4268", // 17000 | 0x4268
17-
chainName: "Holesky testnet",
39+
chainId: "17000", // 17000 | 0x4268
40+
chainName: "Holesky",
1841
rpcUrls: ["https://1rpc.io/holesky"],
1942
nativeCurrency: {
2043
name: "Holesky ETH",
@@ -24,6 +47,8 @@ export const HOLESKY_TESTNET = {
2447
blockExplorerUrls: ["https://holesky.etherscan.io"],
2548
};
2649

50+
const holeskyChain = createChainFromEthereumChainInfo(HOLESKY_TESTNET)
51+
2752
export const BSC_TESTNET = {
2853
chainId: "97",
2954
chainName: "Binance Smart Chain Testnet",
@@ -36,6 +61,8 @@ export const BSC_TESTNET = {
3661
blockExplorerUrls: ["https://testnet.bscscan.com"],
3762
};
3863

64+
const bscChain = createChainFromEthereumChainInfo(BSC_TESTNET)
65+
3966
const assets = [
4067
{
4168
"description": "",
@@ -89,17 +116,17 @@ export default function Provider({
89116
return (
90117
<ThemeProvider themeMode='light'>
91118
<ChainProvider
92-
chains={[chain,
93-
// @ts-ignore
94-
HOLESKY_TESTNET,
95-
// @ts-ignore
96-
BSC_TESTNET
119+
chains={[
120+
chain, // chainid = 0x1
121+
holeskyChain,
122+
bscChain,
123+
sepoliaChain
97124
]}
98125
// @ts-ignore
99126
wallets={_wallets}
100127
assetLists={[{
101128
...assetList,
102-
assets: [...assetList.assets, ...assets]
129+
// assets: [...assetList.assets, ...assets]
103130
}]}
104131
signerOptions={{}}
105132
>

‎examples/ethereum/lib/eth-test-net.ts

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
2+
import { AssetList, Chain } from "@chain-registry/v2-types";
3+
import ethereumChain from '@chain-registry/v2/mainnet/ethereum/chain'
4+
5+
type EthereumChainConfig = {
6+
chainId: string; // Chain ID in hexadecimal format
7+
chainName: string; // Human-readable name of the chain
8+
rpcUrls: string[]; // Array of RPC URLs for the chain
9+
nativeCurrency: {
10+
name: string; // Name of the native currency (e.g., "Goerli ETH")
11+
symbol: string; // Symbol of the native currency (e.g., "ETH")
12+
decimals: number; // Number of decimals for the native currency
13+
};
14+
blockExplorerUrls?: string[]; // Optional array of block explorer URLs
15+
};
16+
17+
export const createChainFromEthereumChainInfo = (etherChainInfo: EthereumChainConfig): Chain => {
18+
const newChain = {
19+
...ethereumChain,
20+
chainId: etherChainInfo.chainId,
21+
chainName: etherChainInfo.chainName,
22+
apis: {
23+
rpc: etherChainInfo.rpcUrls.map((address) => ({ address })),
24+
},
25+
}
26+
return newChain
27+
}
28+
29+
export const createAssetListFromEthereumChainInfo = (etherChainInfo: EthereumChainConfig): AssetList => {
30+
return {
31+
$schema: '../../assetlist.schema.json',
32+
chainName: etherChainInfo.chainName,
33+
assets: [
34+
{
35+
description: 'Ethereum is a decentralized blockchain platform for running smart contracts and dApps, with Ether (ETH) as its native cryptocurrency, enabling a versatile ecosystem beyond just digital currency.',
36+
extendedDescription: 'Ethereum, symbolized as ETH, is a groundbreaking cryptocurrency and blockchain platform introduced in 2015 by a team led by Vitalik Buterin. Unlike Bitcoin, which primarily serves as a digital currency, Ethereum is designed to be a decentralized platform for running smart contracts and decentralized applications (dApps). These smart contracts are self-executing contracts with the terms directly written into code, enabling trustless and automated transactions without intermediaries. Ethereum\'s blockchain can host a wide variety of applications, from financial services to gaming, making it a versatile and powerful tool in the world of blockchain technology.\n\nOne of the most notable features of Ethereum is its native cryptocurrency, Ether (ETH), which is used to pay for transaction fees and computational services on the network. Ethereum has also been the backbone for the explosive growth of decentralized finance (DeFi), which seeks to recreate traditional financial systems with blockchain-based alternatives. Additionally, Ethereum is undergoing a significant upgrade known as Ethereum 2.0, which aims to improve scalability, security, and energy efficiency through a shift from proof-of-work (PoW) to proof-of-stake (PoS) consensus mechanisms. This transition is expected to enhance the network\'s performance and reduce its environmental impact, further solidifying Ethereum\'s position as a leading platform in the blockchain ecosystem.',
37+
denomUnits: [
38+
{
39+
denom: 'wei',
40+
exponent: 0
41+
},
42+
{
43+
denom: 'gwei',
44+
exponent: 9
45+
},
46+
{
47+
denom: 'eth',
48+
exponent: etherChainInfo.nativeCurrency.decimals,
49+
aliases: ['ether']
50+
}
51+
],
52+
typeAsset: 'evm-base',
53+
base: 'wei',
54+
name: etherChainInfo.chainName,
55+
display: 'eth',
56+
symbol: etherChainInfo.nativeCurrency.symbol,
57+
logoURIs: {
58+
png: 'https://raw.githubusercontent.com/cosmos/chain-registry/master/_non-cosmos/ethereum/images/eth-white.png',
59+
svg: 'https://raw.githubusercontent.com/cosmos/chain-registry/master/_non-cosmos/ethereum/images/eth-white.svg'
60+
},
61+
coingeckoId: 'ethereum',
62+
images: [{
63+
png: 'https://raw.githubusercontent.com/cosmos/chain-registry/master/_non-cosmos/ethereum/images/eth-white.png',
64+
svg: 'https://raw.githubusercontent.com/cosmos/chain-registry/master/_non-cosmos/ethereum/images/eth-white.svg',
65+
theme: {
66+
primaryColorHex: '#303030'
67+
}
68+
}]
69+
}
70+
]
71+
}
72+
}
73+

‎examples/ethereum/package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,10 @@
1111
"dependencies": {
1212
"@chain-registry/v2": "^1.71.188",
1313
"@hookform/resolvers": "^3.9.1",
14-
"@interchain-kit/core": "0.3.16",
15-
"@interchain-kit/keplr-extension": "0.3.16",
16-
"@interchain-kit/metamask-extension": "0.3.16",
17-
"@interchain-kit/react": "0.3.16",
14+
"@interchain-kit/core": "0.3.18",
15+
"@interchain-kit/keplr-extension": "0.3.18",
16+
"@interchain-kit/metamask-extension": "0.3.18",
17+
"@interchain-kit/react": "0.3.18",
1818
"@interchain-ui/react": "1.26.1",
1919
"@interchainjs/ethereum": "^1.11.4",
2020
"@keplr-wallet/types": "^0.12.221",

‎examples/ethereum/yarn.lock

Lines changed: 23 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -460,10 +460,10 @@ __metadata:
460460
dependencies:
461461
"@chain-registry/v2": "npm:^1.71.188"
462462
"@hookform/resolvers": "npm:^3.9.1"
463-
"@interchain-kit/core": "npm:0.3.16"
464-
"@interchain-kit/keplr-extension": "npm:0.3.16"
465-
"@interchain-kit/metamask-extension": "npm:0.3.16"
466-
"@interchain-kit/react": "npm:0.3.16"
463+
"@interchain-kit/core": "npm:0.3.18"
464+
"@interchain-kit/keplr-extension": "npm:0.3.18"
465+
"@interchain-kit/metamask-extension": "npm:0.3.18"
466+
"@interchain-kit/react": "npm:0.3.18"
467467
"@interchain-ui/react": "npm:1.26.1"
468468
"@interchainjs/ethereum": "npm:^1.11.4"
469469
"@keplr-wallet/types": "npm:^0.12.221"
@@ -674,9 +674,9 @@ __metadata:
674674
languageName: node
675675
linkType: hard
676676

677-
"@interchain-kit/core@npm:0.3.16, @interchain-kit/core@npm:^0.3.16":
678-
version: 0.3.16
679-
resolution: "@interchain-kit/core@npm:0.3.16"
677+
"@interchain-kit/core@npm:0.3.18":
678+
version: 0.3.18
679+
resolution: "@interchain-kit/core@npm:0.3.18"
680680
dependencies:
681681
"@chain-registry/v2": "npm:^1.71.71"
682682
"@chain-registry/v2-keplr": "npm:^0.0.72"
@@ -694,35 +694,35 @@ __metadata:
694694
buffer: "npm:^6.0.3"
695695
interchainjs: "npm:1.11.5"
696696
long: "npm:^5.2.3"
697-
checksum: 10c0/8245c845ad67752c4027086431f1a800f5549b419f83e1dbd342ee4f39a8bd26e13bc9323d799deb1de6df388bbc09883561b7346b6b91dc5fe9f255fc540dd1
697+
checksum: 10c0/99c335a45b63aeb94d1e3ec2c978b35efb26136533d231325e51f140c5c28d469600a29c44f563bcd24137b97bb443eeea9ca8de7566d47355426c31e345437d
698698
languageName: node
699699
linkType: hard
700700

701-
"@interchain-kit/keplr-extension@npm:0.3.16":
702-
version: 0.3.16
703-
resolution: "@interchain-kit/keplr-extension@npm:0.3.16"
701+
"@interchain-kit/keplr-extension@npm:0.3.18":
702+
version: 0.3.18
703+
resolution: "@interchain-kit/keplr-extension@npm:0.3.18"
704704
dependencies:
705-
"@interchain-kit/core": "npm:^0.3.16"
705+
"@interchain-kit/core": "npm:0.3.18"
706706
"@keplr-wallet/provider-extension": "npm:^0.12.102"
707-
checksum: 10c0/ed3ae6a6dcdde6fb1b9c94d426aba0003d95627ee96cbcf1f08c5296917ded745fab47e8553b3b667b71afdd248e38d3e4f208fe0065c2078ba3d94b02ff69c8
707+
checksum: 10c0/d4ad7dc649b7eaaded4b59845ddeef9f2293d7886bc37857f92c5475707a8c58549ac15c64b4a9ca94436221b34e4bed6a22115a5104700c2891c63c9debe4d6
708708
languageName: node
709709
linkType: hard
710710

711-
"@interchain-kit/metamask-extension@npm:0.3.16":
712-
version: 0.3.16
713-
resolution: "@interchain-kit/metamask-extension@npm:0.3.16"
711+
"@interchain-kit/metamask-extension@npm:0.3.18":
712+
version: 0.3.18
713+
resolution: "@interchain-kit/metamask-extension@npm:0.3.18"
714714
dependencies:
715-
"@interchain-kit/core": "npm:^0.3.16"
716-
checksum: 10c0/bbe7a75935956913c3801204f28773a5129c7169b990edc0c85c2776b0434d1820b26f9458d43480a126c6ec99c85275a71045d0539a3cf1c6ccf69c7ee50481
715+
"@interchain-kit/core": "npm:0.3.18"
716+
checksum: 10c0/13f20e36085587d199f7a9dc7b53197d293389bfe35d857e1c8f61e512bb2cdec4f8f3c3e078d0104f8ed2df47fc792d121264b0182a2321ee894b8af7d3d0ce
717717
languageName: node
718718
linkType: hard
719719

720-
"@interchain-kit/react@npm:0.3.16":
721-
version: 0.3.16
722-
resolution: "@interchain-kit/react@npm:0.3.16"
720+
"@interchain-kit/react@npm:0.3.18":
721+
version: 0.3.18
722+
resolution: "@interchain-kit/react@npm:0.3.18"
723723
dependencies:
724724
"@chain-registry/v2-types": "npm:^0.53.40"
725-
"@interchain-kit/core": "npm:^0.3.16"
725+
"@interchain-kit/core": "npm:0.3.18"
726726
"@interchain-ui/react": "npm:1.26.1"
727727
"@interchainjs/cosmos": "npm:1.11.5"
728728
"@interchainjs/cosmos-types": "npm:1.11.5"
@@ -735,7 +735,7 @@ __metadata:
735735
"@types/react-dom": ^19.0.0
736736
react: ^19.0.0
737737
react-dom: ^19.0.0
738-
checksum: 10c0/8716053fa6e28d2842398e972a23f2ca208d697243eb904244ac8004df79d53a1373a7e3c0d103d796d27db305079961794e04d63ad6658937ee88b227c812f7
738+
checksum: 10c0/aad9f2d3675463e6a9ff5afd7fa4ff6dde9d53d0bfb67f79ef3a94e9cfbc01729fe64cad855a718eaea43b51f889240686b97961b9b00acd0badee885d4e5948
739739
languageName: node
740740
linkType: hard
741741

0 commit comments

Comments
 (0)