More chains support

[Xeway]

gm everyone,

Apprently for now, only 5 chains are supported : mainnet, ropsten, rinkeby, goerli and kovan.
I think it would be cool to add more, especially L2 chains such as Matic, Optimism, Arbitrum...
I remain at your disposal if you need help.

Thank you in advance,

[tmm]

Mainnet, Ropsten, Rinkeby, Goerli, and Kovan are the default chains connectors are initialized with. There are also multiple other chains built into wagmi already (still need to figure out a scalable process for adding chains). You can create your own chains by conforming to the Chain type.

[Xeway]

Okay didn't know that thank you so much!

[svskaushik]

Hi there @tmm , I'm attempting to add Aurora Testnet as a chain and have created it the following way (in constants.ts):

export const Aurora_Testnet = {
  /** ID in number form */
  id: 1313161555,
  /** Human-readable name */
  name: 'Aurora Testnet',
  /** Internal network name */
  network: 'auroratest',
  /** Currency used by chain */
  nativeCurrency: { name: 'Ether', symbol: 'ETH', decimals: 18 },
  /** Collection of RPC endpoints */
  rpcUrls: {
    default:
      'https://aurora-testnet.infura.io/v3/API_KEY'
  },
  testnet: true
}

I wanted to get a word on how to set up a client (with provider on this chain), the current solution in the docs:

  provider(config) {
    return new providers.InfuraProvider(config.chainId, 'Your Api ID')
  },

seems to return Error: unsupported network

Any help appreciated,
Thanks

[jxom]

@svskaushik – you can add a rpcUrls.infura attribute to your chain config, and then use wagmi's infuraProvider with configureChains.

Example:

import { configureChains, defaultChains } from 'wagmi'
import { infuraProvider } from 'wagmi/providers/infura'
import { InjectedConnector } from 'wagmi/connectors/injected'

const auroraTestnet = {
  /** ID in number form */
  id: 1313161555,
  /** Human-readable name */
  name: 'Aurora Testnet',
  /** Internal network name */
  network: 'auroratest',
  /** Currency used by chain */
  nativeCurrency: { name: 'Ether', symbol: 'ETH', decimals: 18 },
  /** Collection of RPC endpoints */
  rpcUrls: {
    infura:
      'https://aurora-testnet.infura.io/v3'
  },
  testnet: true
}

const infuraId = process.env.INFURA_ID;

const { chains, provider } = configureChains([auroraTestnet], [
  infuraProvider({ infuraId }),
])

const wagmiClient = createClient({
  autoConnect: true,
  connectors: [new InjectedConnector({ chains })],
  provider,
})

[svskaushik]

Hey, thanks a lot for the response.

Implemented in a similar fashion to your example but I'm still getting the same error along with:

  reason: 'unsupported network',
  code: 'INVALID_ARGUMENT',
  argument: 'network',
  value: { chainId: 1313161555, name: 'unknown' }

I suppose this is just because I've configured the 'network' property of the chain incorrectly?
Could you kindly elaborate on what exactly is expected to go into the network field?

Below is the code for your reference:

import '../styles.css'

import { ApolloProvider } from '@apollo/client'
import SiteLayout from '@components/SiteLayout'
import { AppProps } from 'next/app'
import { ThemeProvider } from 'next-themes'
import { configureChains } from 'wagmi'
import { createClient, WagmiConfig } from 'wagmi'
import { InjectedConnector } from 'wagmi/connectors/injected'
import { infuraProvider } from 'wagmi/providers/infura'

import client from '../apollo'

const auroraTestnet: Chain = {
 /** ID in number form */
 id: 1313161555,
 /** Human-readable name */
 name: 'Aurora Testnet',
 /** Internal network name */
 network: 'auroratest',
 /** Currency used by chain */
 nativeCurrency: { name: 'Ether', symbol: 'ETH', decimals: 18 },
 /** Collection of RPC endpoints */
 rpcUrls: {
   infura: 'https://aurora-testnet.infura.io/v3',
   default: 'https://aurora-testnet.infura.io/v3/'
 },
 testnet: true
}

const infuraId = process.env.INFURA_KEY

const { chains, provider } = configureChains(
 [auroraTestnet],
 //@ts-expect-error
 [infuraProvider({ infuraId })]
)

const wagmiClient = createClient({
 autoConnect: true,
 connectors: [new InjectedConnector({ chains })],
 provider
})

const App = ({ Component, pageProps }: AppProps) => {
 return (
   <WagmiConfig client={wagmiClient}>
     <ApolloProvider client={client}>
       <ThemeProvider defaultTheme="dark" attribute="class">
         <SiteLayout>
           <Component {...pageProps} />
         </SiteLayout>
       </ThemeProvider>
     </ApolloProvider>
   </WagmiConfig>
 )
}

export default App

Thanks for taking the time to look through

[tmm]

Does Infura support Aurora (id 1313161555)?

[svskaushik]

Yup, quite certain it does: link to docs

[tmm]

Got it. Looks like ethers InfuraProvider does not support Aurora though (wagmi's infuraProvider wrap this). You could use jsonRpcProvider instead.