@b3dotfun/sdk 0.1.64 → 0.1.65-alpha.1

package/dist/esm/anyspend/react/components/AnySpend.js

@@ -18,6 +18,7 @@ import { useAutoSelectCryptoPaymentMethod } from "../hooks/useAutoSelectCryptoPa
 import { useConnectedWalletDisplay } from "../hooks/useConnectedWalletDisplay.js";
 import { useCryptoPaymentMethodState } from "../hooks/useCryptoPaymentMethodState.js";
 import { useDirectTransfer } from "../hooks/useDirectTransfer.js";
+import { useOnOrderSuccess } from "../hooks/useOnOrderSuccess.js";
 import { useRecipientAddressState } from "../hooks/useRecipientAddressState.js";
 import { AnySpendFingerprintWrapper, getFingerprintConfig } from "./AnySpendFingerprintWrapper.js";
 import { CryptoPaymentMethod, CryptoPaymentMethodType } from "./common/CryptoPaymentMethod.js";
@@ -65,8 +66,6 @@ function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationToke
     // Add refs to track URL state
     const initialUrlProcessed = useRef(false);
     const lastUrlUpdate = useRef(null);
-    // Track if onSuccess has been called for the current order
-    const onSuccessCalled = useRef(false);
     // Track animation direction for TransitionPanel
     const animationDirection = useRef(null);
     // Track previous panel for proper back navigation
@@ -486,18 +485,8 @@ function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationToke
             }
         }
     }, [anyspendQuote, isSrcInputDirty, destinationTokenAmount]);
-    useEffect(() => {
-        if (oat?.data?.order.status === "executed" && !onSuccessCalled.current) {
-            console.log("Calling onSuccess");
-            const txHash = oat?.data?.executeTx?.txHash;
-            onSuccess?.(txHash);
-            onSuccessCalled.current = true;
-        }
-    }, [oat?.data?.order.status, oat?.data?.executeTx?.txHash, onSuccess]);
-    // Reset flag when orderId changes
-    useEffect(() => {
-        onSuccessCalled.current = false;
-    }, [orderId]);
+    // Call onSuccess when order is executed
+    useOnOrderSuccess({ orderData: oat, orderId, onSuccess });
     const { createOrder, isCreatingOrder } = useAnyspendCreateOrder({
         onSuccess: data => {
             const orderId = data.data.id;

package/dist/esm/anyspend/react/components/AnySpendCustom.js

@@ -11,9 +11,10 @@ import { simpleHashChainToChainName } from "../../../shared/utils/simplehash.js"
 import invariant from "invariant";
 import { ChevronRight, ChevronRightCircle, Info, Loader2 } from "lucide-react";
 import { motion } from "motion/react";
-import React, { useCallback, useEffect, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import { base } from "viem/chains";
 import { useCryptoPaymentMethodState } from "../hooks/useCryptoPaymentMethodState.js";
+import { useOnOrderSuccess } from "../hooks/useOnOrderSuccess.js";
 import { useRecipientAddressState } from "../hooks/useRecipientAddressState.js";
 import { AnySpendFingerprintWrapper, getFingerprintConfig } from "./AnySpendFingerprintWrapper.js";
 import { CryptoPaymentMethod, CryptoPaymentMethodType } from "./common/CryptoPaymentMethod.js";
@@ -126,8 +127,6 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
         globalAddress: currentWallet.address,
     });
     const [orderId, setOrderId] = useState(loadOrder);
-    // Track if onSuccess has been called for the current order
-    const onSuccessCalled = React.useRef(false);
     const [srcChainId, setSrcChainId] = useState(base.id);
     // Get token list for token balance check
     const chainName = useMemo(() => simpleHashChainToChainName(srcChainId), [srcChainId]);
@@ -265,20 +264,8 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
     }, [activeTab, srcFiatAmountForGeoCheck]);
     // Get geo data and onramp options (use srcFiatAmountForGeoCheck to check availability regardless of activeTab)
     const { geoData, isOnrampSupported, coinbaseAvailablePaymentMethods, stripeOnrampSupport, stripeWeb2Support } = useGeoOnrampOptions(srcFiatAmountForGeoCheck);
-    useEffect(() => {
-        if (oat?.data?.order.status === "executed" && !onSuccessCalled.current) {
-            console.log("Calling onSuccess");
-            const relayTxs = oat?.data?.relayTxs;
-            const lastRelayTxHash = relayTxs?.[relayTxs.length - 1]?.txHash;
-            const txHash = oat?.data?.executeTx?.txHash || lastRelayTxHash;
-            onSuccess?.(txHash);
-            onSuccessCalled.current = true;
-        }
-    }, [oat?.data?.order.status, oat?.data?.executeTx?.txHash, oat?.data?.relayTxs, onSuccess]);
-    // Reset flag when orderId changes
-    useEffect(() => {
-        onSuccessCalled.current = false;
-    }, [orderId]);
+    // Call onSuccess when order is executed
+    useOnOrderSuccess({ orderData: oat, orderId, onSuccess });
     const { createOrder: createRegularOrder, isCreatingOrder: isCreatingRegularOrder } = useAnyspendCreateOrder({
         onSuccess: data => {
             setOrderId(data.data.id);

package/dist/esm/anyspend/react/components/QRDeposit.js

@@ -8,6 +8,7 @@ import { QRCodeSVG } from "qrcode.react";
 import { useEffect, useRef, useState } from "react";
 import { useAnyspendOrderAndTransactions } from "../hooks/useAnyspendOrderAndTransactions.js";
 import { useCreateDepositFirstOrder } from "../hooks/useCreateDepositFirstOrder.js";
+import { useOnOrderSuccess } from "../hooks/useOnOrderSuccess.js";
 import { useWatchTransfer } from "../hooks/useWatchTransfer.js";
 import { ChainTokenIcon } from "./common/ChainTokenIcon.js";
 import { OrderDetails } from "./common/OrderDetails.js";
@@ -43,7 +44,6 @@ export function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourc
     const [orderId, setOrderId] = useState();
     const [globalAddress, setGlobalAddress] = useState();
     const orderCreatedRef = useRef(false);
-    const onSuccessCalled = useRef(false);
     const [transferResult, setTransferResult] = useState(null);
     // Source token/chain as state (can be changed by user)
     const [sourceChainId, setSourceChainId] = useState(sourceChainIdProp ?? 8453);
@@ -125,17 +125,7 @@ export function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourc
         isPureTransfer,
     ]);
     // Call onSuccess when order is executed
-    useEffect(() => {
-        if (oat?.data?.order.status === "executed" && !onSuccessCalled.current) {
-            const txHash = oat?.data?.executeTx?.txHash;
-            onSuccess?.(txHash);
-            onSuccessCalled.current = true;
-        }
-    }, [oat?.data?.order.status, oat?.data?.executeTx?.txHash, onSuccess]);
-    // Reset onSuccess flag when orderId changes
-    useEffect(() => {
-        onSuccessCalled.current = false;
-    }, [orderId]);
+    useOnOrderSuccess({ orderData: oat, orderId, onSuccess });
     // For pure transfers, always use recipient address; for orders, use global address
     const displayAddress = isPureTransfer ? recipientAddress : globalAddress || recipientAddress;
     const handleCopyAddress = async () => {

package/dist/esm/anyspend/react/components/common/OrderDetails.js

@@ -450,7 +450,7 @@ export const OrderDetails = memo(function OrderDetails({ mode = "modal", order,
                                                 : `Waiting for deposit ${formattedDepositDeficit} ${srcToken.symbol}`, chainId: order.srcChain, tx: null, isProcessing: true, delay: 0.5 }))] }) })] }) }), depositTxs?.length > 0 && !depositEnoughAmount && order.status === "scanning_deposit_transaction" && (_jsx(InsufficientDepositPayment, { order: order, srcToken: srcToken, depositDeficit: depositDeficit, phantomWalletAddress: phantomWalletAddress, txLoading: txLoading, isSwitchingOrExecuting: isSwitchingOrExecuting, onPayment: handlePayment })), _jsxs("button", { className: classes?.backButton ||
                         "text-b3-primary-blue hover:text-b3-primary-blue/50 order-details-cancel-btn flex w-full items-center justify-center gap-2 underline", onClick: handleBack, children: [_jsx(RefreshCcw, { className: "ml-2 h-4 w-4" }), " Cancel and start over"] })] }));
     }
-    return (_jsxs(_Fragment, { children: [_jsx(OrderStatus, { order: order, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod }), statusDisplay === "processing" && (_jsx(_Fragment, { children: order.onrampMetadata ? (_jsx(PaymentVendorUI, { order: order, dstTokenSymbol: dstToken.symbol })) : effectiveCryptoPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET ||
+    return (_jsxs(_Fragment, { children: [_jsx(OrderStatus, { order: order, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod }), statusDisplay === "processing" && (_jsx(_Fragment, { children: order.onrampMetadata && order.onrampMetadata.vendor !== "none" ? (_jsx(PaymentVendorUI, { order: order, dstTokenSymbol: dstToken.symbol })) : effectiveCryptoPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET ||
                     effectiveCryptoPaymentMethod === CryptoPaymentMethodType.GLOBAL_WALLET ? (_jsx(ConnectWalletPayment, { order: order, onPayment: handlePayment, onCancel: handleBack, txLoading: txLoading, isSwitchingOrExecuting: isSwitchingOrExecuting, phantomWalletAddress: phantomWalletAddress, tournament: tournament, nft: nft, cryptoPaymentMethod: effectiveCryptoPaymentMethod, onPaymentMethodChange: onPaymentMethodChange })) : effectiveCryptoPaymentMethod === CryptoPaymentMethodType.TRANSFER_CRYPTO ? (
                 // Transfer Crypto Payment Method - Show new card-based UI
                 _jsx(TransferCryptoDetails, { order: order, recipientName: recipientName, srcToken: srcToken, dstToken: dstToken, tournament: tournament, nft: nft, onBack: handleBack, onPaymentMethodChange: onPaymentMethodChange })) : (_jsxs("div", { className: "order-details-payment-section relative flex w-full flex-1 flex-col", children: [_jsxs("div", { className: "order-details-amount-section flex flex-col gap-1", children: [_jsx("span", { className: "text-as-primary/50 order-details-amount-label", children: "Please send" }), _jsxs("div", { className: "order-details-amount-container flex w-full flex-wrap items-center gap-6 sm:justify-between sm:gap-0", children: [_jsx(CopyToClipboard, { text: roundedUpSrcAmount, onCopy: () => {

package/dist/esm/anyspend/react/hooks/index.d.ts

@@ -12,6 +12,7 @@ export * from "./useGasPrice";
 export * from "./useGeoOnrampOptions";
 export * from "./useGetGeo";
 export * from "./useHyperliquidTransfer";
+export * from "./useOnOrderSuccess";
 export * from "./useRecipientAddressState";
 export * from "./useSigMint";
 export * from "./useStripeClientSecret";

package/dist/esm/anyspend/react/hooks/index.js

@@ -12,6 +12,7 @@ export * from "./useGasPrice.js";
 export * from "./useGeoOnrampOptions.js";
 export * from "./useGetGeo.js";
 export * from "./useHyperliquidTransfer.js";
+export * from "./useOnOrderSuccess.js";
 export * from "./useRecipientAddressState.js";
 export * from "./useSigMint.js";
 export * from "./useStripeClientSecret.js";

package/dist/esm/anyspend/react/hooks/useOnOrderSuccess.d.ts

@@ -0,0 +1,10 @@
+import { GetOrderAndTxsResponse } from "../../types/api_req_res";
+/**
+ * Hook to call onSuccess callback when an order is executed.
+ * Handles fallback to relayTxs when executeTx is null.
+ */
+export declare function useOnOrderSuccess({ orderData, orderId, onSuccess, }: {
+    orderData: GetOrderAndTxsResponse | undefined;
+    orderId: string | undefined;
+    onSuccess?: (txHash?: string) => void;
+}): void;

package/dist/esm/anyspend/react/hooks/useOnOrderSuccess.js

@@ -0,0 +1,24 @@
+import { useEffect, useRef } from "react";
+/**
+ * Hook to call onSuccess callback when an order is executed.
+ * Handles fallback to relayTxs when executeTx is null.
+ */
+export function useOnOrderSuccess({ orderData, orderId, onSuccess, }) {
+    const onSuccessCalled = useRef(false);
+    const prevOrderId = useRef(orderId);
+    useEffect(() => {
+        // Reset flag when orderId changes
+        if (prevOrderId.current !== orderId) {
+            onSuccessCalled.current = false;
+            prevOrderId.current = orderId;
+        }
+        // Call onSuccess when order is executed
+        if (orderData?.data?.order.status === "executed" && !onSuccessCalled.current) {
+            const relayTxs = orderData?.data?.relayTxs;
+            const lastSuccessfulRelayTx = relayTxs?.filter(tx => tx.status === "success").pop();
+            const txHash = orderData?.data?.executeTx?.txHash || lastSuccessfulRelayTx?.txHash;
+            onSuccess?.(txHash);
+            onSuccessCalled.current = true;
+        }
+    }, [orderData, orderId, onSuccess]);
+}