refactor: update wagmi dependency

apps/contracts/hardhat.config.ts

@@ -62,7 +62,7 @@ const hardhatConfig: HardhatUserConfig = {
         coinmarketcap: process.env.COINMARKETCAP_API_KEY
     },
     typechain: {
-        target: "ethers-v5"
+        target: "ethers-v6"
     },
     etherscan: {
         apiKey: process.env.ETHERSCAN_API_KEY

apps/contracts/package.json

@@ -17,20 +17,20 @@
         "lint": "solhint 'contracts/**/*.sol'"
     },
     "devDependencies": {
-        "@nomicfoundation/hardhat-chai-matchers": "^1.0.0",
-        "@nomicfoundation/hardhat-network-helpers": "^1.0.0",
-        "@nomicfoundation/hardhat-toolbox": "latest",
-        "@nomiclabs/hardhat-ethers": "^2.0.0",
-        "@nomiclabs/hardhat-etherscan": "^3.0.0",
+        "@nomicfoundation/hardhat-chai-matchers": "^2.0.6",
+        "@nomicfoundation/hardhat-network-helpers": "^1.0.10",
+        "@nomicfoundation/hardhat-toolbox": "^5.0.0",
+        "@nomiclabs/hardhat-ethers": "^2.2.3",
+        "@nomiclabs/hardhat-etherscan": "^3.1.8",
         "@semaphore-protocol/group": "3.9.0",
         "@semaphore-protocol/identity": "3.9.0",
         "@semaphore-protocol/proof": "3.9.0",
-        "@typechain/ethers-v5": "^10.1.0",
+        "@typechain/ethers-v6": "^0.5.1",
         "@typechain/hardhat": "^6.1.2",
-        "@types/chai": "^4.2.0",
-        "@types/mocha": ">=9.1.0",
+        "@types/chai": "^4.3.14",
+        "@types/mocha": "^10.0.6",
         "@types/node": ">=12.0.0",
-        "chai": "^4.2.0",
+        "chai": "^5.1.0",
         "dotenv": "^16.0.3",
         "ethers": "^6.11.1",
         "hardhat": "^2.11.0",

apps/contracts/tasks/deploy-bandada-semaphore.ts

@@ -30,41 +30,41 @@ task("deploy:bandada-semaphore", "Deploy a BandadaSemaphore contract")
                 )
                 const pairing = await PairingFactory.deploy()
 
-                await pairing.deployed()
+                await pairing.waitForDeployment()
 
                 if (logs) {
                     console.info(
-                        `Pairing library has been deployed to: ${pairing.address}`
+                        `Pairing library has been deployed to: ${pairing.getAddress()}`
                     )
                 }
 
                 const SemaphoreVerifierFactory =
                     await ethers.getContractFactory("SemaphoreVerifier", {
                         libraries: {
-                            Pairing: pairing.address
+                            Pairing: await pairing.getAddress()
                         }
                     })
 
                 const semaphoreVerifier =
                     await SemaphoreVerifierFactory.deploy()
 
-                await semaphoreVerifier.deployed()
+                await semaphoreVerifier.waitForDeployment()
 
                 if (logs) {
                     console.info(
-                        `SemaphoreVerifier contract has been deployed to: ${semaphoreVerifier.address}`
+                        `SemaphoreVerifier contract has been deployed to: ${semaphoreVerifier.getAddress()}`
                     )
                 }
 
-                semaphoreVerifierAddress = semaphoreVerifier.address
+                semaphoreVerifierAddress = await semaphoreVerifier.getAddress()
             }
 
             if (!bandadaAddress) {
                 const bandada = await run("deploy:bandada", {
                     logs
                 })
 
-                bandadaAddress = bandada.address
+                bandadaAddress = await bandada.getAddress()
             }
 
             const ContractFactory = await ethers.getContractFactory(
@@ -76,11 +76,11 @@ task("deploy:bandada-semaphore", "Deploy a BandadaSemaphore contract")
                 bandadaAddress
             )
 
-            await contract.deployed()
+            await contract.waitForDeployment()
 
             if (logs) {
                 console.info(
-                    `BandadaSemaphore contract has been deployed to: ${contract.address}`
+                    `BandadaSemaphore contract has been deployed to: ${contract.getAddress()}`
                 )
             }
 

apps/contracts/tasks/deploy-bandada.ts

@@ -9,11 +9,11 @@ task("deploy:bandada", "Deploy a Bandada contract")
 
         const contract = await ContractFactory.deploy()
 
-        await contract.deployed()
+        await contract.waitForDeployment()
 
         if (logs) {
             console.info(
-                `Bandada contract has been deployed to: ${contract.address}`
+                `Bandada contract has been deployed to: ${contract.getAddress()}`
             )
         }
 

apps/dashboard/package.json

@@ -16,16 +16,18 @@
         "@emotion/react": "^11.10.6",
         "@emotion/styled": "^11.10.6",
         "@fontsource-variable/unbounded": "^5.0.5",
-        "@rainbow-me/rainbowkit": "^0.12.8",
+        "@rainbow-me/rainbowkit": "^2.0.2",
         "@semaphore-protocol/data": "3.10.0",
+        "@tanstack/react-query": "^5.28.8",
         "ethers": "^6.11.1",
         "framer-motion": "^10.0.1",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
         "react-icons": "^4.10.1",
         "react-router-dom": "^6.8.1",
         "siwe": "^1.1.6",
-        "wagmi": "^0.12.12"
+        "viem": "2.x",
+        "wagmi": "^2.5.12"
     },
     "devDependencies": {
         "@types/react": "^18.0.27",

apps/dashboard/src/components/add-member-modal.tsx

@@ -21,7 +21,7 @@ import {
 } from "@chakra-ui/react"
 import { useCallback, useEffect, useState } from "react"
 import { FiCopy } from "react-icons/fi"
-import { useSigner } from "wagmi"
+import { useWalletClient } from "wagmi"
 import * as bandadaAPI from "../api/bandadaAPI"
 import { Group } from "../types"
 import parseMemberIds from "../utils/parseMemberIds"
@@ -45,7 +45,7 @@ export default function AddMemberModal({
         setValue: setClientLink,
         onCopy
     } = useClipboard("")
-    const { data: signer } = useSigner()
+    const { data: walletClient } = useWalletClient()
 
     useEffect(() => {
         setMemberIds("")
@@ -122,15 +122,18 @@ ${memberIds.join("\n")}
             setIsLoading(false)
             onClose(memberIds)
         } else {
-            if (!signer) {
+            if (!walletClient) {
                 alert("No valid signer for your transaction!")
 
                 setIsLoading(false)
                 return
             }
 
             try {
-                const semaphore = getSemaphoreContract("sepolia", signer as any)
+                const semaphore = getSemaphoreContract(
+                    "sepolia",
+                    walletClient as any
+                )
 
                 await semaphore.addMembers(group.name, memberIds)
 
@@ -144,7 +147,7 @@ ${memberIds.join("\n")}
                 setIsLoading(false)
             }
         }
-    }, [onClose, _memberIds, group, signer])
+    }, [onClose, _memberIds, group, walletClient])
 
     const generateInviteLink = useCallback(async () => {
         const inviteLink = await bandadaAPI.generateMagicLink(group.id)

apps/dashboard/src/components/new-group-stepper/final-preview-step.tsx

@@ -2,7 +2,7 @@ import { getSemaphoreContract } from "@bandada/utils"
 import { Box, Button, Heading, HStack, VStack } from "@chakra-ui/react"
 import { useCallback, useState } from "react"
 import { useNavigate } from "react-router-dom"
-import { useSigner } from "wagmi"
+import { useWalletClient } from "wagmi"
 import { encodeBytes32String } from "ethers"
 import * as bandadaAPI from "../../api/bandadaAPI"
 import image3 from "../../assets/image3.svg"
@@ -17,16 +17,19 @@ export default function FinalPreviewStep({
     group,
     onBack
 }: FinalPreviewStepProps): JSX.Element {
-    const { data: signer } = useSigner()
+    const { data: walletClient } = useWalletClient()
     const navigate = useNavigate()
     const [_loading, setLoading] = useState<boolean>()
 
     const createGroup = useCallback(async () => {
-        if (group.type === "on-chain" && signer) {
+        if (group.type === "on-chain" && walletClient) {
             setLoading(true)
             try {
-                const semaphore = getSemaphoreContract("sepolia", signer as any)
-                const admin = await signer.getAddress()
+                const semaphore = getSemaphoreContract(
+                    "sepolia",
+                    walletClient as any
+                )
+                const admin = await walletClient.account.address
 
                 await semaphore.createGroup(group.name, group.treeDepth, admin)
 
@@ -55,7 +58,7 @@ export default function FinalPreviewStep({
             }
             navigate(`/groups/off-chain/${response.id}`)
         }
-    }, [group, signer, navigate])
+    }, [group, walletClient, navigate])
 
     return (
         <VStack align="right" w="100%">

apps/dashboard/src/context/auth-context.tsx

@@ -14,9 +14,9 @@ import {
 } from "@rainbow-me/rainbowkit/wallets"
 import React, { ReactNode, useEffect, useMemo, useState } from "react"
 import { SiweMessage } from "siwe"
-import { configureChains, createClient, WagmiConfig } from "wagmi"
+import { createConfig, http, WagmiProvider } from "wagmi"
 import { sepolia } from "wagmi/chains"
-import { publicProvider } from "wagmi/providers/public"
+import { QueryClientProvider, QueryClient } from "@tanstack/react-query"
 import { getNonce, logOut, signIn } from "../api/bandadaAPI"
 import useSessionData from "../hooks/use-session-data"
 import { Admin } from "../types"
@@ -82,50 +82,55 @@ export function AuthContextProvider({ children }: { children: ReactNode }) {
         [saveAdmin, deleteAdmin]
     )
 
-    const { chains, provider, webSocketProvider } = configureChains(
-        [sepolia],
-        [publicProvider()]
-    )
-
-    const connectors = connectorsForWallets([
+    const connectors = connectorsForWallets(
+        [
+            {
+                groupName: "Wallets",
+                wallets: [
+                    injectedWallet,
+                    metaMaskWallet,
+                    coinbaseWallet,
+                    walletConnectWallet
+                ]
+            }
+        ],
         {
-            groupName: "Wallets",
-            wallets: [
-                injectedWallet({ chains }),
-                metaMaskWallet({ chains }),
-                coinbaseWallet({ appName, chains }),
-                walletConnectWallet({ chains })
-            ]
+            appName,
+            projectId: process.env.PROJECT_ID! // WALLET CONNECT PROJECT ID
         }
-    ])
+    )
 
-    const wagmiClient = createClient({
-        autoConnect: true,
-        connectors,
-        provider,
-        webSocketProvider
+    const wagmiConfig = createConfig({
+        chains: [sepolia],
+        transports: {
+            [sepolia.id]: http()
+        },
+        connectors
     })
 
+    const queryClient = new QueryClient()
+
     return (
         <AuthContext.Provider value={contextValue}>
-            <WagmiConfig client={wagmiClient}>
-                <RainbowKitAuthenticationProvider
-                    adapter={authAdapter}
-                    status={authStatus}
-                >
-                    <RainbowKitProvider
-                        chains={chains}
-                        modalSize="compact"
-                        theme={lightTheme()}
-                        appInfo={{
-                            appName
-                        }}
-                        showRecentTransactions={false}
+            <WagmiProvider config={wagmiConfig}>
+                <QueryClientProvider client={queryClient}>
+                    <RainbowKitAuthenticationProvider
+                        adapter={authAdapter}
+                        status={authStatus}
                     >
-                        {children}
-                    </RainbowKitProvider>
-                </RainbowKitAuthenticationProvider>
-            </WagmiConfig>
+                        <RainbowKitProvider
+                            modalSize="compact"
+                            theme={lightTheme()}
+                            appInfo={{
+                                appName
+                            }}
+                            showRecentTransactions={false}
+                        >
+                            {children}
+                        </RainbowKitProvider>
+                    </RainbowKitAuthenticationProvider>
+                </QueryClientProvider>
+            </WagmiProvider>
         </AuthContext.Provider>
     )
 }

libs/hardhat/README.md

@@ -96,7 +96,7 @@ task("deploy", "Deploy a Greeter contract")
 
         const greeter = await Greeter.deploy(bandada.address)
 
-        await greeter.deployed()
+        await greeter.waitForDeployment()
 
         if (logs) {
             console.log(

libs/hardhat/src/tasks/deploy-bandada-semaphore.ts

@@ -37,7 +37,7 @@ task("deploy:bandada-semaphore", "Deploy BandadaSemaphore contract")
                     )
                     const pairing = await PairingFactory.deploy()
 
-                    await pairing.deployed()
+                    await pairing.waitForDeployment()
 
                     if (logs) {
                         console.info(
@@ -58,7 +58,7 @@ task("deploy:bandada-semaphore", "Deploy BandadaSemaphore contract")
                 const semaphoreVerifier =
                     await SemaphoreVerifierFactory.deploy()
 
-                await semaphoreVerifier.deployed()
+                await semaphoreVerifier.waitForDeployment()
 
                 if (logs) {
                     console.info(
@@ -84,7 +84,7 @@ task("deploy:bandada-semaphore", "Deploy BandadaSemaphore contract")
                 bandadaAddress
             )
 
-            await bandadaSemaphore.deployed()
+            await bandadaSemaphore.waitForDeployment()
 
             if (logs) {
                 console.info(

libs/hardhat/src/tasks/deploy-bandada.ts

@@ -7,7 +7,7 @@ task("deploy:bandada", "Deploy a Bandada contract")
 
         const bandada = await BandadaFactory.deploy()
 
-        await bandada.deployed()
+        await bandada.waitForDeployment()
 
         if (logs) {
             console.info(

libs/utils/src/getContract.ts

@@ -30,9 +30,17 @@ export default function getContract(
 
     switch (contractName) {
         case "Bandada":
-            return new ethers.Contract(contractAddress, BandadaABI, providerOrWallet)
+            return new ethers.Contract(
+                contractAddress,
+                BandadaABI,
+                providerOrWallet
+            )
         case "Semaphore":
-            return new ethers.Contract(contractAddress, SemaphoreABI, providerOrWallet)
+            return new ethers.Contract(
+                contractAddress,
+                SemaphoreABI,
+                providerOrWallet
+            )
         default:
             throw new TypeError(`'${contractName}' contract does not exist`)
     }