fix(bridge): improve Safe wallet + WalletConnect connection stability and transfer UX

Author: dewanshparashar

package.json

@@ -25,7 +25,7 @@
   "resolutions": {
     "node-forge": "1.4.0",
     "@types/node-forge": "1.3.14",
-    "**/@walletconnect/ethereum-provider": "2.13.1",
+    "**/@walletconnect/ethereum-provider": "2.23.9",
     "@octokit/core/@octokit/request-error": "5.1.1",
     "@octokit/core/@octokit/request": "8.4.1",
     "@octokit/graphql/@octokit/request": "8.4.1",

packages/app/package.json

@@ -5,7 +5,7 @@
   "private": true,
   "dependencies": {
     "@arbitrum/sdk": "^4.0.4",
-    "@rainbow-me/rainbowkit": "^2.2.4",
+    "@rainbow-me/rainbowkit": "^2.2.10",
     "@tippyjs/react": "^4.2.6",
     "@uidotdev/usehooks": "^2.4.1",
     "dayjs": "^1.11.13",
@@ -20,7 +20,7 @@
     "axios": "^1.12.0",
     "recharts": "^3.3.0",
     "swr": "^2.3.3",
-    "viem": "^2.38.5",
+    "viem": "^2.47.12",
     "wagmi": "^2.19.1",
     "zod": "^3.24.3",
     "zustand": "^4.3.9"

packages/app/src/components/AppShell/providers/AppProviders.tsx

@@ -54,11 +54,10 @@ const integratorId =
 
 const wagmiConfig = getProps(targetChainKey);
 
-// Clear cache for everything related to WalletConnect v2.
-//
-// TODO: Remove this once the fix for the infinite loop / memory leak is identified.
+// Only clear stale wagmi metadata on load — preserve WalletConnect session data
+// so that Safe and other WC-connected wallets don't lose their sessions on navigation.
 Object.keys(localStorage).forEach((key) => {
-  if (key === 'wagmi.requestedChains' || key === 'wagmi.store' || key.startsWith('wc@2')) {
+  if (key === 'wagmi.requestedChains') {
     localStorage.removeItem(key);
   }
 });

packages/arb-token-bridge-ui/package.json

@@ -13,10 +13,10 @@
     "@moonpay/moonpay-node": "^0.2.12",
     "@moonpay/moonpay-react": "^1.10.5",
     "@offchainlabs/cobalt": "^0.5.1",
-    "@rainbow-me/rainbowkit": "^2.2.4",
+    "@rainbow-me/rainbowkit": "^2.2.10",
     "@rehooks/local-storage": "^2.4.5",
     "@sentry/react": "^9.13.0",
-    "@tanstack/react-query": "^5.63.0",
+    "@tanstack/react-query": "^5.99.0",
     "@uidotdev/usehooks": "^2.4.1",
     "@uniswap/token-lists": "^1.0.0-beta.34",
     "@unstoppabledomains/resolution": "^8.3.3",
@@ -47,7 +47,7 @@
     "swr": "^2.3.3",
     "tailwind-merge": "^3.2.0",
     "use-query-params": "^2.2.1",
-    "viem": "^2.38.5",
+    "viem": "^2.47.12",
     "wagmi": "^2.19.1",
     "zod": "^3.24.3",
     "zustand": "^4.3.9"

packages/arb-token-bridge-ui/src/components/App/useSyncConnectedChainToQueryParams.ts

@@ -58,7 +58,7 @@ export function useSyncConnectedChainToQueryParams() {
         setSourceChainToConnectedChain();
 
         window.alert(
-          `You're connected to the app with a smart contract wallet on ${chainName}. In order to properly enable transfers, the app will now reload.\n\nPlease reconnect after the reload.`,
+          `You're connected to the app with a smart contract wallet on ${chainName}. In order to properly enable transfers, you will be disconnected.\n\nPlease reconnect to continue.`,
         );
         disconnect();
       }

packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanel.tsx

@@ -1267,15 +1267,15 @@ export function TransferPanel() {
         await switchChainAsync({ chainId: sourceChainId });
       }
     } catch (error) {
+      setTransferring(false);
       if (isUserRejectedError(error)) {
         return;
       }
       return networkConnectionWarningToast();
-    } finally {
-      setTransferring(false);
     }
 
     if (!isTransferAllowed) {
+      setTransferring(false);
       return networkConnectionWarningToast();
     }
 

packages/arb-token-bridge-ui/src/components/common/Button.tsx

@@ -47,7 +47,7 @@ export const Button = forwardRef<HTMLButtonElement, ButtonProps>(
       <button
         ref={ref}
         type="button"
-        disabled={disabled}
+        disabled={disabled || loading}
         className={twMerge(
           'arb-hover relative w-max rounded border bg-dark p-2 text-sm',
           'text-white disabled:cursor-not-allowed disabled:border disabled:border-white/10 disabled:bg-white/10 disabled:text-white/50',

packages/arb-token-bridge-ui/src/util/walletConnectUtils.ts

@@ -1,8 +1,4 @@
 export function onDisconnectHandler() {
-  if (typeof indexedDB === 'undefined') {
-    return;
-  }
-
   if (typeof localStorage === 'undefined') {
     return;
   }
@@ -13,7 +9,12 @@ export function onDisconnectHandler() {
     return;
   }
 
-  indexedDB.deleteDatabase('WALLET_CONNECT_V2_INDEXED_DB');
-
-  setTimeout(() => window.location.reload(), 100);
+  // Clear WalletConnect session keys from localStorage so reconnection starts fresh.
+  // Avoid deleting the entire IndexedDB and force-reloading — that was too aggressive
+  // and caused Safe wallet sessions to break on minor disconnects.
+  Object.keys(localStorage).forEach((key) => {
+    if (key.startsWith('wc@2')) {
+      localStorage.removeItem(key);
+    }
+  });
 }