ClientCtrl has no client set - Next 13 & Wagmi

[anthonyjacquelin]

My wallet connect using web3 modal has alaways been working since around 1 week.

Now i receive an error:

Here is my code updated using next-wagmi example:

"use client";

import React, { useEffect, useState } from "react";
import { configureChains, WagmiConfig, createConfig } from "wagmi";
import {
  EthereumClient,
  w3mConnectors,
  w3mProvider,
} from "@web3modal/ethereum";
import { Web3Modal } from "@web3modal/react";
import { mainnet, goerli } from "wagmi/chains";

const projectId = process.env.NEXT_PUBLIC_PROJECT_ID;

const chains = [mainnet];

const { publicClient } = configureChains(chains, [w3mProvider({ projectId })]);

const wagmiConfig = createConfig({
  autoConnect: true,
  publicClient,
  connectors: w3mConnectors({
    chains,
    projectId,
    version: 1,
  }),
});

const ethereumClient = new EthereumClient(wagmiConfig, chains);

const WagmiProvider = ({ children }: { children: React.ReactNode }) => {
  const [ready, setReady] = useState(false);

  useEffect(() => {
    setReady(true);
  }, []);
  return (
    <>
      {ready ? (
        <WagmiConfig config={wagmiConfig}>{children}</WagmiConfig>
      ) : null}
      <Web3Modal projectId={projectId} ethereumClient={ethereumClient} />
    </>
  );
};

export default WagmiProvider;

And my component is wrapping all my application. As i said all of this always worked until now.

What could be the error from ? Thanks

[anthonyjacquelin]

I receive the exact same error while using your code from the repo bellow:

https://github.com/WalletConnect/web3modal-examples/tree/main/nextjs-wagmi

[glitch-txs]

Please try updating the packages to the latest version, including wagmi and viem.

[anthonyjacquelin]

Thanks fixed updating all wagmi + wallet connect dependencies

[anthonyjacquelin]

It doesn't work again, still have the same error...

Here is my package.json:

{
  "name": "",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@types/multer": "^1.4.7",
    "@types/node": "18.15.2",
    "@types/react": "18.0.28",
    "@types/react-dom": "18.0.11",
    "@vercel/analytics": "^0.1.8",
    "@vercel/og": "^0.5.7",
    "@wagmi/chains": "^1.1.1",
    "@wagmi/connectors": "^2.2.0",
    "@walletconnect/ethereum-provider": "2.8.1",
    "@walletconnect/legacy-modal": "2.0.0-beta.100",
    "@walletconnect/relay-auth": "1.0.4",
    "@walletconnect/sign-client": "2.0.0-beta.100",
    "@walletconnect/types": "2.0.0-beta.100",
    "@walletconnect/universal-provider": "2.8.1",
    "@walletconnect/utils": "2.0.0-beta.100",
    "@walletconnect/web3-provider": "1.8.0",
    "@web3modal/ethereum": "2.4.7",
    "@web3modal/react": "2.4.7",
    "apollo-server-core": "^3.11.1",
    "apollo-server-micro": "^3.11.1",
    "ardrive-core-js": "^1.18.0",
    "aws-sdk": "^2.1279.0",
    "axios": "^1.1.3",
    "base64-to-uint8array": "^1.0.0",
    "better-sqlite3": "^7.6.2",
    "class-variance-authority": "^0.6.0",
    "clsx": "^1.2.1",
    "cmdk": "^0.2.0",
    "cookies": "^0.8.0",
    "cors": "^2.8.5",
    "cropperjs": "^1.5.13",
    "dotenv": "^16.0.3",
    "echarts": "^5.4.1",
    "editorjs-drag-drop": "^1.1.12",
    "editorjs-html": "^3.4.2",
    "editorjs-paragraph-with-alignment": "^3.0.0",
    "editorjs-react-renderer": "^3.5.1",
    "editorjs-style": "^3.0.3",
    "editorjs-text-alignment-blocktune": "^1.0.3",
    "editorjs-text-color-plugin": "^1.13.1",
    "editorjs-tooltip": "^1.1.10",
    "editorjs-undo": "^2.0.16",
    "env-cmd": "^10.1.0",
    "eslint-config-next": "13.2.4",
    "ethers": "^5",
    "formidable": "^2.0.1",
    "formik": "^2.2.9",
    "framer-motion": "^6",
    "graceful-fs": "^4.2.11",
    "graphql": "^16.6.0",
    "graphql-type-json": "^0.3.2",
    "html-to-text": "^9.0.0",
    "js-cookie": "^3.0.1",
    "jsonwebtoken": "^8.5.1",
    "lokijs": "^1.5.12",
    "lucide-react": "^0.220.0",
    "magic-sdk": "^17.1.4",
    "medium-editor": "^5.23.3",
    "micro": "^9.4.1",
    "micro-cors": "^0.1.1",
    "mixpanel-browser": "^2.47.0",
    "mongodb": "^4.12.1",
    "moralis": "^2.19.1",
    "multer": "^1.4.5-lts.1",
    "next": "^13.4.0",
    "next-sitemap": "^4.1.3",
    "next-themes": "^0.2.1",
    "pino": "^8.11.0",
    "react": "18.2.0",
    "viem": "1.0.7",
    "wagmi": "1.2.0",
  },
  "resolutions": {
    "@walletconnect/core": "2.0.0-beta.100",
    "@walletconnect/types": "2.0.0-beta.100",
    "@walletconnect/utils": "2.0.0-beta.100"
  },
  "devDependencies": {
    "@editorjs/opensea": "^1.0.2",
    "@next/bundle-analyzer": "^13.3.4",
    "@types/cookies": "^0.7.7",
    "autoprefixer": "^10.4.13",
    "eslint": "8.36.0",
    "postcss": "^8.4.21",
    "tailwindcss": "^3.3.2"
  }
}

[xzilja]

Remove these as they are part of wagmi, use wagmi/chains etc.

    "@wagmi/chains": "^1.1.1",
    "@wagmi/connectors": "^2.2.0",

Update wagmi, viem and @Web3Modal dependencies to latest versions (confirm they updated in your lockfile).

Having "@walletconnect/ethereum-provider": "2.8.1" can conflict with one in wagmi, you should not need it alongside universal provider and wagmi?

There is too much to unpack here in terms of dependencies, so my best suggestion is to clean them up and update.