Skip to content

Commit c22eb4d

Browse files
yutingzhao1991tingzhao.ytzthinkasany
authored
feat: support auto generate wagmi config (#1122)
* feat: support auto generate wagmi config * chore: add changelog * fix: tsconfig for @ant-design/web3-assets/wallets * fix: test case * fix: tslint * Update packages/wagmi/src/wallets/coinbase-wallet.tsx Co-authored-by: thinkasany <[email protected]> * test: add test case * fix: wallet name match bug * chore: update demo * test: update test case * chore: update doc * chore: update test config --------- Co-authored-by: tingzhao.ytz <[email protected]> Co-authored-by: thinkasany <[email protected]>
1 parent 5fdd4ee commit c22eb4d

35 files changed

+961
-410
lines changed

‎.changeset/fuzzy-singers-search.md

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
'@ant-design/web3-assets': minor
3+
'@ant-design/web3-wagmi': minor
4+
---
5+
6+
feat: @ant-design/web3-wagmi support auto generate config, and add @ant-design/web3-assets/wallets export

‎docs/guide/demos/guide.tsx

+3-17
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,6 @@ import {
1111
import { TinyColor } from '@ctrl/tinycolor';
1212
import { Col, ConfigProvider, Radio, Row, Select, Slider, Space, Switch } from 'antd';
1313
import type { ConfigProviderProps } from 'antd';
14-
import { createConfig, http } from 'wagmi';
15-
import { mainnet } from 'wagmi/chains';
16-
import { walletConnect } from 'wagmi/connectors';
1714

1815
import styles from './guide.module.less';
1916
import { themeList, type ThemeSetting, type ThemeValue } from './tokens';
@@ -22,19 +19,6 @@ type SizeType = ConfigProviderProps['componentSize'];
2219

2320
const defaultRadius = 8;
2421

25-
const config = createConfig({
26-
chains: [mainnet],
27-
transports: {
28-
[mainnet.id]: http(),
29-
},
30-
connectors: [
31-
walletConnect({
32-
showQrModal: false,
33-
projectId: YOUR_WALLET_CONNECT_PROJECT_ID,
34-
}),
35-
],
36-
});
37-
3822
const ThemeLabel: React.FC<{ theme: ThemeSetting }> = ({ theme }) => {
3923
return (
4024
<Space
@@ -72,6 +56,9 @@ const App: React.FC = () => {
7256
eip6963={{
7357
autoAddInjectedWallets: true,
7458
}}
59+
walletConnect={{
60+
projectId: YOUR_WALLET_CONNECT_PROJECT_ID,
61+
}}
7562
ens
7663
wallets={[
7764
MetaMask(),
@@ -81,7 +68,6 @@ const App: React.FC = () => {
8168
}),
8269
OkxWallet(),
8370
]}
84-
config={config}
8571
>
8672
<ConfigProvider
8773
theme={{

‎docs/guide/demos/quick-start.tsx

+1-10
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,9 @@
11
import { NFTImage } from '@ant-design/web3';
22
import { WagmiWeb3ConfigProvider } from '@ant-design/web3-wagmi';
3-
import { createConfig, http } from 'wagmi';
4-
import { mainnet } from 'wagmi/chains';
5-
6-
const config = createConfig({
7-
chains: [mainnet],
8-
transports: {
9-
[mainnet.id]: http(),
10-
},
11-
});
123

134
const App: React.FC = () => {
145
return (
15-
<WagmiWeb3ConfigProvider config={config}>
6+
<WagmiWeb3ConfigProvider>
167
<NFTImage width={300} address="0x79fcdef22feed20eddacbb2587640e45491b757f" tokenId={8540} />
178
</WagmiWeb3ConfigProvider>
189
);

‎packages/assets/package.json

+5
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,11 @@
2121
"require": "./dist/lib/solana/index.js",
2222
"types": "./dist/esm/solana/index.d.ts"
2323
},
24+
"./wallets": {
25+
"import": "./dist/esm/wallets/index.js",
26+
"require": "./dist/lib/wallets/index.js",
27+
"types": "./dist/esm/wallets/index.d.ts"
28+
},
2429
"./tokens": {
2530
"import": "./dist/esm/tokens/index.js",
2631
"require": "./dist/lib/tokens/index.js",

‎packages/eth-web3js/src/web3js-provider/web3js-provider.tsx

-16
Original file line numberDiff line numberDiff line change
@@ -9,24 +9,8 @@ import type { Chain } from 'viem';
99
import { createConfig, http, type CreateConfigParameters, type Storage } from 'wagmi';
1010
import * as wagmiChains from 'wagmi/chains';
1111
import * as wagmiConnectors from 'wagmi/connectors';
12-
import type { WalletConnectParameters } from 'wagmi/connectors';
13-
14-
export interface WalletConnectOptions
15-
extends Pick<
16-
WalletConnectParameters,
17-
| 'disableProviderPing'
18-
| 'isNewChainsStale'
19-
| 'projectId'
20-
| 'metadata'
21-
| 'relayUrl'
22-
| 'storageOptions'
23-
| 'qrModalOptions'
24-
> {
25-
useWalletConnectOfficialModal?: boolean;
26-
}
2712

2813
export interface EthWeb3jsConfigProviderProps extends Omit<WagmiWeb3ConfigProviderProps, 'config'> {
29-
walletConnect?: false | WalletConnectOptions;
3014
storage?: Storage | false;
3115
}
3216

‎packages/ethers/src/ethers-provider/ethers-provider.tsx

-16
Original file line numberDiff line numberDiff line change
@@ -9,25 +9,9 @@ import type { Chain } from 'viem';
99
import { createConfig, http, type CreateConfigParameters, type Storage } from 'wagmi';
1010
import * as wagmiChains from 'wagmi/chains';
1111
import * as wagmiConnectors from 'wagmi/connectors';
12-
import type { WalletConnectParameters } from 'wagmi/connectors';
13-
14-
export interface WalletConnectOptions
15-
extends Pick<
16-
WalletConnectParameters,
17-
| 'disableProviderPing'
18-
| 'isNewChainsStale'
19-
| 'projectId'
20-
| 'metadata'
21-
| 'relayUrl'
22-
| 'storageOptions'
23-
| 'qrModalOptions'
24-
> {
25-
useWalletConnectOfficialModal?: boolean;
26-
}
2712

2813
export interface EthersWeb3ConfigProviderProps
2914
extends Omit<WagmiWeb3ConfigProviderProps, 'config'> {
30-
walletConnect?: false | WalletConnectOptions;
3115
storage?: Storage | false;
3216
}
3317

‎packages/wagmi/src/chains.ts

+119
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
import {
2+
Arbitrum as ArbitrumAsset,
3+
Avalanche as AvalancheAsset,
4+
BSC as BSCAsset,
5+
Goerli as GoerliAsset,
6+
Hardhat as HardhatAsset,
7+
Holesky as HoleskyAsset,
8+
Localhost as LocalhostAsset,
9+
Mainnet as MainnetAsset,
10+
Optimism as OptimismAsset,
11+
Polygon as PolygonAsset,
12+
Scroll as ScrollAsset,
13+
ScrollSepolia as ScrollSepoliaAsset,
14+
Sepolia as SepoliaAsset,
15+
X1Testnet as X1TestnetAsset,
16+
} from '@ant-design/web3-assets';
17+
import {
18+
arbitrum,
19+
avalanche,
20+
bsc,
21+
goerli,
22+
hardhat,
23+
holesky,
24+
localhost,
25+
mainnet,
26+
optimism,
27+
polygon,
28+
scroll,
29+
scrollSepolia,
30+
sepolia,
31+
} from 'wagmi/chains';
32+
33+
import type { ChainAssetWithWagmiChain } from './interface';
34+
35+
export const Mainnet: ChainAssetWithWagmiChain = {
36+
...MainnetAsset,
37+
wagmiChain: mainnet,
38+
};
39+
40+
export const Goerli: ChainAssetWithWagmiChain = {
41+
...GoerliAsset,
42+
wagmiChain: goerli,
43+
};
44+
45+
export const Sepolia: ChainAssetWithWagmiChain = {
46+
...SepoliaAsset,
47+
wagmiChain: sepolia,
48+
};
49+
50+
export const Holesky: ChainAssetWithWagmiChain = {
51+
...HoleskyAsset,
52+
wagmiChain: holesky,
53+
};
54+
55+
export const Polygon: ChainAssetWithWagmiChain = {
56+
...PolygonAsset,
57+
wagmiChain: polygon,
58+
};
59+
60+
export const BSC: ChainAssetWithWagmiChain = {
61+
...BSCAsset,
62+
wagmiChain: bsc,
63+
};
64+
65+
export const Arbitrum: ChainAssetWithWagmiChain = {
66+
...ArbitrumAsset,
67+
wagmiChain: arbitrum,
68+
};
69+
70+
export const Optimism: ChainAssetWithWagmiChain = {
71+
...OptimismAsset,
72+
wagmiChain: optimism,
73+
};
74+
75+
export const Avalanche: ChainAssetWithWagmiChain = {
76+
...AvalancheAsset,
77+
wagmiChain: avalanche,
78+
};
79+
80+
// OKX X1: https://www.okx.com/cn/x1/docs/developer/build-on-x1/quickstart
81+
export const X1Testnet: ChainAssetWithWagmiChain = {
82+
...X1TestnetAsset,
83+
wagmiChain: {
84+
id: X1TestnetAsset.id,
85+
name: X1TestnetAsset.name,
86+
nativeCurrency: { name: 'OKB', symbol: 'OKB', decimals: 18 },
87+
rpcUrls: {
88+
default: {
89+
http: ['https://testrpc.x1.tech'],
90+
},
91+
},
92+
blockExplorers: {
93+
default: {
94+
name: 'X1TestnetScan',
95+
url: 'https://www.okx.com/explorer/x1-test',
96+
},
97+
},
98+
},
99+
};
100+
101+
export const Scroll: ChainAssetWithWagmiChain = {
102+
...ScrollAsset,
103+
wagmiChain: scroll,
104+
};
105+
106+
export const ScrollSepolia: ChainAssetWithWagmiChain = {
107+
...ScrollSepoliaAsset,
108+
wagmiChain: scrollSepolia,
109+
};
110+
111+
export const Hardhat: ChainAssetWithWagmiChain = {
112+
...HardhatAsset,
113+
wagmiChain: hardhat,
114+
};
115+
116+
export const Localhost: ChainAssetWithWagmiChain = {
117+
...LocalhostAsset,
118+
wagmiChain: localhost,
119+
};

‎packages/wagmi/src/index.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
11
export * from './wagmi-provider';
22
export * from './wallets';
33
export * from './interface';
4-
export * from '@ant-design/web3-assets';
4+
export * from './chains';
5+
export * from '@ant-design/web3-assets/tokens';
6+
export * from '@ant-design/web3-assets/wallets';

‎packages/wagmi/src/interface.ts

+6-1
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
import type {
2+
Chain,
23
ConnectOptions,
34
UniversalEIP6963Config,
45
Wallet,
56
WalletMetadata,
67
} from '@ant-design/web3-common';
7-
import type { Connector } from 'wagmi';
8+
import type { Chain as WagmiChain } from 'viem';
9+
import type { Connector, CreateConnectorFn } from 'wagmi';
810

911
export interface WalletUseInWagmiAdapter extends Wallet {
1012
getWagmiConnector?: (options?: ConnectOptions) => Promise<Connector | undefined>;
@@ -16,6 +18,9 @@ export interface WalletFactory {
1618
name?: string;
1719
connectors: Connector['name'][];
1820
create: (connector?: readonly Connector[]) => WalletUseInWagmiAdapter;
21+
createWagmiConnector?: () => CreateConnectorFn;
1922
}
2023

2124
export type EIP6963Config = boolean | UniversalEIP6963Config;
25+
26+
export type ChainAssetWithWagmiChain = Chain & { wagmiChain?: WagmiChain };

0 commit comments

Comments
 (0)