Merge pull request #54 from IntersectMBO/wallet-bug-fix

Multiple app windows wallet fixes

src/vva-fe/src/App.tsx

@@ -27,15 +27,16 @@ import {
   WALLET_LS_KEY,
   removeItemFromLocalStorage,
 } from "@utils";
-
 import { SetupInterceptors } from "./services";
-import { useGetDRepInfo } from "./hooks";
+import { useGetDRepInfo, useWalletConnectionListener } from "./hooks";
 
 export default function App() {
   const { enable, setDRep, setIsDrepLoading } = useCardano();
   const navigate = useNavigate();
   const { data } = useGetDRepInfo();
 
+  useWalletConnectionListener();
+
   useEffect(() => {
     SetupInterceptors(navigate);
   }, []);

src/vva-fe/src/hooks/index.ts

@@ -2,6 +2,7 @@ export * from "./useScreenDimension";
 export * from "./useSlider";
 export * from "./useSaveScrollPosition";
 export * from "./useFetchNextPageDetector";
+export * from "./useWalletConnectionListener";
 
 export * from "./forms";
 export * from "./mutations";

src/vva-fe/src/hooks/useWalletConnectionListener.ts

@@ -0,0 +1,21 @@
+import { useEffect } from "react";
+import { useCardano } from "@context";
+import { WALLET_LS_KEY } from "@utils";
+
+export const useWalletConnectionListener = () => {
+  const { disconnectWallet } = useCardano();
+
+  useEffect(() => {
+    const handleStorageChange = (event: StorageEvent) => {
+      if (event.key === `${WALLET_LS_KEY}_name` && event.newValue === null) {
+        disconnectWallet();
+      }
+    };
+
+    window.addEventListener("storage", handleStorageChange);
+
+    return () => {
+      window.removeEventListener("storage", handleStorageChange);
+    };
+  }, []);
+};