next dependency update, wagmi error fixes

app/page.tsx

@@ -4,7 +4,7 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { WagmiProvider, http } from 'wagmi'
 // import { publicProvider } from 'wagmi/providers/public'
 import { defineChain } from 'viem'
-import { polygonMumbai } from 'viem/chains'
+import { polygonAmoy } from 'viem/chains'
 // import { alchemyProvider } from 'wagmi/providers/alchemy'
 import {
     RainbowKitProvider,

components/shared/ButtonConnect/ButtonConnect.tsx

@@ -6,9 +6,7 @@ import { useConnectModal } from '@rainbow-me/rainbowkit'
 
 const ButtonConnect = () => {
     const { openConnectModal } = useConnectModal()
-    const { isLoading } = useConnect({
-        chainId: Number(process.env.NEXT_PUBLIC_CHAIN_ID),
-    })
+    const { isPending } = useConnect()
 
     return (
         <>
@@ -25,7 +23,7 @@ const ButtonConnect = () => {
                     data-cy="btn-connect"
                 >
                     Connect Wallet
-                    {isLoading && ' ...'}
+                    {isPending && ' ...'}
                 </Button>
             ) : null}
         </>

context/ContractContext.tsx

@@ -1,7 +1,7 @@
 'use client'
 import { createContext, ReactNode, useContext } from 'react'
 import { formatUnits } from 'viem'
-import { useContractRead } from 'wagmi'
+import { useReadContract } from 'wagmi'
 
 // Contract
 import { contractConfig } from '@/contract/config'
@@ -32,9 +32,8 @@ export function ContractProvider({ children }: { children: ReactNode }) {
         isFetching: isTotalMintedFetching,
         refetch: refetchTotalMinted,
         isFetchedAfterMount: isTotalMintedChecked,
-    } = useContractRead({
+    } = useReadContract({
         ...contractConfig,
-        enabled: true,
         functionName: 'totalMinted',
     })
 
@@ -43,9 +42,8 @@ export function ContractProvider({ children }: { children: ReactNode }) {
         isFetching: isActivePhaseIdFetching,
         refetch: refetchActivePhaseId,
         isFetchedAfterMount: isActivePhaseIdChecked,
-    } = useContractRead({
+    } = useReadContract({
         ...contractConfig,
-        enabled: true,
         functionName: 'getActiveClaimConditionId',
     })
 

context/UserContext.tsx

@@ -1,6 +1,6 @@
 import { createContext, ReactNode, useContext } from 'react'
 import { formatUnits } from 'viem'
-import { useAccount, useBalance, useContractRead } from 'wagmi'
+import { useAccount, useBalance, useReadContract } from 'wagmi'
 
 // Contexts
 import { useContractContext } from './ContractContext'
@@ -48,9 +48,11 @@ export function UserProvider({ children }: { children: ReactNode }) {
         isFetching: isUserTotalNftBalanceFetching,
         refetch: refetchUserTotalNftBalance,
         isFetchedAfterMount: isUserTotalNftBalanceChecked,
-    } = useContractRead({
+    } = useReadContract({
         ...contractConfig,
-        enabled: !!address,
+        query: {
+            enabled: !!address,
+        },
         functionName: 'balanceOf',
         args: [address!],
     })
@@ -60,9 +62,11 @@ export function UserProvider({ children }: { children: ReactNode }) {
         isFetching: isUserPhaseNftBalanceFetching,
         refetch: refetchUserPhaseNftBalance,
         isFetchedAfterMount: isUserPhaseNftBalanceChecked,
-    } = useContractRead({
+    } = useReadContract({
         ...contractConfig,
-        enabled: !!address && activePhaseId !== undefined,
+        query: {
+            enabled: !!address && activePhaseId !== undefined,
+        },
         functionName: 'getSupplyClaimedByWallet',
         args: [
             //@ts-ignore

package.json

@@ -25,15 +25,16 @@
     "eslint": "8.45.0",
     "eslint-config-next": "13.4.10",
     "lokijs": "1.x",
-    "next": "14",
+    "next": "^14.2.2",
     "pino-pretty": "^10.3.1",
     "postcss": "8.4.31",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "tailwindcss": "3.3.3",
     "typescript": "5.1.6",
     "viem": "2.x",
-    "wagmi": "2"
+    "wagmi": "2",
+    "webpack-dev-middleware": ">=6.1.2"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^1.2.18",
@@ -58,4 +59,4 @@
     "postcss": ">=8.4.31",
     "express": ">=4.19.2"
   }
-}
+}