fix(wallets): cache walletConnectClient

packages/thirdweb/src/react/web/ui/ConnectWallet/screens/WalletConnectReceiverScreen.tsx

@@ -45,7 +45,6 @@ export function WalletConnectReceiverScreen(props: {
         setWalletConnectClient(wcClient);
       })
       .catch(() => {
-        console.log("Failed to establish WalletConnect connection");
         setErrorConnecting("Failed to establish WalletConnect connection");
       });
   }, [activeWallet, props.client, props.closeModal, errorConnecting]);

packages/thirdweb/src/wallets/wallet-connect/receiver/index.ts

@@ -65,6 +65,18 @@ export type CreateWalletConnectSessionOptions = {
   onConnect?: (session: WalletConnectSession) => void;
 };
 
+let walletConnectClientCache = new WeakMap<
+  ThirdwebClient,
+  WalletConnectClient
+>();
+
+/*
+ * @internal
+ */
+export const clearWalletConnectClientCache = () => {
+  walletConnectClientCache = new WeakMap<ThirdwebClient, WalletConnectClient>();
+};
+
 /**
  * Creates a new WalletConnect client for interacting with another application.
  * @param options - The options to use to create the WalletConnect client.
@@ -115,6 +127,10 @@ export async function createWalletConnectClient(
 ): Promise<WalletConnectClient> {
   const { wallet, requestHandlers, onConnect, onDisconnect } = options;
 
+  if (walletConnectClientCache.has(options.client)) {
+    return walletConnectClientCache.get(options.client) as WalletConnectClient;
+  }
+
   initializeSessionStore({ clientId: options.client.clientId });
 
   const defaults = getDefaultAppMetadata();
@@ -188,6 +204,8 @@ export async function createWalletConnectClient(
     return result;
   };
 
+  walletConnectClientCache.set(options.client, walletConnectClient);
+
   return walletConnectClient;
 }
 
@@ -258,7 +276,7 @@ export async function disconnectWalletConnectSession(options: {
       topic: options.session.topic,
       reason: {
         code: 6000,
-        message: "Replaced by new session",
+        message: "Disconnected",
       },
     });
   } catch {

packages/thirdweb/src/wallets/wallet-connect/receiver/receiver.test.ts

@@ -5,6 +5,7 @@ import { TEST_IN_APP_WALLET_A } from "../../../../test/src/test-wallets.js";
 import { getDefaultAppMetadata } from "../../utils/defaultDappMetadata.js";
 import { DEFAULT_PROJECT_ID } from "../constants.js";
 import {
+  clearWalletConnectClientCache,
   createWalletConnectClient,
   createWalletConnectSession,
   disconnectWalletConnectSession,
@@ -64,6 +65,10 @@ beforeEach(() => {
 });
 
 describe("createWalletConnectClient", () => {
+  beforeEach(() => {
+    clearWalletConnectClientCache();
+  });
+
   it("creates a client with provided metadata", async () => {
     const client = await createWalletConnectClient({
       projectId: "test",