adding mockchain to the rainbow kit network selector

package-lock.json

@@ -12,7 +12,7 @@
         "@radix-ui/react-slot": "^1.1.0",
         "@radix-ui/react-tabs": "^1.1.1",
         "@rainbow-me/rainbowkit": "2.2.8",
-        "@tanstack/react-query": "5.90.2",
+        "@tanstack/react-query": "^5.90.2",
         "class-variance-authority": "^0.7.0",
         "clsx": "^2.1.1",
         "i18next": "^23.15.0",
@@ -24,8 +24,8 @@
         "react-i18next": "^15.1.0",
         "tailwind-merge": "^2.5.5",
         "tailwindcss-animate": "^1.0.7",
-        "viem": "2.38.0",
-        "wagmi": "2.18.0"
+        "viem": "^2.38.1",
+        "wagmi": "^2.18.0"
       },
       "devDependencies": {
         "@types/node": "^22",
@@ -8135,9 +8135,9 @@
       }
     },
     "node_modules/viem": {
-      "version": "2.38.0",
-      "resolved": "https://registry.npmjs.org/viem/-/viem-2.38.0.tgz",
-      "integrity": "sha512-YU5TG8dgBNeYPrCMww0u9/JVeq2ZCk9fzk6QybrPkBooFysamHXL1zC3ua10aLPt9iWoA/gSVf1D9w7nc5B1aA==",
+      "version": "2.38.1",
+      "resolved": "https://registry.npmjs.org/viem/-/viem-2.38.1.tgz",
+      "integrity": "sha512-+5c5b8AmGBYJGMU0A3spIFgsBXseV1E+LlQnSDG80IBoXYDqeQ2XZ8wrwCl9FqLVeP+8NgXtouJaPpmv9VGwHQ==",
       "funding": [
         {
           "type": "github",

package.json

@@ -13,7 +13,7 @@
     "@radix-ui/react-slot": "^1.1.0",
     "@radix-ui/react-tabs": "^1.1.1",
     "@rainbow-me/rainbowkit": "2.2.8",
-    "@tanstack/react-query": "5.90.2",
+    "@tanstack/react-query": "^5.90.2",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
     "i18next": "^23.15.0",
@@ -25,8 +25,8 @@
     "react-i18next": "^15.1.0",
     "tailwind-merge": "^2.5.5",
     "tailwindcss-animate": "^1.0.7",
-    "viem": "2.38.0",
-    "wagmi": "2.18.0"
+    "viem": "^2.38.1",
+    "wagmi": "^2.18.0"
   },
   "devDependencies": {
     "@types/node": "^22",

src/components/providers.tsx

@@ -6,14 +6,32 @@ import { mainnet, polygon, optimism, arbitrum, base } from 'wagmi/chains';
 import { QueryClientProvider, QueryClient } from '@tanstack/react-query';
 import { ThemeProvider, useTheme } from 'next-themes';
 import { useEffect, useState } from 'react';
+import { defineChain } from 'viem';
 
 import { TranslationsProvider } from '@/providers/translations-provider';
 import { Header } from '@/components/header';
 
+const mockchain = defineChain({
+  id: 31337,
+  name: 'Mockchain',
+  nativeCurrency: {
+    decimals: 18,
+    name: 'Ether',
+    symbol: 'ETH',
+  },
+  rpcUrls: {
+    default: { http: ['http://localhost:8545'] },
+  },
+  blockExplorers: {
+    default: { name: 'Explorer', url: 'http://localhost:8545' },
+  },
+  testnet: true,
+});
+
 const config = getDefaultConfig({
   appName: 'Liquidity Party',
   projectId: 'YOUR_PROJECT_ID', // Get this from https://cloud.walletconnect.com
-  chains: [mainnet, polygon, optimism, arbitrum, base],
+  chains: [mainnet, polygon, optimism, arbitrum, base, mockchain],
   ssr: false,
 });