Update page.mdx (#399)

Signed-off-by: Joaquim Verges <[email protected]>

src/app/typescript/v5/adapters/page.mdx

@@ -2,13 +2,52 @@
 
 The thirdweb SDK can work side by side with:
 
+- wagmi
 - ethers.js v5
 - ethers.js v6
 - viem
 - older versions of the @thirdweb-dev/sdk (using the ethers.js v5 adapter)
 
 Adapters allow you to use contracts, providers and wallets from these libraries with the thirdweb SDK and vice versa.
 
+## Wagmi
+
+You can use the thirdweb SDK within a wagmi application by setting the wagmi connected account as the thirdweb 'active wallet'. After that, you can use all of the react components and hooks normally, including `PayEmbed`, `TransactionButton`, etc.
+
+```ts
+// Assumes you've wrapped your application in a `<ThirdwebProvider>`
+const { data: walletClient } = useWalletClient(); // from wagmi 
+const { disconnectAsync } = useDisconnect(); // from wagmi
+const { switchChainAsync } = useSwitchChain(); // from wagmi
+const setActiveWallet = useSetActiveWallet(); // from thirdweb/react
+useEffect(() => {
+    const setActive = async () => {
+        if (walletClient) {
+            // adapt the walletClient to a thirdweb account
+            const adaptedAccount = viemAdapter.walletClient.fromViem({
+                walletClient: walletClient as any, // accounts for wagmi/viem version mismatches
+            });
+            // create the thirdweb wallet with the adapted account
+            const thirdwebWallet = createWalletAdapter({
+		client,
+                adaptedAccount,
+                chain: defineChain(await walletClient.getChainId()),
+                onDisconnect: async () => {
+                    await disconnectAsync();
+                },
+                switchChain: async (chain) => {
+                    await switchChainAsync({ chainId: chain.id as any });
+                },
+            });
+            setActiveWallet(thirdwebWallet);
+        }
+    };
+    setActive();
+}, [walletClient]);
+```
+
+You can view a fully functioning wagmi + thirdweb app in this [github repository](https://github.com/thirdweb-example/wagmi-thirdweb-pay).
+
 ## Ethers v6
 
 You can use an existing ethers.js v6 Signer with the thirdweb SDK by converting it using the `ethers6Adapter`: