Can't writeContract due to this issue "ConnectorNotConnectedError: Connector not connected."

[web3techlord]

Check existing issues

• I checked there isn't already an issue for the bug I encountered.

Describe the bug

As I was following the steps of wallet connection in documentation, I had some problems.
First of all, when I reload the webpage, wallet is not connected automatically. Exactly I think it's stored in local storage, but w3m-button is not connected and just shows "Connect Wallet" text. When I click it and metamask wallet to connect, metamask connection gives an error.

When I run writeContract method to sign tx, it gives another error. (I attached a screenshot)

I couldn't get the problem completely. I just think it might be an issue on the versions of modules.
Thank you. I need any quick help.

Link to Minimal Reproducible Example

No response

Steps To Reproduce

No response

What Wagmi package(s) are you using?

wagmi, @wagmi/core

Wagmi Package(s) Version(s)

wagmi@^2.12.16, @web3modal/wagmi@^5.1.10

Viem Version

viem@^2.21.16

TypeScript Version

I don't use TypeScript

Anything else?

React jsx
"react": "^18.3.1", "react-dom": "^18.3.1", "react-router-dom": "^6.26.2", "react-scripts": "5.0.1",

[github-actions]

Hello @web3techlord.

Please provide a minimal reproduction using StackBlitz, TypeScript Playground (for type issues), or a separate minimal GitHub repository.

Minimal reproductions are required as they save us a lot of time reproducing your config/environment and issue, and allow us to help you faster.

Once a minimal reproduction is added, a team member will confirm it works, then re-open the issue.