Error: Hydration failed because the initial UI does not match what was rendered on the server. about wallet-adapter HOT 2 CLOSED

Saw a similar issue when I tried this and read somewhere dynamic in Next is the best way to resolve this.

i.e.

import dynamic from "next/dynamic";
...

const WalletMultiButtonDynamic = dynamic(
  async () =>
    (await import("@solana/wallet-adapter-react-ui")).WalletMultiButton,
  { ssr: false }
);

...

return (
    <main>
      <div>
        <WalletMultiButtonDynamic>
          ....
        </WalletMultiButtonDynamic>
      </div>
    </main>

Hope that helps.

from wallet-adapter.

dynamic in Next is the best way to resolve this

Yeah, that's right. The state on the client will always be different than the server because the server can't know about the wallets injected into the browser.

from wallet-adapter.