added wallet key change event listeners

frontend/src/components/ConnectWalletButton.tsx

@@ -1,10 +1,10 @@
 "use client";
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { connectWalletV1 } from "../services/walletService";
 import { networks } from "../utils/chainsInfo";
 import Image from "next/image";
 import Walletpage from "./popups/WalletPage";
-import { isConnected } from "staking/utils/localStorage";
+import { getWalletName, isConnected } from "staking/utils/localStorage";
 
 export const ConnectWalletButton = ({
   children,
@@ -25,6 +25,36 @@ export const ConnectWalletButton = ({
       setConnected,
     });
   };
+
+  useEffect(() => {
+    const walletName = getWalletName();
+    const accountChangeListener = () => {
+      setTimeout(
+        () =>
+          connectWalletV1({
+            mainnets: networks,
+            testnets: [],
+            walletName: walletName,
+            setConnected,
+          }),
+        1000
+      );
+      window.location.reload()
+    };
+
+    window.addEventListener(
+      `${walletName}_keystorechange`,
+      accountChangeListener
+    );
+
+    return () => {
+      window.removeEventListener(
+        `${walletName}_keystorechange`,
+        accountChangeListener
+      );
+    };
+  }, []);
+
   return connected ? (
     <>{children}</>
   ) : (

frontend/src/utils/localStorage.ts

@@ -9,6 +9,10 @@ export function setWalletName(walletName: string) {
   localStorage.setItem(KEY_WALLET_NAME, walletName);
 }
 
+export function getWalletName(): string {
+  return localStorage.getItem(KEY_WALLET_NAME) || "";
+}
+
 export function removeWalletName() {
   localStorage.removeItem(KEY_WALLET_NAME);
 }