fix(dcellar-web-ui): auto logout if wallet is locked

apps/dcellar-web-ui/src/context/LoginContext/provider.tsx

@@ -1,4 +1,4 @@
-import { PropsWithChildren, useCallback, useMemo } from 'react';
+import { PropsWithChildren, useCallback, useEffect, useMemo } from 'react';
 
 import { LoginContext } from '@/context/LoginContext/index';
 
@@ -42,21 +42,36 @@ export function LoginContextProvider(props: PropsWithChildren<LoginContextProvid
   });
 
   const { pathname } = useRouter();
-  const { address: walletAddress } = useAccount();
+  const { address: walletAddress, connector } = useAccount();
 
-  useAsyncEffect(async () => {
+  useEffect(() => {
     if (pathname === '/' || inline) return;
 
     if (!walletAddress || loginAccount !== walletAddress) {
       logout();
     }
 
+    // Once the wallet is connected, we can get the address
+    // but if wallet is locked, we can't get the connector from wagmi
+    // to avoid errors when using the connector, we treat this situation as not log in.
+    const timer = setTimeout(() => {
+      if (!connector) {
+        logout()
+      }
+    }, 1000)
+
+    return () => {
+      clearTimeout(timer)
+    }
+  }, [walletAddress, connector, pathname, inline, loginAccount, logout])
+
+  useAsyncEffect(async () => {
     if (loginAccount === walletAddress) {
       // expire date less than 24h，remove sp auth & logout
       const spMayExpired = await dispatch(checkSpOffChainMayExpired(walletAddress));
       if (spMayExpired) logout(true);
     }
-  }, [walletAddress, pathname]);
+  }, [walletAddress]);
 
   const { pass } = useLoginGuard(inline);
 

apps/dcellar-web-ui/src/context/WalletConnectContext/config/connectors.ts

@@ -7,7 +7,21 @@ const trustWalletConnector = new InjectedConnector({
   options: {
     name: 'Trust Wallet',
     shimDisconnect: true,
-    getProvider: () => (typeof window !== 'undefined' ? window.trustwallet : undefined),
+    getProvider: () => {
+      try {
+        if (typeof window !== 'undefined' && typeof window?.trustWallet !== 'undefined') {
+          Object.defineProperty(window.trustWallet, 'removeListener', {
+            value: window.trustWallet.off,
+          });
+          return window?.trustWallet;
+        } else {
+          return null;
+        }
+      } catch (e) {
+        // eslint-disable-next-line no-console
+        console.log('Trust Wallet Provider Error:', e);
+      }
+    },
   },
 });
 

apps/dcellar-web-ui/typings.d.ts

@@ -28,7 +28,7 @@ declare global {
     ethereum: any;
     ga: any;
     clipboardData: any;
-    trustwallet: any;
+    trustWallet: any;
     // zk.wasm export
     eddsaSign: any;
   }