search

turbo-eth / template-web3-app

⚡️ Web3 App Template built using Next.js, RainbowKit, SIWE, Disco, and more!
https://www.turboeth.xyz
MIT License
334 stars 89 forks source link

Potentially Mismatch CHAINS and PROVIDERS #45

Closed xinbenlv closed 1 year ago

xinbenlv commented 1 year ago

Trying to debug the following error

You may need to add `jsonRpcProvider` to `configureChains` with the chain's RPC URLs.
Read more: https://wagmi.sh/core/providers/jsonRpc
    at configureChains (webpack-internal:///(sc_client)/./node_modules/.pnpm/@wagmi+core@0.9.7_@babel+core@7.18.5_@types+node@17.0.45_encoding@0.1.13_ethers@5.7.2_react@18.2.0_typescript@4.9.4/node_modules/@wagmi/core/dist/chunk-55IO54NW.js:124:13)
    at eval (webpack-internal:///(sc_client)/./config/networks.ts:71:86)
    at (sc_client)/./config/networks.ts (/Users/zzn/ws/d3ns-dapp/.next/server/app/(general)/page.js:4398:1)
    at __webpack_require__ (/Users/zzn/ws/d3ns-dapp/.next/server/webpack-runtime.js:33:43)
    at eval (webpack-internal:///(sc_client)/./components/providers/rainbow-kit.tsx:18:74)
    at (sc_client)/./components/providers/rainbow-kit.tsx (/Users/zzn/ws/d3ns-dapp/.next/server/app/(general)/page.js:4222:1)
    at __webpack_require__ (/Users/zzn/ws/d3ns-dapp/.next/server/webpack-runtime.js:33:43)
    at eval (webpack-internal:///(sc_client)/./components/providers/root-provider.tsx:15:91)
    at (sc_client)/./components/providers/root-provider.tsx (/Users/zzn/ws/d3ns-dapp/.next/server/app/(general)/page.js:4233:1)
    at __webpack_require__ (/Users/zzn/ws/d3ns-dapp/.next/server/webpack-runtime.js:33:43)
    at eval (webpack-internal:///(sc_client)/./app/layout.tsx:18:93)
    at (sc_client)/./app/layout.tsx (/Users/zzn/ws/d3ns-dapp/.next/server/app/(general)/page.js:4134:1)
    at __webpack_require__ (/Users/zzn/ws/d3ns-dapp/.next/server/webpack-runtime.js:33:43)
    at /Users/zzn/ws/d3ns-dapp/node_modules/.pnpm/next@13.1.1_@babel+core@7.18.5_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/react-server-dom-webpack/client.js:918:337

To reproduce

  1. Checkout the commit at c8f962bff8068b7da4ac4d70015ac3851c051e16
  2. Fill in the .env file with required variables, excluding NEXT_PUBLIC_USE_PUBLIC_PROVIDER=true
  3. pnpm install and then pnpm run dev

Error appears as the section above.

Debug

As per https://github.com/turbo-eth/template-web3-app/blob/c8f962bff8068b7da4ac4d70015ac3851c051e16/config/networks.ts#L22

https://github.com/turbo-eth/template-web3-app/blob/c8f962bff8068b7da4ac4d70015ac3851c051e16/config/networks.ts#L44-L46

Likely Root Cause

It seems the wagmi require the list of chain (identified in network.ts as CHAINS) to be a subset of the list of supported chains supported by jsonRpcProviders (identified as PROVIDERs).

Propose fix:

Change the way to populate CHAINS to match with how PROVIDERs was added.

Something like

let providers =

if (process.env.NEXT_PUBLIC_ALCHEMY_API_KEY) PROVIDERS.push(alchemyProvider(...));

if (process.env.NEXT_PUBLIC_INFURA_API_KEY) PROVIDERS.push(infuraProvider(...)); if (process.env.NEXT_PUBLIC_USE_PUBLIC_PROVIDER) PROVIDERS.push(publicProvider());

PROVIDERS.forEach(() => { let supportedChains = getSupportedChainsByProvider(provider); # Needs to find out or create a manual map CHAINS.push(supportedChains); }

CHAINS = deduplicate(CHAINS);

// @ts-ignore export const { chains, provider } = configureChains(CHAINS, [...PROVIDERS])

kamescg commented 1 year ago

Closing issue. Solution added to the main branch in pull request https://github.com/turbo-eth/template-web3-app/pull/47

Still needs to be added to integrations branch.