I’m having trouble initializing my signClient in a React app using @walletconnect/sign-client. The initialization process takes forever and never completes. Below is the code snippet I’m using to initialize the client:

const createClient = useCallback(async () => {
  try {
    setIsInitializing(true);
    const claimedOrigin = localStorage.getItem("wallet_connect_dapp_origin") || origin;

    console.log("Starting WalletConnect client initialization...");
    console.log("Client:", Client);

    const _clientPromise = Client.init({
      logger: DEFAULT_LOGGER,
      relayUrl: relayerRegion,
      projectId: DEFAULT_PROJECT_ID,
      metadata: {
        ...(getAppMetadata() || DEFAULT_APP_METADATA),
        url: claimedOrigin,
        verifyUrl: claimedOrigin === "unknown" ? "http://non-existent-url" : DEFAULT_APP_METADATA.verifyUrl,
      },
    });

    // Timeout if initialization takes too long
    const timeoutPromise = new Promise((_, reject) => setTimeout(() => reject(new Error("Initialization timeout")), 10000));

    const _client = await Promise.race([_clientPromise, timeoutPromise]);

    setClient(_client);
    setOrigin(_client.metadata.url);
    prevRelayerValue.current = relayerRegion;
    await _subscribeToEvents(_client);
    await _checkPersistedState(_client);
    await _logClientId(_client);
  } catch (err) {
    console.error("Error initializing WalletConnect client:", err);
  } finally {
    setIsInitializing(false);
    console.log("Initialization process completed, isInitializing set to false");
  }
}, [
  _checkPersistedState,
  _subscribeToEvents,
  _logClientId,
  relayerRegion,
  origin,
]);

"@walletconnect/sign-client": "^2.13.1",
"@walletconnect/types": "^2.13.1",
"@web3modal/ethereum": "^2.7.1",
"@web3modal/react": "^2.7.1",
"@web3modal/standalone": "^2.4.3",

Additional Context:
Environment:

I’m running this code in a React application.
The application environment includes the following versions (16.18) and Material UI

relayUrl is set to a specific relay server region.
projectId, logger, and metadata are provided correctly.

Added logging before and after the Client.init call to ensure the function is being executed.
Introduced a timeout promise to catch and log if the initialization takes too long.
Verified network connectivity and that the relay server URL is accessible.

Has anyone experienced similar issues with the WalletConnect client initialization in a React app?
Are there any known issues with the @walletconnect/sign-client package that might cause this?
What additional steps can I take to debug and resolve this issue?