Fix: disconnect wallet if SDK fails to init (#1525)

* Fix: disconnect wallet if SDK fails to init * Rm initial wallet getter * Fix test * Fix e2e test * Update src/hooks/coreSDK/useInitSafeCoreSDK.ts Co-authored-by: Aaron Cook <[email protected]> Co-authored-by: Aaron Cook <[email protected]>
safe-global · Jan 11, 2023 · c233cbb · c233cbb
1 parent bd8c5b5
commit c233cbb
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 8 deletions.
diff --git a/src/components/common/ConnectWallet/AccountCenter.tsx b/src/components/common/ConnectWallet/AccountCenter.tsx
@@ -5,7 +5,7 @@ import css from '@/components/common/ConnectWallet/styles.module.css'
 import EthHashInfo from '@/components/common/EthHashInfo'
 import ExpandLessIcon from '@mui/icons-material/ExpandLess'
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
-import useOnboard, { closeAccountSelectionModal, connectWallet } from '@/hooks/wallets/useOnboard'
+import useOnboard, { switchWallet } from '@/hooks/wallets/useOnboard'
 import { useAppSelector } from '@/store'
 import { selectChainById } from '@/store/chainsSlice'
 import Identicon from '@/components/common/Identicon'
@@ -23,8 +23,7 @@ const AccountCenter = ({ wallet }: { wallet: ConnectedWallet }) => {
   const handleSwitchWallet = () => {
     if (onboard) {
       handleClose()
-      connectWallet(onboard)
-      closeAccountSelectionModal()
+      switchWallet(onboard)
     }
   }
 

diff --git a/src/hooks/coreSDK/__tests__/useInitSafeCoreSDK.test.ts b/src/hooks/coreSDK/__tests__/useInitSafeCoreSDK.test.ts
@@ -3,8 +3,9 @@ import { useInitSafeCoreSDK } from '@/hooks/coreSDK/useInitSafeCoreSDK'
 import * as useSafeInfo from '@/hooks/useSafeInfo'
 import * as coreSDK from '@/hooks/coreSDK/safeCoreSDK'
 import * as useWallet from '@/hooks/wallets/useWallet'
+import * as useOnboard from '@/hooks/wallets/useOnboard'
 import type { SafeInfo } from '@safe-global/safe-gateway-typescript-sdk'
-import type { EIP1193Provider } from '@web3-onboard/core'
+import type { EIP1193Provider, OnboardAPI } from '@web3-onboard/core'
 import { act } from '@testing-library/react'
 import type Safe from '@safe-global/safe-core-sdk'
 
@@ -30,11 +31,16 @@ describe('useInitSafeCoreSDK hook', () => {
     provider: null as unknown as EIP1193Provider,
   }
 
+  const mockOnboard = {
+    disconnectWallet: jest.fn(),
+  } as unknown as OnboardAPI
+
   beforeEach(() => {
     jest.clearAllMocks()
 
     jest.spyOn(useSafeInfo, 'default').mockReturnValue(mockSafeInfo)
     jest.spyOn(useWallet, 'default').mockReturnValue(mockWallet)
+    jest.spyOn(useOnboard, 'default').mockReturnValue(mockOnboard)
   })
 
   it('initializes a Core SDK instance', async () => {

diff --git a/src/hooks/coreSDK/useInitSafeCoreSDK.ts b/src/hooks/coreSDK/useInitSafeCoreSDK.ts
@@ -6,14 +6,16 @@ import { trackError } from '@/services/exceptions'
 import ErrorCodes from '@/services/exceptions/ErrorCodes'
 import { useAppDispatch } from '@/store'
 import { showNotification } from '@/store/notificationsSlice'
+import useOnboard from '@/hooks/wallets/useOnboard'
 
 export const useInitSafeCoreSDK = () => {
   const wallet = useWallet()
+  const onboard = useOnboard()
   const { safe, safeLoaded } = useSafeInfo()
   const dispatch = useAppDispatch()
 
   useEffect(() => {
-    if (!safeLoaded || !wallet?.provider || safe.chainId !== wallet.chainId || !safe.version) {
+    if (!onboard || !wallet?.provider || !safeLoaded || safe.chainId !== wallet.chainId || !safe.version) {
       // If we don't reset the SDK, a previous Safe could remain in the store
       setSafeSDK(undefined)
       return
@@ -24,12 +26,15 @@ export const useInitSafeCoreSDK = () => {
       .catch((e) => {
         dispatch(
           showNotification({
-            message: `The Safe SDK could not be initialized.`,
+            message: `The Safe SDK could not be initialized. Please try connecting the wallet again.`,
             groupKey: 'core-sdk-init-error',
             variant: 'error',
           }),
         )
         trackError(ErrorCodes._105, (e as Error).message)
+
+        // Disconnect the wallet
+        onboard.disconnectWallet({ label: wallet.label })
       })
-  }, [wallet?.provider, wallet?.chainId, safe.chainId, safe.address.value, safe.version, safeLoaded, dispatch])
+  }, [onboard, wallet, safe.chainId, safe.address.value, safe.version, safeLoaded, dispatch])
 }
diff --git a/src/hooks/wallets/useOnboard.ts b/src/hooks/wallets/useOnboard.ts
@@ -107,7 +107,7 @@ export const connectWallet = async (onboard: OnboardAPI, options?: Parameters<On
 
 // A workaround for an onboard "feature" that shows a defunct account select popup
 // See https://github.com/blocknative/web3-onboard/issues/888
-export const closeAccountSelectionModal = () => {
+const closeAccountSelectionModal = () => {
   const maxTries = 100
   const modalText = 'Please switch the active account'
   let tries = 0
@@ -127,6 +127,11 @@ export const closeAccountSelectionModal = () => {
   }, 100)
 }
 
+export const switchWallet = (onboard: OnboardAPI) => {
+  connectWallet(onboard)
+  closeAccountSelectionModal()
+}
+
 // Disable/enable wallets according to chain and cache the last used wallet
 export const useInitOnboard = () => {
   const { configs } = useChains()