@rozoai/intent-pay 0.1.48 → 0.1.50

package/build/assets/chains.d.ts

@@ -1,3 +1,4 @@
+import { arbitrum, base, bsc, celo, ethereum, hyperEVM, linea, mantle, optimism, polygon, rozoSolana, rozoStellar, solana, stellar, worldchain } from "@rozoai/intent-common";
 export declare const UnknownChain: (props: any) => import("react").JSX.Element;
 export declare const Ethereum: (props: any) => import("react").JSX.Element;
 export declare const Polygon: (props: any) => import("react").JSX.Element;
@@ -9,5 +10,19 @@ export declare const Base: (props: any) => import("react").JSX.Element;
 export declare const Worldchain: (props: any) => import("react").JSX.Element;
 export declare const Stellar: (props: any) => import("react").JSX.Element;
 export declare const chainToLogo: {
-    [x: number]: import("react").JSX.Element;
+    [arbitrum.chainId]: import("react").JSX.Element;
+    [base.chainId]: import("react").JSX.Element;
+    [bsc.chainId]: import("react").JSX.Element;
+    [celo.chainId]: import("react").JSX.Element;
+    [ethereum.chainId]: import("react").JSX.Element;
+    [linea.chainId]: import("react").JSX.Element;
+    [mantle.chainId]: import("react").JSX.Element;
+    [optimism.chainId]: import("react").JSX.Element;
+    [polygon.chainId]: import("react").JSX.Element;
+    [worldchain.chainId]: import("react").JSX.Element;
+    [hyperEVM.chainId]: import("react").JSX.Element;
+    [solana.chainId]: import("react").JSX.Element;
+    [rozoSolana.chainId]: import("react").JSX.Element;
+    [stellar.chainId]: import("react").JSX.Element;
+    [rozoStellar.chainId]: import("react").JSX.Element;
 };

package/build/components/RozoPayModal/guards.d.ts

@@ -0,0 +1,20 @@
+export type WalletPaymentState = "idle" | "waiting" | "processing";
+type PaymentFsmState = "idle" | "preview" | "unhydrated" | "payment_unpaid" | "payment_started" | "payment_completed" | "payment_bounced" | "payout_completed" | "error";
+export declare const WALLET_REQUEST_MESSAGE = "Wallet still needs your action. Reject or close it in your wallet first.";
+export declare function isWalletWaiting(walletPaymentState: WalletPaymentState): walletPaymentState is "waiting";
+export declare function isWalletProcessing(walletPaymentState: WalletPaymentState): walletPaymentState is "processing";
+export declare function isCloseable({ route, walletPaymentState, paymentFsmState, isDepositAddressReady, enforceSupportedChains, isEthConnected, chainIsSupported, }: {
+    route: string;
+    walletPaymentState: WalletPaymentState;
+    paymentFsmState: PaymentFsmState;
+    isDepositAddressReady: boolean;
+    enforceSupportedChains: boolean | undefined;
+    isEthConnected: boolean;
+    chainIsSupported: boolean | null;
+}): boolean;
+export declare function showsBackButton({ route, walletPaymentState, paymentFsmState, }: {
+    route: string;
+    walletPaymentState: WalletPaymentState;
+    paymentFsmState: PaymentFsmState;
+}): boolean;
+export {};

package/build/components/RozoPayModal/guards.test.d.ts

@@ -0,0 +1 @@
+export {};

package/build/constants/rozoConfig.d.ts

@@ -5,7 +5,9 @@
 export declare const ROZO_INVOICE_URL = "https://invoice.rozo.ai";
 export declare const DEFAULT_ROZO_APP_ID = "rozoIntentPay";
 export declare const DEFAULT_STELLAR_RPC_URL = "https://horizon.stellar.org";
-export declare const POSTHOG_KEY = "phc_uWihkYfFeVLE3x62fSVei5h2f2otanBhXg8Jsy7YP8qj";
-export declare const POSTHOG_HOST = "https://us.i.posthog.com";
+export declare const POSTHOG_KEY = "phc_s5bLUzDdCvQ9cKqdBSNZhcj7N44JuwVvDZHnZGnYzbLV";
+export declare const POSTHOG_HOST = "https://hog.rozo.ai";
+export declare const POSTHOG_UI_HOST = "https://us.posthog.com";
+export declare const POSTHOG_APP_NAME = "rozo-intent-sdk";
 export declare const STELLAR_INSUFFICIENT_XLM_BASE = "Your Stellar account needs a little XLM to pay the network fee. Please add XLM and try again.";
 export declare function getStellarInsufficientXlmMessage(spendable: number, baseFeeXlm: number): string;

package/build/hooks/usePaymentState.d.ts

@@ -30,6 +30,8 @@ export interface PaymentState {
     paymentWaitingMessage: string | undefined;
     depositAddressState: "idle" | "creating" | "ready";
     setDepositAddressState: (state: "idle" | "creating" | "ready") => void;
+    walletPaymentState: "idle" | "waiting" | "processing";
+    setWalletPaymentState: (state: "idle" | "waiting" | "processing") => void;
     externalPaymentOptions: ReturnType<typeof useExternalPaymentOptions>;
     selectedWallet: WalletConfigProps | undefined;
     selectedWalletDeepLink: string | undefined;
@@ -101,6 +103,11 @@ export interface PaymentState {
     rozoPaymentId: string | undefined;
     setSenderAddress: (address: string | undefined) => void;
     senderAddress: string | undefined;
+    pendingPaymentAttemptId: string | undefined;
+    tryClaimPaymentAttempt: (orderId: string) => boolean;
+    replacePaymentAttempt: (orderId: string, nextOrderId: string) => boolean;
+    releasePaymentAttempt: (orderId: string) => void;
+    clearPaymentAttempt: () => void;
     ethWalletAddress: string | undefined;
     solanaPubKey: string | undefined;
     stellarPubKey: string | undefined;

package/build/lib/analytics/events.d.ts

@@ -13,6 +13,7 @@ export declare const PAYMENT_EVENTS: {
     readonly PAYMENT_QUOTE_RECEIVED: "payment_quote_received";
     readonly PAYMENT_QUOTE_FAILED: "payment_quote_failed";
     readonly PAYMENT_CONFIRMED: "payment_confirmed";
+    readonly PAYMENT_WALLET_CONFIRMATION_PENDING: "payment_wallet_confirmation_pending";
     readonly PAYMENT_SUBMITTED: "payment_submitted";
     readonly PAYMENT_COMPLETED: "payment_completed";
     readonly PAYMENT_FAILED: "payment_failed";
@@ -36,6 +37,7 @@ export declare const ROZO_EVENTS: {
     readonly PAYMENT_QUOTE_RECEIVED: "payment_quote_received";
     readonly PAYMENT_QUOTE_FAILED: "payment_quote_failed";
     readonly PAYMENT_CONFIRMED: "payment_confirmed";
+    readonly PAYMENT_WALLET_CONFIRMATION_PENDING: "payment_wallet_confirmation_pending";
     readonly PAYMENT_SUBMITTED: "payment_submitted";
     readonly PAYMENT_COMPLETED: "payment_completed";
     readonly PAYMENT_FAILED: "payment_failed";

package/build/package.json.js

@@ -1,4 +1,4 @@
-var version = "0.1.48";
+var version = "0.1.50";
 var packageJson = {
 	version: version};
 

package/build/payment/createPaymentPayload.d.ts

@@ -1,4 +1,4 @@
-import { ApiVersion, CreateNewPaymentParams, DepositAddressPaymentOptionMetadata, FeeResponseData, FeeType, RozoPayHydratedOrderWithOrg, RozoPayOrderWithOrg, Token, TokenSymbol, WalletPaymentOption } from "@rozoai/intent-common";
+import { ApiVersion, CreateNewPaymentParams, DepositAddressPaymentOptionMetadata, FeeResponseData, FeeType, PaymentResponse, RozoPayHydratedOrderWithOrg, RozoPayOrderWithOrg, Token, TokenSymbol, WalletPaymentOption } from "@rozoai/intent-common";
 import { PayParams } from "./paymentFsm";
 type OrderLike = RozoPayHydratedOrderWithOrg | RozoPayOrderWithOrg;
 export type CreatePaymentContext = {
@@ -86,14 +86,7 @@ export type WalletSourceQuoteOrder = {
     paymentBreakdown?: FeeResponseData;
 };
 /** Preserve payment/checkout's authoritative source quote on SDK-owned state. */
-export declare function withWalletSourceQuote<T extends RozoPayHydratedOrderWithOrg>(order: T, response: {
-    source?: {
-        amount?: string;
-        chainId?: number | string;
-        tokenAddress?: string;
-    };
-    destination?: unknown;
-}): T & WalletSourceQuoteOrder;
+export declare function withWalletSourceQuote<T extends RozoPayHydratedOrderWithOrg>(order: T, response: PaymentResponse): T & WalletSourceQuoteOrder;
 /** Amount authorized by payment/checkout, validated against selected source token. */
 export declare function resolveWalletPaymentAmount(order: WalletSourceQuoteOrder, option: Pick<WalletPaymentOption, "required">): bigint;
 export {};

package/build/provider/StellarContextProvider.d.ts

@@ -1,5 +1,13 @@
 import type { ISupportedWallet, StellarWalletsKit } from "@creit.tech/stellar-wallets-kit";
 import type { Horizon } from "@stellar/stellar-sdk";
+import type { ReactNode } from "react";
+type StellarContextProvider = {
+    children: ReactNode;
+    rpcUrl?: string;
+    kit?: StellarWalletsKit;
+    stellarWalletPersistence?: boolean;
+    log?: (msg: string) => void;
+};
 type StellarContextProviderValue = {
     kit: StellarWalletsKit | undefined;
     isExternalKit: boolean;

package/build/src/components/Pages/PayWithToken/index.js

@@ -12,22 +12,23 @@ import { ROZO_EVENTS } from '../../../lib/analytics/events.js';
 import { useAnalytics } from '../../../provider/AnalyticsProvider.js';
 import { buildFeeQuoteParams, getCachedFee } from '../../../utils/feeCache.js';
 import Button from '../../Common/Button/index.js';
-import { PageContent, ModalContent, ModalH1, Link } from '../../Common/Modal/styles.js';
+import { PageContent, ModalContent, ModalBody, ModalH1, Link } from '../../Common/Modal/styles.js';
 import PaymentBreakdown from '../../Common/PaymentBreakdown/index.js';
 import TokenLogoSpinner from '../../Spinners/TokenLogoSpinner/index.js';
 
 var PayState;
 (function (PayState) {
-    PayState["WaitingForPayment"] = "Waiting for Payment";
+    PayState["WaitingForConfirmation"] = "Waiting for Confirmation";
     PayState["PreparingTransaction"] = "Preparing Transaction";
     PayState["RequestCancelled"] = "Payment Cancelled";
     PayState["RequestSuccessful"] = "Payment Successful";
+    PayState["WaitingForWallet"] = "Wallet Confirmation Pending";
     PayState["RequestFailed"] = "Payment Failed";
 })(PayState || (PayState = {}));
 const PayWithToken = () => {
     const walletChainId = useChainId();
     const { triggerResize, paymentState, setRoute, log } = usePayContext();
-    const { payWithToken, setSenderAddress, selectedTokenOption, walletPaymentOptions, } = paymentState;
+    const { payWithToken, setSenderAddress, selectedTokenOption, walletPaymentOptions, pendingPaymentAttemptId, tryClaimPaymentAttempt, releasePaymentAttempt, setWalletPaymentState, } = paymentState;
     const { switchChainAsync } = useSwitchChain();
     const { address } = useAccount();
     const { store, setPaymentUnpaid, rozoPaymentId, order, paymentState: rozoPaymentState, } = useRozoPay();
@@ -54,8 +55,10 @@ const PayWithToken = () => {
         // });
     };
     const switchChainErrorRef = useRef(null);
-    const trySwitchingChain = async (option, forceSwitch = false) => {
-        if (walletChainId !== option.required.token.chainId || forceSwitch) {
+    const transferInFlightRef = useRef(false);
+    const autoTransferOrderRef = useRef(null);
+    const trySwitchingChain = async (option) => {
+        if (walletChainId !== option.required.token.chainId) {
             const resultChain = await (async () => {
                 try {
                     return await switchChainAsync({
@@ -81,202 +84,237 @@ const PayWithToken = () => {
         return true;
     };
     const handleTransfer = useCallback(async (option) => {
-        // Read the freshest order straight from the store instead of the React
-        // closure snapshot. For payId mode this is the getPayment-derived order
-        // loaded by runSetPayIdEffects, so getFee below runs against the latest
-        // payment response (correct appId, amount, destination, etc.).
-        const currentState = store.getState();
-        const currentOrder = currentState.type !== "idle" ? currentState.order : undefined;
-        if (!currentOrder) {
-            throw new Error("Order not initialized");
-        }
-        capture(ROZO_EVENTS.PAYMENT_CONFIRMED, {
-            payment_id: rozoPaymentId ?? order?.externalId,
-            source_chain: option.required.token.chainId,
-            token_symbol: option.required.token.symbol,
-            amount: paymentState.payParams?.toUnits != null
-                ? String(paymentState.payParams.toUnits)
-                : order?.destFinalCallTokenAmount?.usd != null
-                    ? String(order.destFinalCallTokenAmount.usd)
-                    : undefined,
-        });
-        // Switch chain if necessary
-        setPayState(PayState.PreparingTransaction);
-        const switchChain = await trySwitchingChain(option);
-        if (!switchChain) {
-            console.error("Switching chain failed");
-            setFeeLoading(false);
-            setRoute(ROUTES.ERROR, {
-                error: switchChainErrorRef.current ?? "switch_chain_failed",
-            });
+        if (transferInFlightRef.current) {
+            log("[PayWithToken] transfer already in flight");
             return;
         }
+        transferInFlightRef.current = true;
+        let attemptId;
         try {
-            const currentRozoPaymentId = rozoPaymentId ?? currentOrder.externalId ?? undefined;
-            // Only set unpaid if state is payment_started (for retry scenarios and cross-chain switches)
-            if (currentRozoPaymentId && rozoPaymentState === "payment_started") {
-                try {
-                    await setPaymentUnpaid(currentRozoPaymentId);
-                }
-                catch (e) {
-                    console.error("Failed to set payment unpaid:", e);
-                    // If already unpaid, continue anyway
-                }
+            // Read the freshest order straight from the store instead of the React
+            // closure snapshot. For payId mode this is the getPayment-derived order
+            // loaded by runSetPayIdEffects, so getFee below runs against the latest
+            // payment response (correct appId, amount, destination, etc.).
+            const currentState = store.getState();
+            const currentOrder = currentState.type !== "idle" ? currentState.order : undefined;
+            if (!currentOrder) {
+                throw new Error("Order not initialized");
             }
-            // @NOTE: Fee calculation
-            const request = beginRequestScope(PAYMENT_REQUEST_SCOPE);
-            setFeeLoading(true);
-            const destToken = currentOrder.destFinalCallTokenAmount?.token;
-            const destAmountAtomic = currentOrder.destFinalCallTokenAmount?.amount;
-            const toUnits = destAmountAtomic && destToken
-                ? formatUnits(BigInt(destAmountAtomic), destToken.decimals)
-                : option.required.usd.toString();
-            const feeParams = buildFeeQuoteParams({
-                order: currentOrder,
-                payParams: paymentState.payParams,
-                destChainId: destToken.chainId,
-                destTokenAddress: destToken.token,
-                destAddress: getCanonicalDestination(currentOrder).finalDestinationAddress ??
-                    "",
-                sourceChainId: option.required.token.chainId,
-                sourceTokenAddress: option.required.token.token,
-                toUnits,
-            });
-            const feeData = await getCachedFee(feeParams, { signal: request.signal });
-            setFeeLoading(false);
-            if (request.signal.aborted) {
-                return;
-            }
-            if (feeData.error) {
-                if (feeData.error.name === "AbortError") {
-                    return;
-                }
-                capture(ROZO_EVENTS.PAYMENT_FAILED, {
-                    payment_id: rozoPaymentId ?? order?.externalId,
-                    error_message: feeData.error.message,
+            attemptId = currentOrder.externalId ?? String(currentOrder.id);
+            if (!tryClaimPaymentAttempt(attemptId)) {
+                log("[PayWithToken] wallet request already pending");
+                capture(ROZO_EVENTS.PAYMENT_WALLET_CONFIRMATION_PENDING, {
+                    payment_id: currentOrder.externalId,
                     source_chain: option.required.token.chainId,
-                    source_token: option.required.token.symbol,
-                    dest_chain: destToken.chainId,
-                    dest_token: destToken.symbol,
+                    token_symbol: option.required.token.symbol,
                 });
-                console.error("Fee calculation failed", feeData.error);
-                setRoute(ROUTES.ERROR, { error: feeData.error.message });
+                setPayState(PayState.WaitingForWallet);
                 return;
             }
-            setFeeData(feeData.data);
-            setPayState(PayState.WaitingForPayment);
-            const result = await payWithToken({
-                ...option,
-                fees: {
-                    ...option.fees,
-                    usd: feeData.data?.source.fee != null
-                        ? Number(feeData.data.source.fee)
-                        : option.fees.usd,
-                },
-            }, store);
-            const completedState = store.getState();
-            const canonicalBreakdown = completedState.type !== "idle"
-                ? completedState.order.paymentBreakdown
-                : undefined;
-            if (canonicalBreakdown)
-                setFeeData(canonicalBreakdown);
-            setTxURL(getChainExplorerTxUrl(option.required.token.chainId, result.txHash));
-            if (result.success) {
-                capture(ROZO_EVENTS.PAYMENT_SUBMITTED, {
-                    payment_id: rozoPaymentId ?? order?.externalId,
-                    tx_hash: result.txHash,
-                    source_chain: option.required.token.chainId,
-                    token_symbol: option.required.token.symbol,
+            capture(ROZO_EVENTS.PAYMENT_CONFIRMED, {
+                payment_id: rozoPaymentId ?? order?.externalId,
+                source_chain: option.required.token.chainId,
+                token_symbol: option.required.token.symbol,
+                amount: paymentState.payParams?.toUnits != null
+                    ? String(paymentState.payParams.toUnits)
+                    : order?.destFinalCallTokenAmount?.usd != null
+                        ? String(order.destFinalCallTokenAmount.usd)
+                        : undefined,
+            });
+            // Switch chain if necessary
+            setPayState(PayState.PreparingTransaction);
+            const switchChain = await trySwitchingChain(option);
+            if (!switchChain) {
+                console.error("Switching chain failed");
+                setFeeLoading(false);
+                setRoute(ROUTES.ERROR, {
+                    error: switchChainErrorRef.current ?? "switch_chain_failed",
                 });
-                try {
-                    sessionStorage.setItem(`rozo_submitted_at:${rozoPaymentId ?? order?.externalId}`, String(Date.now()));
-                }
-                catch { }
-                setSenderAddress(address);
-                setPayState(PayState.RequestSuccessful);
-                setTimeout(() => {
-                    setRoute(ROUTES.CONFIRMATION, { event: "wait-pay-with-token" });
-                }, 200);
-                // Refresh wallet payment options after 1 second to prevent stale balances
-                setTimeout(() => {
-                    walletPaymentOptions.refreshOptions();
-                }, 2000);
+                return;
             }
-            else {
-                capture(ROZO_EVENTS.PAYMENT_FAILED, {
-                    payment_id: rozoPaymentId ?? order?.externalId,
-                    error_message: "payment_unsuccessful",
-                    source_chain: option.required.token.chainId,
+            try {
+                const currentRozoPaymentId = rozoPaymentId ?? currentOrder.externalId ?? undefined;
+                // Only set unpaid if state is payment_started (for retry scenarios and cross-chain switches)
+                if (currentRozoPaymentId && rozoPaymentState === "payment_started") {
+                    try {
+                        await setPaymentUnpaid(currentRozoPaymentId);
+                    }
+                    catch (e) {
+                        console.error("Failed to set payment unpaid:", e);
+                        // If already unpaid, continue anyway
+                    }
+                }
+                // @NOTE: Fee calculation
+                const request = beginRequestScope(PAYMENT_REQUEST_SCOPE);
+                setFeeLoading(true);
+                const destToken = currentOrder.destFinalCallTokenAmount?.token;
+                const destAmountAtomic = currentOrder.destFinalCallTokenAmount?.amount;
+                const toUnits = destAmountAtomic && destToken
+                    ? formatUnits(BigInt(destAmountAtomic), destToken.decimals)
+                    : option.required.usd.toString();
+                const feeParams = buildFeeQuoteParams({
+                    order: currentOrder,
+                    payParams: paymentState.payParams,
+                    destChainId: destToken.chainId,
+                    destTokenAddress: destToken.token,
+                    destAddress: getCanonicalDestination(currentOrder).finalDestinationAddress ??
+                        "",
+                    sourceChainId: option.required.token.chainId,
+                    sourceTokenAddress: option.required.token.token,
+                    toUnits,
                 });
-                setPayState(PayState.RequestFailed);
-            }
-        }
-        catch (e) {
-            // Abort = user navigated away (Back / reset). Not a payment failure.
-            if (isAbortError(e))
-                return;
-            if (e?.name === "ConnectorChainMismatchError") {
-                // Workaround for Rainbow wallet bug -- user is able to switch chain without
-                // the wallet updating the chain ID for wagmi.
-                log("Chain mismatch detected, attempting to switch and retry");
-                const switchSuccessful = await trySwitchingChain(option, true);
-                if (switchSuccessful) {
+                const feeData = await getCachedFee(feeParams, { signal: request.signal });
+                setFeeLoading(false);
+                if (request.signal.aborted) {
+                    return;
+                }
+                if (feeData.error) {
+                    if (feeData.error.name === "AbortError") {
+                        return;
+                    }
+                    capture(ROZO_EVENTS.PAYMENT_FAILED, {
+                        payment_id: rozoPaymentId ?? order?.externalId,
+                        error_message: feeData.error.message,
+                        source_chain: option.required.token.chainId,
+                        source_token: option.required.token.symbol,
+                        dest_chain: destToken.chainId,
+                        dest_token: destToken.symbol,
+                    });
+                    console.error("Fee calculation failed", feeData.error);
+                    setRoute(ROUTES.ERROR, { error: feeData.error.message });
+                    return;
+                }
+                setFeeData(feeData.data);
+                setPayState(PayState.WaitingForConfirmation);
+                const result = await payWithToken({
+                    ...option,
+                    fees: {
+                        ...option.fees,
+                        usd: feeData.data?.source.fee != null
+                            ? Number(feeData.data.source.fee)
+                            : option.fees.usd,
+                    },
+                }, store);
+                const completedState = store.getState();
+                const canonicalBreakdown = completedState.type !== "idle"
+                    ? completedState.order.paymentBreakdown
+                    : undefined;
+                if (canonicalBreakdown)
+                    setFeeData(canonicalBreakdown);
+                setTxURL(getChainExplorerTxUrl(option.required.token.chainId, result.txHash));
+                if (result.success) {
+                    capture(ROZO_EVENTS.PAYMENT_SUBMITTED, {
+                        payment_id: rozoPaymentId ?? order?.externalId,
+                        tx_hash: result.txHash,
+                        source_chain: option.required.token.chainId,
+                        token_symbol: option.required.token.symbol,
+                    });
                     try {
-                        const retryResult = await payWithToken(option, store);
-                        setTxURL(getChainExplorerTxUrl(option.required.token.chainId, retryResult.txHash));
-                        if (retryResult.success) {
-                            capture(ROZO_EVENTS.PAYMENT_SUBMITTED, {
-                                payment_id: rozoPaymentId ?? order?.externalId,
-                                tx_hash: retryResult.txHash,
-                                source_chain: option.required.token.chainId,
-                                token_symbol: option.required.token.symbol,
-                            });
-                            try {
-                                sessionStorage.setItem(`rozo_submitted_at:${rozoPaymentId ?? order?.externalId}`, String(Date.now()));
+                        sessionStorage.setItem(`rozo_submitted_at:${rozoPaymentId ?? order?.externalId}`, String(Date.now()));
+                    }
+                    catch { }
+                    setSenderAddress(address);
+                    setPayState(PayState.RequestSuccessful);
+                    setTimeout(() => {
+                        setRoute(ROUTES.CONFIRMATION, { event: "wait-pay-with-token" });
+                    }, 200);
+                    // Refresh wallet payment options after 1 second to prevent stale balances
+                    setTimeout(() => {
+                        walletPaymentOptions.refreshOptions();
+                    }, 2000);
+                }
+                else {
+                    capture(ROZO_EVENTS.PAYMENT_FAILED, {
+                        payment_id: rozoPaymentId ?? order?.externalId,
+                        error_message: "payment_unsuccessful",
+                        source_chain: option.required.token.chainId,
+                    });
+                    setPayState(PayState.RequestFailed);
+                }
+            }
+            catch (e) {
+                // Abort = user navigated away (Back / reset). Not a payment failure.
+                if (isAbortError(e))
+                    return;
+                if (e?.name === "ConnectorChainMismatchError") {
+                    // Workaround for Rainbow wallet bug -- user is able to switch chain without
+                    // the wallet updating the chain ID for wagmi.
+                    log("Chain mismatch detected, attempting to switch and retry");
+                    const switchSuccessful = await trySwitchingChain(option);
+                    if (switchSuccessful) {
+                        try {
+                            const retryResult = await payWithToken(option, store);
+                            setTxURL(getChainExplorerTxUrl(option.required.token.chainId, retryResult.txHash));
+                            if (retryResult.success) {
+                                capture(ROZO_EVENTS.PAYMENT_SUBMITTED, {
+                                    payment_id: rozoPaymentId ?? order?.externalId,
+                                    tx_hash: retryResult.txHash,
+                                    source_chain: option.required.token.chainId,
+                                    token_symbol: option.required.token.symbol,
+                                });
+                                try {
+                                    sessionStorage.setItem(`rozo_submitted_at:${rozoPaymentId ?? order?.externalId}`, String(Date.now()));
+                                }
+                                catch { }
+                                setSenderAddress(address);
+                                setPayState(PayState.RequestSuccessful);
+                                setTimeout(() => {
+                                    setRoute(ROUTES.CONFIRMATION, {
+                                        event: "wait-pay-with-token",
+                                    });
+                                }, 200);
+                                // Refresh wallet payment options after 1 second to prevent stale balances
+                                setTimeout(() => {
+                                    walletPaymentOptions.refreshOptions();
+                                }, 2000);
                             }
-                            catch { }
-                            setSenderAddress(address);
-                            setPayState(PayState.RequestSuccessful);
-                            setTimeout(() => {
-                                setRoute(ROUTES.CONFIRMATION, {
-                                    event: "wait-pay-with-token",
+                            else {
+                                capture(ROZO_EVENTS.PAYMENT_FAILED, {
+                                    payment_id: rozoPaymentId ?? order?.externalId,
+                                    error_message: "payment_unsuccessful_after_chain_switch",
+                                    source_chain: option.required.token.chainId,
                                 });
-                            }, 200);
-                            // Refresh wallet payment options after 1 second to prevent stale balances
-                            setTimeout(() => {
-                                walletPaymentOptions.refreshOptions();
-                            }, 2000);
+                                setPayState(PayState.RequestFailed);
+                            }
+                            return; // Payment handled after switching chain
                         }
-                        else {
-                            capture(ROZO_EVENTS.PAYMENT_FAILED, {
-                                payment_id: rozoPaymentId ?? order?.externalId,
-                                error_message: "payment_unsuccessful_after_chain_switch",
-                                source_chain: option.required.token.chainId,
-                            });
-                            setPayState(PayState.RequestFailed);
+                        catch (retryError) {
+                            console.error("Failed to pay with token after switching chain", retryError);
+                            throw retryError;
                         }
-                        return; // Payment handled after switching chain
-                    }
-                    catch (retryError) {
-                        console.error("Failed to pay with token after switching chain", retryError);
-                        throw retryError;
                     }
                 }
+                capture(ROZO_EVENTS.PAYMENT_FAILED, {
+                    payment_id: rozoPaymentId ?? order?.externalId,
+                    error_message: e?.message ?? "unknown_error",
+                    source_chain: option.required.token.chainId,
+                });
+                setPayState(PayState.RequestCancelled);
+                console.error("Failed to pay with token", e);
             }
-            capture(ROZO_EVENTS.PAYMENT_FAILED, {
-                payment_id: rozoPaymentId ?? order?.externalId,
-                error_message: e?.message ?? "unknown_error",
-                source_chain: option.required.token.chainId,
-            });
-            setPayState(PayState.RequestCancelled);
-            console.error("Failed to pay with token", e);
+        }
+        finally {
+            if (attemptId)
+                releasePaymentAttempt(attemptId);
+            transferInFlightRef.current = false;
         }
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [walletPaymentOptions, rozoPaymentId, order, rozoPaymentState]);
+    useEffect(() => {
+        if (!pendingPaymentAttemptId && payState === PayState.WaitingForWallet) {
+            setPayState(PayState.RequestCancelled);
+        }
+    }, [pendingPaymentAttemptId, payState]);
     useEffect(() => {
         if (!selectedTokenOption)
             return;
+        const currentState = store.getState();
+        const currentOrder = currentState.type !== "idle" ? currentState.order : undefined;
+        const orderKey = currentOrder?.externalId ?? String(currentOrder?.id ?? "");
+        if (!orderKey || autoTransferOrderRef.current === orderKey)
+            return;
+        autoTransferOrderRef.current = orderKey;
         const transferTimeout = setTimeout(() => {
             handleTransfer(selectedTokenOption);
         }, 100);
@@ -287,12 +325,20 @@ const PayWithToken = () => {
     }, [selectedTokenOption]);
     useEffect(() => {
         triggerResize();
+        setWalletPaymentState(payState === PayState.WaitingForConfirmation ||
+            payState === PayState.WaitingForWallet
+            ? "waiting"
+            : "idle");
+        return () => setWalletPaymentState("idle");
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [payState]);
     if (selectedTokenOption == null) {
         return jsx(PageContent, {});
     }
-    return (jsxs(PageContent, { children: [jsx(TokenLogoSpinner, { token: selectedTokenOption.required.token }), jsxs(ModalContent, { style: { paddingBottom: 0 }, "$preserveDisplay": true, children: [txURL ? (jsx(ModalH1, { children: jsx(Link, { href: txURL, target: "_blank", rel: "noopener noreferrer", children: payState }) })) : (jsx(ModalH1, { children: payState })), jsx(PaymentBreakdown, { paymentOption: {
+    if (payState === PayState.WaitingForWallet) {
+        return (jsxs(PageContent, { children: [jsx(TokenLogoSpinner, { token: selectedTokenOption.required.token }), jsx(ModalContent, { style: { paddingBottom: 0 }, "$preserveDisplay": true, children: jsx(ModalBody, { children: "Wallet confirmation pending" }) })] }));
+    }
+    return (jsxs(PageContent, { children: [jsx(TokenLogoSpinner, { token: selectedTokenOption.required.token }), jsxs(ModalContent, { style: { paddingBottom: 0 }, "$preserveDisplay": true, children: [txURL ? (jsx(ModalH1, { children: jsx(Link, { href: txURL, target: "_blank", rel: "noopener noreferrer", children: payState }) })) : (jsx(ModalH1, { children: payState })), (payState !== PayState.RequestCancelled || (feeData && !feeLoading)) && (jsx(PaymentBreakdown, { paymentOption: {
                             ...selectedTokenOption,
                             fees: {
                                 ...selectedTokenOption.fees,
@@ -300,7 +346,7 @@ const PayWithToken = () => {
                                     ? Number(feeData.source.fee)
                                     : selectedTokenOption.fees.usd,
                             },
-                        }, feeData: feeData, feeLoading: feeLoading }), payState === PayState.RequestCancelled && (jsx(Button, { onClick: () => handleTransfer(selectedTokenOption), children: "Retry Payment" })), payState === PayState.RequestFailed && (jsx(Button, { onClick: handleContactClick, children: "Contact Support" }))] })] }));
+                        }, feeData: feeData, feeLoading: feeLoading })), payState === PayState.RequestCancelled && (jsx(Button, { onClick: () => handleTransfer(selectedTokenOption), children: "Retry Payment" })), payState === PayState.RequestFailed && (jsx(Button, { onClick: handleContactClick, children: "Contact Support" }))] })] }));
 };
 
 export { PayWithToken as default };