@abstraxn/signer-react 3.3.6 → 3.3.8

package/CHANGELOG.md

@@ -5,6 +5,16 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [3.3.8] - 2026-09-16
+
+### Fixed
+- **Create Proposal never opened MetaMask (loader stuck)** – 3.3.7 force-restarted the WalletConnect relay after every return from the wallet, including after *connect*. That restart raced the next `session_request`, so Create Proposal never deeplinked to MetaMask on iOS/Android. Relay restart now happens only for an in-flight approval. New transactions send first, then explicitly open the connected wallet app so the confirmation popup appears.
+
+## [3.3.7] - 2026-09-15
+
+### Fixed
+- **WalletConnect loader stuck after MetaMask approve (create proposal / deposit)** – Returning from the wallet left a zombie relay socket (`connected === true` on a dead WebSocket). The SDK skipped `restartTransport()`, so the tx hash never reached the dapp even though MetaMask confirmed on-chain. After a backgrounded deeplink the relay is now force-restarted, receipt polling retries when the tab is visible again, and React Query refetches on reconnect/focus so status can update without a manual refresh.
+
 ## [3.3.6] - 2026-09-14
 
 ### Fixed

package/dist/src/components/AbstraxnProvider/utils.js

@@ -68,8 +68,11 @@ export function useQueryClientSafe() {
         return new QueryClient({
             defaultOptions: {
                 queries: {
-                    refetchOnWindowFocus: false,
-                    retry: false,
+                    // Recover waitForTransactionReceipt / balance queries after returning
+                    // from a mobile wallet deeplink (tab was frozen / network dropped).
+                    refetchOnWindowFocus: true,
+                    refetchOnReconnect: true,
+                    retry: 2,
                 },
             },
         });

package/dist/src/hooks.js

@@ -12,6 +12,7 @@ import { useWalletClient as useWagmiWalletClient, useAccount, useConfig, useChai
 import { getWalletClient, switchChain } from '@wagmi/core';
 import { getConnectorMeta } from './connectors';
 import { getChainById } from './chains';
+import { waitUntilDocumentVisible } from './walletConnectMobile';
 /**
  * Hook to check if wallet is connected
  */
@@ -2064,15 +2065,40 @@ export function useWaitForTxnReceipt(provider) {
             throw new Error('Transaction hash is required');
         }
         try {
-            // waitForTransactionReceipt is a method on PublicClient
-            const receipt = await provider.waitForTransactionReceipt({
-                hash,
-                confirmations,
-                timeout,
-            });
-            return receipt;
+            // After MetaMask deeplink the tab was frozen; wait until we are visible
+            // again and retry receipt polls so the UI is not stuck on a loader.
+            await waitUntilDocumentVisible();
+            const overallTimeout = timeout ?? 180_000;
+            const startedAt = Date.now();
+            let lastError;
+            while (Date.now() - startedAt < overallTimeout) {
+                const remaining = overallTimeout - (Date.now() - startedAt);
+                try {
+                    const receipt = await provider.waitForTransactionReceipt({
+                        hash,
+                        confirmations,
+                        timeout: Math.min(20_000, remaining),
+                        pollingInterval: 1_500,
+                    });
+                    return receipt;
+                }
+                catch (error) {
+                    lastError = error;
+                    await waitUntilDocumentVisible();
+                    await new Promise((resolve) => setTimeout(resolve, 1_000));
+                }
+            }
+            if (lastError instanceof Error) {
+                throw new Error(`Failed to wait for transaction receipt: ${lastError.message}`);
+            }
+            throw lastError instanceof Error
+                ? lastError
+                : new Error('Failed to wait for transaction receipt');
         }
         catch (error) {
+            if (error instanceof Error && error.message.startsWith('Failed to wait for transaction receipt')) {
+                throw error;
+            }
             if (error instanceof Error) {
                 throw new Error(`Failed to wait for transaction receipt: ${error.message}`);
             }

package/dist/src/walletConnectMobile.d.ts

@@ -34,6 +34,12 @@ export declare function getDappReturnUrl(): string;
  * navigating Safari to a new URL (which reloads and drops in-memory state).
  */
 export declare function getSourceBrowserNativeRedirect(): string | undefined;
+/**
+ * Open the already-connected wallet app so the user sees the confirmation UI.
+ * WalletConnect often sends the session_request but does not deeplink on a
+ * later tx if the QR modal is hidden — Create Proposal then sits on a loader.
+ */
+export declare function openConnectedWalletApp(provider: any): void;
 /**
  * Lazy metadata so url/redirect are read at connect/request time, not at
  * provider mount (which is often the homepage in Next.js layouts).
@@ -64,8 +70,16 @@ export declare function syncWalletConnectDappRedirect(provider: any): void;
 /**
  * Re-open the WalletConnect relay after the mobile browser comes back
  * from the wallet app so pending approve/reject responses can be delivered.
+ *
+ * `force` must be used after the tab was backgrounded: iOS/Android often leave
+ * `relayer.connected === true` on a dead socket, so a ping/early-return skips
+ * the restart and the in-flight tx hash never arrives (loader hangs until refresh).
  */
-export declare function resumeWalletConnectRelayer(provider: any): Promise<void>;
+export declare function resumeWalletConnectRelayer(provider: any, options?: {
+    force?: boolean;
+}): Promise<void>;
+/** Resolves when the dapp tab is in the foreground again (mobile wallet return). */
+export declare function waitUntilDocumentVisible(): Promise<void>;
 /**
  * Undo the inline `display: none !important` we apply after connect so the
  * WalletConnect modal can show "Continue in wallet" and process the response.

package/dist/src/walletConnectMobile.js

@@ -16,6 +16,8 @@
  */
 const PATCHED_FLAG = "__abstraxnWcMobilePatched";
 const PENDING_FLAG = "__abstraxnWcPendingApprovals";
+const NEEDS_RESUME_FLAG = "__abstraxnWcNeedsResume";
+const RESUME_LOCK = "__abstraxnWcResumeLock";
 const RETURN_HREF_KEY = "abstraxn_wc_return_href";
 const RETURN_AT_KEY = "abstraxn_wc_return_at";
 const RETURN_TTL_MS = 3 * 60 * 1000;
@@ -121,6 +123,79 @@ export function getSourceBrowserNativeRedirect() {
         return "googlechrome://";
     return undefined;
 }
+function isAndroid() {
+    if (typeof navigator === "undefined")
+        return false;
+    return /Android/i.test(navigator.userAgent || "");
+}
+function isMobileDevice() {
+    return isIOS() || isAndroid();
+}
+function isWalletHttpDeepLink(url) {
+    try {
+        const host = new URL(url).hostname.toLowerCase();
+        return (host.includes("metamask.app.link") ||
+            host.includes("link.metamask.io") ||
+            host.includes("rainbow.me") ||
+            host.includes("link.trustwallet.com") ||
+            host.includes("walletconnect.com"));
+    }
+    catch {
+        return false;
+    }
+}
+function canOpenAsWalletApp(url) {
+    if (!url)
+        return false;
+    if (/^https?:\/\//i.test(url))
+        return isWalletHttpDeepLink(url);
+    return true;
+}
+/**
+ * Open the already-connected wallet app so the user sees the confirmation UI.
+ * WalletConnect often sends the session_request but does not deeplink on a
+ * later tx if the QR modal is hidden — Create Proposal then sits on a loader.
+ */
+export function openConnectedWalletApp(provider) {
+    if (typeof window === "undefined" || !isMobileDevice())
+        return;
+    restoreWalletConnectModal();
+    try {
+        if (typeof provider?.modal?.open === "function") {
+            void provider.modal.open();
+        }
+    }
+    catch {
+        // Modal may not exist after we force-hid it post-connect.
+    }
+    const peer = provider?.session?.peer?.metadata ??
+        provider?.signer?.session?.peer?.metadata;
+    const native = String(peer?.redirect?.native || "");
+    const universal = String(peer?.redirect?.universal || "");
+    const name = String(peer?.name || "").toLowerCase();
+    let target = "";
+    if (canOpenAsWalletApp(native))
+        target = native;
+    else if (canOpenAsWalletApp(universal))
+        target = universal;
+    else if (name.includes("metamask") || !name) {
+        target = isIOS() ? "metamask://" : "https://metamask.app.link/wc";
+    }
+    else if (name.includes("rainbow")) {
+        target = "rainbow://";
+    }
+    else if (name.includes("trust")) {
+        target = "trust://";
+    }
+    if (!target)
+        return;
+    try {
+        window.location.href = target;
+    }
+    catch {
+        // Ignore
+    }
+}
 function getWalletConnectRedirect() {
     const native = getSourceBrowserNativeRedirect();
     return native ? { native } : undefined;
@@ -249,60 +324,99 @@ function isRelayerConnected(relayer) {
         relayer?.provider?.connected === true ||
         relayer?.provider?.connection?.connected === true);
 }
+async function restartWalletConnectTransport(relayer) {
+    if (typeof relayer.restartTransport === "function") {
+        await relayer.restartTransport();
+        return;
+    }
+    if (typeof relayer.transportOpen === "function") {
+        try {
+            await relayer.transportClose?.();
+        }
+        catch {
+            // Ignore close errors and still try to open.
+        }
+        await relayer.transportOpen();
+    }
+}
 /**
  * Re-open the WalletConnect relay after the mobile browser comes back
  * from the wallet app so pending approve/reject responses can be delivered.
+ *
+ * `force` must be used after the tab was backgrounded: iOS/Android often leave
+ * `relayer.connected === true` on a dead socket, so a ping/early-return skips
+ * the restart and the in-flight tx hash never arrives (loader hangs until refresh).
  */
-export async function resumeWalletConnectRelayer(provider) {
+export async function resumeWalletConnectRelayer(provider, options) {
     if (!provider)
         return;
     const relayer = getWalletConnectRelayer(provider);
     if (!relayer)
         return;
-    try {
-        if (isRelayerConnected(relayer)) {
-            try {
-                const ping = relayer.provider?.connection?.ping;
-                if (typeof ping === "function") {
-                    await Promise.race([
-                        ping.call(relayer.provider.connection),
-                        new Promise((_, reject) => setTimeout(() => reject(new Error("ping timeout")), 1500)),
-                    ]);
-                }
-                return;
-            }
-            catch {
-                // Ping failed — transport looks stale, restart below.
-            }
+    const existing = provider[RESUME_LOCK];
+    if (existing && !options?.force) {
+        try {
+            await existing;
         }
-        if (typeof relayer.restartTransport === "function") {
-            await relayer.restartTransport();
+        catch {
+            // Previous resume failed.
         }
-        else if (typeof relayer.transportOpen === "function") {
-            try {
-                await relayer.transportClose?.();
+        return;
+    }
+    const run = (async () => {
+        try {
+            // New requests must not restart a live session — that races the
+            // session_request and MetaMask never shows a confirmation popup.
+            if (!options?.force) {
+                if (isRelayerConnected(relayer))
+                    return;
+                await restartWalletConnectTransport(relayer);
+                return;
             }
-            catch {
-                // Ignore close errors and still try to open.
+            await restartWalletConnectTransport(relayer);
+            const session = provider?.session ?? provider?.signer?.session;
+            const topic = session?.topic;
+            const client = provider?.signer?.client || provider?.client;
+            if (topic && typeof client?.ping === "function") {
+                try {
+                    await client.ping({ topic });
+                }
+                catch {
+                    // Session ping is best-effort; the request may still complete.
+                }
             }
-            await relayer.transportOpen();
         }
-        const session = provider?.session ?? provider?.signer?.session;
-        const topic = session?.topic;
-        const client = provider?.signer?.client || provider?.client;
-        if (topic && typeof client?.ping === "function") {
-            try {
-                await client.ping({ topic });
-            }
-            catch {
-                // Session ping is best-effort; the request may still complete.
-            }
+        catch {
+            // Best-effort: a failed resume should not break the original request.
         }
+    })();
+    provider[RESUME_LOCK] = run;
+    try {
+        await run;
     }
-    catch {
-        // Best-effort: a failed resume should not break the original request.
+    finally {
+        if (provider[RESUME_LOCK] === run)
+            provider[RESUME_LOCK] = null;
     }
 }
+/** Resolves when the dapp tab is in the foreground again (mobile wallet return). */
+export function waitUntilDocumentVisible() {
+    if (typeof document === "undefined")
+        return Promise.resolve();
+    if (document.visibilityState === "visible")
+        return Promise.resolve();
+    return new Promise((resolve) => {
+        const onVis = () => {
+            if (document.visibilityState === "visible") {
+                document.removeEventListener("visibilitychange", onVis);
+                window.removeEventListener("pageshow", onVis);
+                resolve();
+            }
+        };
+        document.addEventListener("visibilitychange", onVis);
+        window.addEventListener("pageshow", onVis);
+    });
+}
 /**
  * Undo the inline `display: none !important` we apply after connect so the
  * WalletConnect modal can show "Continue in wallet" and process the response.
@@ -347,18 +461,42 @@ export function patchWalletConnectProviderForMobile(provider) {
     provider[PENDING_FLAG] = 0;
     provider.request = async (...args) => {
         const method = getRequestMethod(args);
-        if (!isUserApprovalRpcMethod(method)) {
+        const isApproval = isUserApprovalRpcMethod(method);
+        const wasBackgrounded = !!provider[NEEDS_RESUME_FLAG];
+        if (!isApproval && !wasBackgrounded) {
+            return originalRequest(...args);
+        }
+        if (!isApproval && wasBackgrounded) {
+            try {
+                await resumeWalletConnectRelayer(provider, { force: true });
+            }
+            finally {
+                provider[NEEDS_RESUME_FLAG] = false;
+            }
             return originalRequest(...args);
         }
-        provider[PENDING_FLAG] = (provider[PENDING_FLAG] || 0) + 1;
-        restoreWalletConnectModal();
-        syncWalletConnectDappRedirect(provider);
+        if (isApproval) {
+            provider[PENDING_FLAG] = (provider[PENDING_FLAG] || 0) + 1;
+            restoreWalletConnectModal();
+            syncWalletConnectDappRedirect(provider);
+        }
         try {
-            await resumeWalletConnectRelayer(provider);
-            return await originalRequest(...args);
+            // Never force-restart right before sending a new tx — that is what
+            // blocked the MetaMask popup on Create Proposal after 3.3.7.
+            await Promise.race([
+                resumeWalletConnectRelayer(provider, { force: false }),
+                new Promise((resolve) => setTimeout(resolve, 1000)),
+            ]);
+            const resultPromise = originalRequest(...args);
+            if (typeof window !== "undefined") {
+                window.setTimeout(() => openConnectedWalletApp(provider), 400);
+            }
+            return await resultPromise;
         }
         finally {
-            provider[PENDING_FLAG] = Math.max(0, (provider[PENDING_FLAG] || 1) - 1);
+            if (isApproval) {
+                provider[PENDING_FLAG] = Math.max(0, (provider[PENDING_FLAG] || 1) - 1);
+            }
         }
     };
 }
@@ -373,15 +511,27 @@ export function subscribeWalletConnectForegroundResume(provider) {
     const resume = () => {
         if (timer)
             clearTimeout(timer);
+        const pending = hasPendingWalletConnectApproval(provider);
+        const needsResume = pending || !!provider[NEEDS_RESUME_FLAG];
+        // Do not restart after connect-only backgrounding — that broke the next
+        // session_request so MetaMask never opened for Create Proposal.
+        if (!needsResume) {
+            clearWalletReturnIfSameDocument();
+            return;
+        }
         timer = setTimeout(() => {
             clearWalletReturnIfSameDocument();
-            void resumeWalletConnectRelayer(provider);
-            if (hasPendingWalletConnectApproval(provider)) {
-                restoreWalletConnectModal();
-            }
-        }, 250);
+            void resumeWalletConnectRelayer(provider, { force: true });
+            restoreWalletConnectModal();
+        }, 50);
     };
     const onVisibility = () => {
+        if (document.visibilityState === "hidden") {
+            if (hasPendingWalletConnectApproval(provider)) {
+                provider[NEEDS_RESUME_FLAG] = true;
+            }
+            return;
+        }
         if (document.visibilityState === "visible")
             resume();
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abstraxn/signer-react",
-  "version": "3.3.6",
+  "version": "3.3.8",
   "description": "React SDK for Abstraxn Wallet - React components, hooks, and providers for seamless Web3 wallet integration",
   "main": "./dist/src/index.js",
   "module": "./dist/src/index.js",