🐛 Update connectkit version

js/ui/package.json

@@ -8,20 +8,21 @@
     "lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0"
   },
   "dependencies": {
+    "@tanstack/react-query": "^5",
     "buffer": "6.0.3",
-    "connectkit": "1.5.3",
-    "ethers": "6.6.1",
+    "connectkit": "1.7.3",
+    "ethers": "^6.12.2",
     "js-cookie": "3.0.5",
     "process": "0.11.10",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "siwe": "2.1.4",
     "usehooks-ts": "3.1.0",
-    "viem": "1.1.7",
-    "wagmi": "1.3.0"
+    "viem": "2.x",
+    "wagmi": "2.x"
   },
   "resolutions": {
-    "@coinbase/wallet-sdk": "4.0.3"
+    "@coinbase/wallet-sdk": "4.0.2"
   },
   "devDependencies": {
     "@babel/core": "7.22.5",

js/ui/src/main.tsx

@@ -1,29 +1,44 @@
 import React from "react";
 import ReactDOM from "react-dom/client";
-import { WagmiConfig, createConfig, mainnet } from "wagmi";
+import { WagmiProvider, createConfig, http, fallback } from "wagmi";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { mainnet } from "wagmi/chains";
+
 import { getDefaultConfig } from "connectkit";
 import App from "./App";
 import "./index.css";
+const queryClient = new QueryClient();
 
 const config = createConfig(
   getDefaultConfig({
     // Required API Keys
-    infuraId: process.env.INFURA_ID,
-    walletConnectProjectId: process.env.WALLET_CONNECT_ID ?? '',
-    chains: [mainnet],
+    // infuraId: process.env.INFURA_ID,
+
+    walletConnectProjectId: process.env.WALLET_CONNECT_ID ?? "",
 
     // Required
     appName: "SIWE | Devfolio",
     appUrl: "https://devfolio.co", // your app's url
     appIcon: "https://siwe.devfolio.co/favicon.png", // your app's logo,no bigger than 1024x1024px (max. 1MB)
-    autoConnect: false,
+    // autoConnect: false,
+
+    chains: [mainnet],
+    transports: {
+      [mainnet.id]: fallback([
+        http(`https://mainnet.infura.io/v3/${process.env.INFURA_ID}`),
+        // http(`https://eth-mainnet.g.alchemy.com/v2/${process.env.ALCHEMY_ID}`),
+        http(),
+      ]),
+    },
   })
 );
 
 ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
   <React.StrictMode>
-    <WagmiConfig config={config}>
-      <App />
-    </WagmiConfig>
+    <WagmiProvider config={config}>
+      <QueryClientProvider client={queryClient}>
+        <App />
+      </QueryClientProvider>
+    </WagmiProvider>
   </React.StrictMode>
 );