connect to dchain

config/wallet.ts

@@ -0,0 +1,57 @@
+import { Chain, configureChains, mainnet } from 'wagmi';
+import { CoinbaseWalletConnector } from 'wagmi/connectors/coinbaseWallet';
+import { InjectedConnector } from 'wagmi/connectors/injected';
+import { MetaMaskConnector } from 'wagmi/connectors/metaMask';
+import { publicProvider } from 'wagmi/providers/public';
+
+import { NETWORK_NAME, RPC_URL, CHAIN_ID, BLOCK_EXPLORER_URL, ICON } from './env';
+
+const dchaintestnet: Chain = {
+  id: CHAIN_ID,
+  name: NETWORK_NAME,
+  network: 'dchain_testnet',
+  rpcUrls: {
+    default: {
+      http: [RPC_URL],
+    },
+    public: {
+      http: [RPC_URL],
+    },
+  },
+  nativeCurrency: {
+    name: 'ETH',
+    symbol: 'ETH',
+    decimals: 18,
+  },
+  blockExplorers: {
+    default: { name: 'DChain Block Explorer', url: BLOCK_EXPLORER_URL },
+  },
+};
+
+const { chains, publicClient, webSocketPublicClient } = configureChains(
+  [
+    {
+      ...dchaintestnet,
+      iconUrl: ICON,
+    },
+    mainnet,
+  ],
+  [publicProvider()],
+);
+
+const coinbaseWalletConnector = new CoinbaseWalletConnector({ chains, options: { appName: 'wagmi' } });
+const metaMaskWalletConnector = new MetaMaskConnector({ chains });
+
+const trustWalletConnector = new InjectedConnector({
+  chains,
+  options: {
+    name: 'GN',
+    shimDisconnect: true,
+    getProvider: () => (typeof window !== 'undefined' ? (window as any).trustwallet : undefined),
+  },
+});
+
+
+export {
+  chains, coinbaseWalletConnector, metaMaskWalletConnector, publicClient, trustWalletConnector, webSocketPublicClient
+};

pages/_app.tsx

@@ -1,6 +1,35 @@
 import "@/styles/globals.css";
 import type { AppProps } from "next/app";
+import { WagmiConfig, createConfig } from 'wagmi'
+import { RainbowKitProvider, connectorsForWallets, getDefaultWallets } from '@rainbow-me/rainbowkit'
+import { chains, publicClient, webSocketPublicClient } from '../config/wallet'
 
 export default function App({ Component, pageProps }: AppProps) {
-  return <Component {...pageProps} />;
+
+  const projectId = '8db95bf7ae240481064a721e411c1161';
+
+const { wallets } = getDefaultWallets({
+  projectId,
+  appName: 'dchain-game-dev',
+  chains,
+});
+
+const connectors = connectorsForWallets([
+  ...wallets,
+]);
+
+const wagmiConfig = createConfig({
+  autoConnect: true,
+  connectors,
+  webSocketPublicClient,
+  publicClient,
+});
+
+  return (
+    <WagmiConfig config={wagmiConfig}>
+      <RainbowKitProvider modalSize="compact" chains={chains}>
+      <Component {...pageProps}   />
+     </RainbowKitProvider>
+     </WagmiConfig>
+  );
 }