always ask switch network to mainnet

[shixin-guo]

When I connect with MetaMask after upgrading to 0.0.2, connectKit asks me to switch to Mainnet, but I want to use Rinkeby TestNet. Do you know what's causing this?

Because 0.0.1 is working properly, I am perplexed.😢

this is my test code

import { ConnectKitProvider } from 'connectkit'
import {
  WagmiConfig,
  createClient,
  allChains,
  configureChains,
  chain,
} from 'wagmi'

import { publicProvider } from 'wagmi/providers/public'

import { CoinbaseWalletConnector } from 'wagmi/connectors/coinbaseWallet'
import { MetaMaskConnector } from 'wagmi/connectors/metaMask'
import { InjectedConnector } from 'wagmi/connectors/injected'
import { WalletConnectConnector } from 'wagmi/connectors/walletConnect'

import { firebaseApp } from '@framework/provider'

const { chains, provider, webSocketProvider } = configureChains(allChains, [
  publicProvider(),
])
const client = createClient({
  autoConnect: true,
  connectors: [
    new MetaMaskConnector(),
    new InjectedConnector({ chains: [chain.hardhat] }),
    new CoinbaseWalletConnector({
      chains,
      options: {
        appName: 'wagmi',
      },
    }),
    new WalletConnectConnector({
      chains,
      options: {
        qrcode: true,
      },
    }),
  ],
  provider,
  webSocketProvider,
})

[lochie]

Hey @shixin-guo, thanks for choosing ConnectKit!

It looks like this issue has to do with using allChains inside your configureChains setup. You would need to replace allChains with [chain.hardhat] (or your list of preferred chains), and also make sure to use configured chains variable inside the InjectedConnector and MetaMaskConnector

Your above test code should look something like this after these changes:

import { ConnectKitProvider } from 'connectkit'
import {
  WagmiConfig,
  createClient,
  configureChains,
  chain,
} from 'wagmi'

import { publicProvider } from 'wagmi/providers/public'

import { CoinbaseWalletConnector } from 'wagmi/connectors/coinbaseWallet'
import { MetaMaskConnector } from 'wagmi/connectors/metaMask'
import { InjectedConnector } from 'wagmi/connectors/injected'
import { WalletConnectConnector } from 'wagmi/connectors/walletConnect'

import { firebaseApp } from '@framework/provider'

const appChains = [chain.hardhat];

const { chains, provider, webSocketProvider } = configureChains(appChains, [
  publicProvider(),
])
const client = createClient({
  autoConnect: true,
  connectors: [
    new MetaMaskConnector({ chains }),
    new InjectedConnector({ chains }),
    new CoinbaseWalletConnector({
      chains,
      options: {
        appName: 'wagmi',
      },
    }),
    new WalletConnectConnector({
      chains,
      options: {
        qrcode: true,
      },
    }),
  ],
  provider,
  webSocketProvider,
})

I would also highly recommend, instead of the above, insist on using our default client implementation that handles all the above (and more) for you.

That would look something like this:

import { WagmiConfig, createClient, chain } from "wagmi";
import { ConnectKitProvider, getDefaultClient } from "connectkit";

const alchemyId = process.env.ALCHEMY_ID;

const client = createClient(
  getDefaultClient({
    appName: "Your App Name",
    alchemyId,
    chains: [chain.hardhat]
  }),
);

const App = () => {
  return (
    <WagmiConfig client={client}>
      <ConnectKitProvider>
        /* Your App */
      </ConnectKitProvider>
    </WagmiConfig>
  );
};

Hoping this helps! ☺️

[shixin-guo]

@lochie

thank you for your prompt response, Yes!!! It was a wise decision for me to use Connectkit, and I appreciate your assistance; however, it is still not working; I attempted to reproduce it in our example demo,and encountered the same problem.

code diff: in examples/cra/src/index.tsx

[lochie]

Hey @shixin-guo,

Just letting you know that I've talked a little about this over at issue #16, but your issue may also be due to using Rinkeby, since Rinkeby is being deprecated it's encouraged to use Goerli or Sepolia to test Ethereum in a post-merge context (you can learn more about The Merge here).

If you wish for this to be raised further I suggest creating an issue from this discussion as this is starting to become more of a debugging issue rather than a discussion about ConnectKit itself.

Thanks!

[JavLG]

Hey hey buddies,
I'm experiencing the same issues that @shixin-guo experienced recently. I'm trying to set my ConnectKit to be coupled to Goerli on dev and Mainnet on prod envs.

I do set 2 .env:

.env.local -> Holds ALCHEMY_ID for Goerli.
.env.production -> Holds ALCHEMY_ID for Mainnet.

const appChain = env.NODE_ENV === 'production' ? chain.mainnet : chain.goerli
const alchemyId = env.NEXT_PUBLIC_ALCHEMY_ID;

    const client = createClient(
      getDefaultClient({
        appName: env.NEXT_PUBLIC_ALCHEMY_APP_NAME,
        alchemyId,
        chains: [appChain]
      }),
    );

Render return looks like this (Nothing uncommon):

I still get Metamask asking to change network to mainnet on all usecases. Is this an actual bug or am I missing the documentation?

Thanks!

[lochie]

Hey @JavLG, are you on the latest version of ConnectKit?

[JavLG]

Hey Lochie, it got fixed overnight smh. I believe it might have to do with the appName? Thats the only bit I changed so far now that I split the creds into 2 env variables.
Versions used:

"wagmi": "^0.6.7",
"connectkit": "^1.0.0",

Thanks for the quick response btw. Keep the good work!

[lochie]

No worries, happy to help! Feel free open an issue if you find this happening again.
Thanks and I hope you're enjoying using ConnectKit 🤝