Open crimson-med opened 1 year ago
Hey @crimson-med - can you dive a little deeper into what's going wrong for you? We recently updated to use the latest version of siwe in this example.
Hey @obstropolos thanks for taking the time to reply.
Wagmi version: 1.0.6 Siwe cersion: 2.1.4
So the first issue encountered was that now the chain names are not part of the chain
export from wagmi. After looking at their documentation I had to use:
import { mainnet, polygon, optimism, arbitrum } from "@wagmi/core/chains";
Next the createClient
is not exported in the most recent version and thus I had to resolve to the createConfig per their documentation:
import { WagmiConfig, createConfig, configureChains } from "wagmi";
import { mainnet, polygon, optimism, arbitrum } from "@wagmi/core/chains";
import { publicProvider } from "wagmi/providers/public";
import { CoinbaseWalletConnector } from "wagmi/connectors/coinbaseWallet";
import { InjectedConnector } from "wagmi/connectors/injected";
import { MetaMaskConnector } from "wagmi/connectors/metaMask";
import { WalletConnectConnector } from "wagmi/connectors/walletConnect";
// Configure chains & providers with the Alchemy provider.
// Two popular providers are Alchemy (alchemy.com) and Infura (infura.io)
const { chains, publicClient, webSocketPublicClient } = configureChains(
[mainnet, polygon, optimism, arbitrum],
[publicProvider()]
);
// Set up wagmi config
const config = createConfig({
autoConnect: true,
connectors: [
new MetaMaskConnector({ chains }),
new CoinbaseWalletConnector({
chains,
options: {
appName: "wagmi",
},
}),
new WalletConnectConnector({
chains,
options: {
projectId: "...",
},
}),
new InjectedConnector({
chains,
options: {
name: "Injected",
shimDisconnect: true,
},
}),
],
publicClient,
webSocketPublicClient,
});
const MyApp: AppType<{ session: Session | null }> = ({
Component,
pageProps: { session, ...pageProps },
}) => {
return (
<WagmiConfig config={config}>
<SessionProvider session={session}>
<Component {...pageProps} />
</SessionProvider>
</WagmiConfig>
);
};
Finally event with the above edited code I get the following error from siwe
./node_modules/ethers/node_modules/ws/lib/sender.js:5:0
Module not found: Can't resolve 'net'
https://nextjs.org/docs/messages/module-not-found
Import trace for requested module:
./node_modules/ethers/node_modules/ws/index.js
./node_modules/ethers/lib.commonjs/providers/ws.js
./node_modules/ethers/lib.commonjs/providers/provider-websocket.js
./node_modules/ethers/lib.commonjs/providers/index.js
./node_modules/ethers/lib.commonjs/ethers.js
./node_modules/ethers/lib.commonjs/index.js
./node_modules/siwe/dist/utils.js
./node_modules/siwe/dist/siwe.js
./src/pages/siwe.tsx
any updates on this?
At the moment, this example is not compatible with the latest version of wagmi
- we will get around to updating this soon, but also accept any upstream contributions!
@obstropolos @crimson-med I attempted this with the latest versions of all these libraries and it seemed to work. Although the WebSocket connection throws a bunch of errors, wallet connection and SIWE works.
I have been trying to use the guide described here: https://docs.login.xyz/integrations/nextauth.js
Which uses this repo at it's base however a lot of functions have changed in siwe, wagmi.
Would it be possible to get an updated version?