[BUG] isConnected always returning false, when clearly connected

[patrick-streaming]

Describe the bug

I have the following code:

'use client'

import { useEffect, useState } from 'react'
import { useAccount } from 'wagmi'

export default function Home() {
  const { isConnected, address, status } = useAccount()

  useEffect(() => {
    console.log(isConnected)
    console.log(address)
    console.log(status)
  }, [isConnected, address, status])

And on my UI, Metamask is clearly connected (my metamask, show it's connected to the site, and you can see the address of my metamask being console.logged out):

Whenever I refresh the page, it just keeps saying not connected

To reproduce

1. Use the import { useAccount } from 'wagmi' hook, and in a component, add:

export default function Home() {
  const { isConnected, address, status } = useAccount()

  useEffect(() => {
    console.log(isConnected)
    console.log(address)
    console.log(status)
  }, [isConnected, address, status])

2. Connect your metamask with a connect button
3. Refresh the page, it'll always have isConnected be false

Optionally, you can see this repo for more information.

Expected behavior

isConnected should be true, as my Metamask says it's true

Screenshots

See above

Environment details

nodejs: v23.5.0
"wagmi": "^2.14.9"
"connectkit": "^1.8.2",

Tagging @PatrickAlphaC

[patrick-streaming]

Doubled checked with rainbowkit, it looks like the same codebase connected to a rainbowkit wallet, returns the correct connected status.

[PatrickAlphaC]

After trying to reproduce this error, I'm unable to.

I'll close for now.

(Whoops, I'm on my wrong account, I'll have to switch)

[MOZGIII]

We see the same in our tests. Looks like connectkit does not initialize the state properly, i.e. assumes wagmi can't be connected at initialization, or sth.