@b3dotfun/sdk 0.0.64 → 0.0.65-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/anyspend/react/components/AnySpend.js +37 -23
- package/dist/cjs/anyspend/react/components/AnySpendCustom.js +22 -9
- package/dist/cjs/anyspend/react/components/AnySpendCustomExactIn.js +7 -11
- package/dist/cjs/anyspend/react/components/AnyspendDepositHype.js +1 -5
- package/dist/cjs/anyspend/react/components/common/CryptoPaymentMethod.js +0 -4
- package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.d.ts +5 -1
- package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.js +15 -9
- package/dist/cjs/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.d.ts +7 -5
- package/dist/cjs/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.js +13 -9
- package/dist/cjs/anyspend/react/hooks/useCryptoPaymentMethodState.d.ts +42 -0
- package/dist/cjs/anyspend/react/hooks/useCryptoPaymentMethodState.js +51 -0
- package/dist/cjs/anyspend/utils/index.d.ts +0 -1
- package/dist/cjs/anyspend/utils/index.js +0 -1
- package/dist/cjs/global-account/react/components/B3DynamicModal.js +4 -7
- package/dist/cjs/global-account/react/hooks/useAuthentication.js +0 -11
- package/dist/cjs/global-account/react/hooks/useGlobalAccount.d.ts +1 -0
- package/dist/cjs/global-account/react/hooks/useGlobalAccount.js +3 -0
- package/dist/esm/anyspend/react/components/AnySpend.js +37 -23
- package/dist/esm/anyspend/react/components/AnySpendCustom.js +22 -9
- package/dist/esm/anyspend/react/components/AnySpendCustomExactIn.js +8 -12
- package/dist/esm/anyspend/react/components/AnyspendDepositHype.js +2 -6
- package/dist/esm/anyspend/react/components/common/CryptoPaymentMethod.js +1 -5
- package/dist/esm/anyspend/react/hooks/useAnyspendFlow.d.ts +5 -1
- package/dist/esm/anyspend/react/hooks/useAnyspendFlow.js +15 -9
- package/dist/esm/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.d.ts +7 -5
- package/dist/esm/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.js +13 -9
- package/dist/esm/anyspend/react/hooks/useCryptoPaymentMethodState.d.ts +42 -0
- package/dist/esm/anyspend/react/hooks/useCryptoPaymentMethodState.js +48 -0
- package/dist/esm/anyspend/utils/index.d.ts +0 -1
- package/dist/esm/anyspend/utils/index.js +0 -1
- package/dist/esm/global-account/react/components/B3DynamicModal.js +5 -8
- package/dist/esm/global-account/react/hooks/useAuthentication.js +0 -11
- package/dist/esm/global-account/react/hooks/useGlobalAccount.d.ts +1 -0
- package/dist/esm/global-account/react/hooks/useGlobalAccount.js +3 -0
- package/dist/types/anyspend/react/hooks/useAnyspendFlow.d.ts +5 -1
- package/dist/types/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.d.ts +7 -5
- package/dist/types/anyspend/react/hooks/useCryptoPaymentMethodState.d.ts +42 -0
- package/dist/types/anyspend/utils/index.d.ts +0 -1
- package/dist/types/global-account/react/hooks/useGlobalAccount.d.ts +1 -0
- package/package.json +1 -1
- package/src/anyspend/react/components/AnySpend.tsx +49 -28
- package/src/anyspend/react/components/AnySpendCustom.tsx +28 -15
- package/src/anyspend/react/components/AnySpendCustomExactIn.tsx +9 -12
- package/src/anyspend/react/components/AnyspendDepositHype.tsx +2 -6
- package/src/anyspend/react/components/common/CryptoPaymentMethod.tsx +1 -6
- package/src/anyspend/react/hooks/useAnyspendFlow.ts +23 -11
- package/src/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.ts +20 -12
- package/src/anyspend/react/hooks/useCryptoPaymentMethodState.ts +71 -0
- package/src/anyspend/utils/index.ts +0 -1
- package/src/global-account/react/components/B3DynamicModal.tsx +5 -9
- package/src/global-account/react/hooks/useAuthentication.ts +0 -12
- package/src/global-account/react/hooks/useGlobalAccount.tsx +3 -1
- package/dist/cjs/anyspend/utils/accountStore.d.ts +0 -7
- package/dist/cjs/anyspend/utils/accountStore.js +0 -8
- package/dist/esm/anyspend/utils/accountStore.d.ts +0 -7
- package/dist/esm/anyspend/utils/accountStore.js +0 -5
- package/dist/types/anyspend/utils/accountStore.d.ts +0 -7
- package/src/anyspend/utils/accountStore.ts +0 -12
|
@@ -21,6 +21,7 @@ const viem_1 = require("viem");
|
|
|
21
21
|
const chains_1 = require("viem/chains");
|
|
22
22
|
const useAutoSelectCryptoPaymentMethod_1 = require("../hooks/useAutoSelectCryptoPaymentMethod");
|
|
23
23
|
const useAutoSetActiveWalletFromWagmi_1 = require("../hooks/useAutoSetActiveWalletFromWagmi");
|
|
24
|
+
const useCryptoPaymentMethodState_1 = require("../hooks/useCryptoPaymentMethodState");
|
|
24
25
|
const AnySpendFingerprintWrapper_1 = require("./AnySpendFingerprintWrapper");
|
|
25
26
|
const CryptoPaymentMethod_1 = require("./common/CryptoPaymentMethod");
|
|
26
27
|
const CryptoPaySection_1 = require("./common/CryptoPaySection");
|
|
@@ -84,9 +85,8 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
84
85
|
setActivePanel(targetPanel);
|
|
85
86
|
}, [activePanel]);
|
|
86
87
|
const [customRecipients, setCustomRecipients] = (0, react_4.useState)([]);
|
|
87
|
-
//
|
|
88
|
-
const
|
|
89
|
-
// Add state for selected fiat payment method
|
|
88
|
+
// Payment method state with dual-state system (auto + explicit user selection)
|
|
89
|
+
const { cryptoPaymentMethod, setCryptoPaymentMethod, selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, effectiveCryptoPaymentMethod, resetPaymentMethods, } = (0, useCryptoPaymentMethodState_1.useCryptoPaymentMethodState)();
|
|
90
90
|
const [selectedFiatPaymentMethod, setSelectedFiatPaymentMethod] = (0, react_4.useState)(FiatPaymentMethod_1.FiatPaymentMethod.NONE);
|
|
91
91
|
// const [newRecipientAddress, setNewRecipientAddress] = useState("");
|
|
92
92
|
// const recipientInputRef = useRef<HTMLInputElement>(null);
|
|
@@ -338,8 +338,9 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
338
338
|
// Auto-select crypto payment method based on available wallets and balance
|
|
339
339
|
(0, useAutoSelectCryptoPaymentMethod_1.useAutoSelectCryptoPaymentMethod)({
|
|
340
340
|
paymentType: activeTab,
|
|
341
|
+
cryptoPaymentMethod,
|
|
342
|
+
setCryptoPaymentMethod,
|
|
341
343
|
selectedCryptoPaymentMethod,
|
|
342
|
-
setSelectedCryptoPaymentMethod,
|
|
343
344
|
hasEnoughBalance,
|
|
344
345
|
isBalanceLoading,
|
|
345
346
|
});
|
|
@@ -460,9 +461,9 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
460
461
|
// Add orderId and payment method to URL for persistence
|
|
461
462
|
const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
|
|
462
463
|
params.set("orderId", orderId);
|
|
463
|
-
if (
|
|
464
|
-
console.log("Setting cryptoPaymentMethod in URL:",
|
|
465
|
-
params.set("cryptoPaymentMethod",
|
|
464
|
+
if (effectiveCryptoPaymentMethod !== CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE) {
|
|
465
|
+
console.log("Setting cryptoPaymentMethod in URL:", effectiveCryptoPaymentMethod);
|
|
466
|
+
params.set("cryptoPaymentMethod", effectiveCryptoPaymentMethod);
|
|
466
467
|
}
|
|
467
468
|
else {
|
|
468
469
|
console.log("Payment method is NONE, not setting in URL");
|
|
@@ -524,18 +525,18 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
524
525
|
if (activeTab === "crypto") {
|
|
525
526
|
// For crypto: check payment method first, then recipient
|
|
526
527
|
// If no payment method selected, show "Choose payment method"
|
|
527
|
-
if (
|
|
528
|
+
if (effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE) {
|
|
528
529
|
return { text: "Choose payment method", disable: false, error: false, loading: false };
|
|
529
530
|
}
|
|
530
531
|
// Check recipient after payment method
|
|
531
532
|
if (!recipientAddress)
|
|
532
533
|
return { text: "Select recipient", disable: false, error: false, loading: false };
|
|
533
534
|
// If payment method selected, show appropriate action
|
|
534
|
-
if (
|
|
535
|
-
|
|
535
|
+
if (effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.CONNECT_WALLET ||
|
|
536
|
+
effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.GLOBAL_WALLET) {
|
|
536
537
|
return { text: "Swap", disable: false, error: false, loading: false };
|
|
537
538
|
}
|
|
538
|
-
if (
|
|
539
|
+
if (effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.TRANSFER_CRYPTO) {
|
|
539
540
|
return { text: "Continue to payment", disable: false, error: false, loading: false };
|
|
540
541
|
}
|
|
541
542
|
}
|
|
@@ -549,7 +550,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
549
550
|
isCreatingOnrampOrder,
|
|
550
551
|
anyspendQuote,
|
|
551
552
|
activeTab,
|
|
552
|
-
|
|
553
|
+
effectiveCryptoPaymentMethod,
|
|
553
554
|
selectedFiatPaymentMethod,
|
|
554
555
|
]);
|
|
555
556
|
// Handle main button click
|
|
@@ -577,7 +578,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
577
578
|
if (activeTab === "crypto") {
|
|
578
579
|
// For crypto: check payment method first, then recipient
|
|
579
580
|
// If no payment method selected, show payment method selection
|
|
580
|
-
if (
|
|
581
|
+
if (effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE) {
|
|
581
582
|
console.log("No payment method selected, showing selection panel");
|
|
582
583
|
navigateToPanel(PanelView.CRYPTO_PAYMENT_METHOD, "forward");
|
|
583
584
|
return;
|
|
@@ -589,11 +590,11 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
589
590
|
}
|
|
590
591
|
(0, invariant_1.default)(recipientAddress, "Recipient address is not found");
|
|
591
592
|
// If payment method is selected, create order with payment method info
|
|
592
|
-
if (
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
console.log("Creating crypto order with payment method:",
|
|
596
|
-
await handleCryptoSwap(
|
|
593
|
+
if (effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.CONNECT_WALLET ||
|
|
594
|
+
effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.GLOBAL_WALLET ||
|
|
595
|
+
effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.TRANSFER_CRYPTO) {
|
|
596
|
+
console.log("Creating crypto order with payment method:", effectiveCryptoPaymentMethod);
|
|
597
|
+
await handleCryptoSwap(effectiveCryptoPaymentMethod);
|
|
597
598
|
return;
|
|
598
599
|
}
|
|
599
600
|
}
|
|
@@ -767,12 +768,21 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
767
768
|
};
|
|
768
769
|
}, [activePanel, navigateBack]);
|
|
769
770
|
const historyView = ((0, jsx_runtime_1.jsx)("div", { className: "mx-auto flex w-[560px] max-w-full flex-col items-center", children: (0, jsx_runtime_1.jsx)(OrderHistory_1.OrderHistory, { mode: mode, onBack: navigateBack, onSelectOrder: onSelectOrder }) }));
|
|
770
|
-
const orderDetailsView = ((0, jsx_runtime_1.jsx)("div", { className: "mx-auto w-[460px] max-w-full", children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex flex-col gap-4", children: oat && ((0, jsx_runtime_1.jsx)(OrderDetails_1.OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, selectedCryptoPaymentMethod:
|
|
771
|
+
const orderDetailsView = ((0, jsx_runtime_1.jsx)("div", { className: "mx-auto w-[460px] max-w-full", children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex flex-col gap-4", children: oat && ((0, jsx_runtime_1.jsx)(OrderDetails_1.OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onPaymentMethodChange: method => {
|
|
772
|
+
// When user explicitly changes payment method, set it as selected
|
|
773
|
+
setSelectedCryptoPaymentMethod(method);
|
|
774
|
+
}, points: oat.data.points || undefined, onBack: () => {
|
|
771
775
|
setOrderId(undefined);
|
|
772
776
|
navigateBack();
|
|
773
|
-
|
|
777
|
+
// Reset payment methods when going back
|
|
778
|
+
resetPaymentMethods();
|
|
774
779
|
} })) }) }));
|
|
775
|
-
const mainView = ((0, jsx_runtime_1.jsxs)("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [isBuyMode && ((0, jsx_runtime_1.jsxs)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: [selectedDstToken.metadata?.logoURI && ((0, jsx_runtime_1.jsx)("div", { className: "relative", children: (0, jsx_runtime_1.jsx)("img", { src: selectedDstToken.metadata.logoURI, alt: selectedDstToken.symbol, className: "border-as-stroke h-12 w-12 rounded-full border-2 shadow-md" }) })), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("h1", { className: "text-as-primary text-xl font-bold", children: ["Buy ", selectedDstToken.symbol] }) })] })), (0, jsx_runtime_1.jsx)(TabSection_1.TabSection, { activeTab: activeTab, setActiveTab:
|
|
780
|
+
const mainView = ((0, jsx_runtime_1.jsxs)("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [isBuyMode && ((0, jsx_runtime_1.jsxs)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: [selectedDstToken.metadata?.logoURI && ((0, jsx_runtime_1.jsx)("div", { className: "relative", children: (0, jsx_runtime_1.jsx)("img", { src: selectedDstToken.metadata.logoURI, alt: selectedDstToken.symbol, className: "border-as-stroke h-12 w-12 rounded-full border-2 shadow-md" }) })), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("h1", { className: "text-as-primary text-xl font-bold", children: ["Buy ", selectedDstToken.symbol] }) })] })), (0, jsx_runtime_1.jsx)(TabSection_1.TabSection, { activeTab: activeTab, setActiveTab: tab => {
|
|
781
|
+
setActiveTab(tab);
|
|
782
|
+
// Reset payment methods when switching tabs
|
|
783
|
+
resetPaymentMethods();
|
|
784
|
+
setSelectedFiatPaymentMethod(FiatPaymentMethod_1.FiatPaymentMethod.NONE);
|
|
785
|
+
}, setSelectedCryptoPaymentMethod: setSelectedCryptoPaymentMethod, setSelectedFiatPaymentMethod: setSelectedFiatPaymentMethod }), (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [activeTab === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => navigateToPanel(PanelView.CRYPTO_PAYMENT_METHOD, "forward"), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect, onShowFeeDetail: () => navigateToPanel(PanelView.FEE_DETAIL, "forward") })) : ((0, jsx_runtime_1.jsx)(react_3.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: (0, jsx_runtime_1.jsx)(PanelOnramp_1.PanelOnramp, { srcAmountOnRamp: srcAmountOnRamp, setSrcAmountOnRamp: setSrcAmountOnRamp, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: (panelIndex) => {
|
|
776
786
|
// Map panel index to navigation with direction
|
|
777
787
|
const panelsWithForwardNav = [PanelView.FIAT_PAYMENT_METHOD, PanelView.RECIPIENT_SELECTION];
|
|
778
788
|
if (panelsWithForwardNav.includes(panelIndex)) {
|
|
@@ -803,7 +813,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
803
813
|
}, children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex items-center justify-center transition-opacity", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }), activeTab === "crypto" && ((0, jsx_runtime_1.jsx)(CryptoReceiveSection_1.CryptoReceiveSection, { isDepositMode: false, isBuyMode: isBuyMode, selectedRecipientAddress: recipientAddress, recipientName: recipientName || undefined, onSelectRecipient: () => navigateToPanel(PanelView.RECIPIENT_SELECTION, "forward"), setRecipientAddress: setRecipientAddress, recipientAddressFromProps: recipientAddressFromProps, globalAddress: globalAddress, dstAmount: dstAmount, dstToken: selectedDstToken, selectedDstChainId: selectedDstChainId, setSelectedDstChainId: setSelectedDstChainId, setSelectedDstToken: setSelectedDstToken, isSrcInputDirty: isSrcInputDirty, onChangeDstAmount: value => {
|
|
804
814
|
setIsSrcInputDirty(false);
|
|
805
815
|
setDstAmount(value);
|
|
806
|
-
}, anyspendQuote: anyspendQuote, onShowPointsDetail: () => navigateToPanel(PanelView.POINTS_DETAIL, "forward"), onShowFeeDetail: () => navigateToPanel(PanelView.FEE_DETAIL, "forward"), selectedCryptoPaymentMethod:
|
|
816
|
+
}, anyspendQuote: anyspendQuote, onShowPointsDetail: () => navigateToPanel(PanelView.POINTS_DETAIL, "forward"), onShowFeeDetail: () => navigateToPanel(PanelView.FEE_DETAIL, "forward"), selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod }))] }), (0, jsx_runtime_1.jsxs)(react_3.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: (0, cn_1.cn)("mt-4 flex w-full max-w-[460px] flex-col gap-2"), children: [(0, jsx_runtime_1.jsx)(react_2.ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: (0, cn_1.cn)("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: (0, cn_1.cn)(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-center gap-2", children: [btnInfo.loading && (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-4 w-4 animate-spin" }), btnInfo.text] }) }), !hideTransactionHistoryButton && (globalAddress || recipientAddress) ? ((0, jsx_runtime_1.jsxs)(react_2.Button, { variant: "link", onClick: onClickHistory, className: "text-as-primary/50 hover:text-as-primary flex items-center gap-1 transition-colors", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.HistoryIcon, { className: "h-4 w-4" }), " ", (0, jsx_runtime_1.jsx)("span", { className: "pr-4", children: "Transaction History" })] })) : null] })] }));
|
|
807
817
|
const onrampPaymentView = ((0, jsx_runtime_1.jsx)(PanelOnrampPayment_1.PanelOnrampPayment, { srcAmountOnRamp: srcAmountOnRamp, recipientName: recipientName || undefined, recipientAddress: recipientAddress, isBuyMode: isBuyMode, destinationTokenChainId: destinationTokenChainId, destinationTokenAddress: destinationTokenAddress, selectedDstChainId: selectedDstChainId, selectedDstToken: selectedDstToken, orderType: "swap", anyspendQuote: anyspendQuote, globalAddress: globalAddress, onOrderCreated: orderId => {
|
|
808
818
|
setOrderId(orderId);
|
|
809
819
|
navigateToPanel(PanelView.ORDER_DETAILS, "forward");
|
|
@@ -823,7 +833,11 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
823
833
|
setRecipientAddress(address);
|
|
824
834
|
navigateBack();
|
|
825
835
|
} }));
|
|
826
|
-
const cryptoPaymentMethodView = ((0, jsx_runtime_1.jsx)(CryptoPaymentMethod_1.CryptoPaymentMethod, { globalAddress: globalAddress, globalWallet: globalWallet, selectedPaymentMethod:
|
|
836
|
+
const cryptoPaymentMethodView = ((0, jsx_runtime_1.jsx)(CryptoPaymentMethod_1.CryptoPaymentMethod, { globalAddress: globalAddress, globalWallet: globalWallet, selectedPaymentMethod: effectiveCryptoPaymentMethod, setSelectedPaymentMethod: method => {
|
|
837
|
+
// When user explicitly selects a payment method, save it
|
|
838
|
+
setSelectedCryptoPaymentMethod(method);
|
|
839
|
+
}, isCreatingOrder: isCreatingOrder, onBack: navigateBack, onSelectPaymentMethod: (method) => {
|
|
840
|
+
// When user explicitly selects a payment method, save it and go back
|
|
827
841
|
setSelectedCryptoPaymentMethod(method);
|
|
828
842
|
navigateBack();
|
|
829
843
|
} }));
|
|
@@ -54,6 +54,7 @@ const sonner_1 = require("sonner");
|
|
|
54
54
|
const chains_1 = require("viem/chains");
|
|
55
55
|
const FeatureFlagsContext_1 = require("../contexts/FeatureFlagsContext");
|
|
56
56
|
const useAutoSetActiveWalletFromWagmi_1 = require("../hooks/useAutoSetActiveWalletFromWagmi");
|
|
57
|
+
const useCryptoPaymentMethodState_1 = require("../hooks/useCryptoPaymentMethodState");
|
|
57
58
|
const AnySpendFingerprintWrapper_1 = require("./AnySpendFingerprintWrapper");
|
|
58
59
|
const CryptoPaymentMethod_1 = require("./common/CryptoPaymentMethod");
|
|
59
60
|
const FeeBreakDown_1 = require("./common/FeeBreakDown");
|
|
@@ -154,8 +155,9 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
|
|
|
154
155
|
(0, useAutoSetActiveWalletFromWagmi_1.useAutoSetActiveWalletFromWagmi)();
|
|
155
156
|
const [activePanel, setActivePanel] = (0, react_4.useState)(loadOrder ? PanelView.ORDER_DETAILS : PanelView.CONFIRM_ORDER);
|
|
156
157
|
const [activeTab, setActiveTab] = (0, react_4.useState)(activeTabProps);
|
|
157
|
-
//
|
|
158
|
-
|
|
158
|
+
// Payment method state with dual-state system (auto + explicit user selection)
|
|
159
|
+
// Note: AnySpendCustom doesn't use auto-selection, only explicit user selection
|
|
160
|
+
const { setSelectedCryptoPaymentMethod, effectiveCryptoPaymentMethod, resetPaymentMethods } = (0, useCryptoPaymentMethodState_1.useCryptoPaymentMethodState)();
|
|
159
161
|
const [selectedFiatPaymentMethod, setSelectedFiatPaymentMethod] = (0, react_4.useState)(FiatPaymentMethod_1.FiatPaymentMethod.NONE);
|
|
160
162
|
// Get current user's wallet
|
|
161
163
|
const currentWallet = (0, react_2.useAccountWallet)();
|
|
@@ -404,7 +406,7 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
|
|
|
404
406
|
return;
|
|
405
407
|
}
|
|
406
408
|
// Check payment method selection for crypto tab
|
|
407
|
-
if (activeTab === "crypto" &&
|
|
409
|
+
if (activeTab === "crypto" && effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE) {
|
|
408
410
|
setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD);
|
|
409
411
|
return;
|
|
410
412
|
}
|
|
@@ -479,9 +481,14 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
|
|
|
479
481
|
const historyView = ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("mx-auto flex w-full max-w-2xl flex-col items-center p-5", mode === "modal" && "bg-b3-react-background"), children: (0, jsx_runtime_1.jsx)(OrderHistory_1.OrderHistory, { mode: mode, onBack: () => {
|
|
480
482
|
setActivePanel(PanelView.HISTORY);
|
|
481
483
|
}, onSelectOrder: onSelectOrder }) }));
|
|
482
|
-
const orderDetailsView = ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("mx-auto flex w-full flex-col items-center gap-4 p-5", mode === "modal" && "bg-b3-react-background rounded-xl"), children: [oat && ((0, jsx_runtime_1.jsx)(OrderDetails_1.OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, cryptoPaymentMethod: activeTab === "fiat" ? CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE :
|
|
484
|
+
const orderDetailsView = ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("mx-auto flex w-full flex-col items-center gap-4 p-5", mode === "modal" && "bg-b3-react-background rounded-xl"), children: [oat && ((0, jsx_runtime_1.jsx)(OrderDetails_1.OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, cryptoPaymentMethod: activeTab === "fiat" ? CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE : effectiveCryptoPaymentMethod, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onPaymentMethodChange: method => {
|
|
485
|
+
// When user explicitly changes payment method, set it as selected
|
|
486
|
+
setSelectedCryptoPaymentMethod(method);
|
|
487
|
+
}, onBack: () => {
|
|
483
488
|
setOrderId(undefined);
|
|
484
489
|
setActivePanel(PanelView.CONFIRM_ORDER);
|
|
490
|
+
// Reset payment methods when going back
|
|
491
|
+
resetPaymentMethods();
|
|
485
492
|
// Remove orderId from URL when canceling
|
|
486
493
|
const params = new URLSearchParams(searchParams.toString());
|
|
487
494
|
params.delete("orderId");
|
|
@@ -501,17 +508,19 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
|
|
|
501
508
|
// Confirm order view.
|
|
502
509
|
const confirmOrderView = ((0, jsx_runtime_1.jsxs)("div", { className: "relative mx-auto flex w-full flex-col items-center", children: [header({ anyspendPrice: anyspendQuote, isLoadingAnyspendPrice: isLoadingAnyspendQuote }), (0, jsx_runtime_1.jsxs)(react_2.Tabs, { value: activeTab, onValueChange: value => setActiveTab(value), className: "bg-b3-react-background max-h-[60dvh] w-full overflow-y-auto p-5", children: [(0, jsx_runtime_1.jsx)("div", { className: "w-full", children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-as-surface-secondary relative mb-4 grid h-10 grid-cols-2 rounded-xl", children: [(0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("bg-as-brand absolute bottom-0 left-0 top-0 z-0 rounded-xl transition-transform duration-100", "h-full w-1/2", activeTab === "fiat" ? "translate-x-full" : "translate-x-0"), style: { willChange: "transform" } }), (0, jsx_runtime_1.jsx)("button", { className: (0, utils_1.cn)("relative z-10 h-full w-full rounded-xl px-3 text-sm font-medium transition-colors duration-100", activeTab === "crypto" ? "text-white" : "text-as-primary/70 hover:bg-as-on-surface-2 bg-transparent"), onClick: () => {
|
|
503
510
|
setActiveTab("crypto");
|
|
504
|
-
|
|
511
|
+
// Reset payment methods when switching tabs
|
|
512
|
+
resetPaymentMethods();
|
|
505
513
|
setSelectedFiatPaymentMethod(FiatPaymentMethod_1.FiatPaymentMethod.NONE);
|
|
506
514
|
}, children: "Pay with crypto" }), isOnrampSupported ? ((0, jsx_runtime_1.jsx)("button", { className: (0, utils_1.cn)("relative z-10 h-full w-full rounded-xl px-3 text-sm font-medium transition-colors duration-100", activeTab === "fiat" ? "text-white" : "text-as-primary/70 hover:bg-as-on-surface-2 bg-transparent"), onClick: () => {
|
|
507
515
|
setActiveTab("fiat");
|
|
508
|
-
|
|
516
|
+
// Reset payment methods when switching tabs
|
|
517
|
+
resetPaymentMethods();
|
|
509
518
|
setSelectedFiatPaymentMethod(FiatPaymentMethod_1.FiatPaymentMethod.NONE);
|
|
510
519
|
}, children: "Pay with fiat" })) : ((0, jsx_runtime_1.jsxs)(react_2.Tooltip, { children: [(0, jsx_runtime_1.jsx)(react_2.TooltipTrigger, { asChild: true, children: (0, jsx_runtime_1.jsx)("button", { className: (0, utils_1.cn)("relative z-10 h-full w-full rounded-xl px-3 text-sm font-medium transition-colors duration-100", "text-as-primary/50 cursor-not-allowed bg-transparent"), disabled: true, children: "Pay with fiat" }) }), (0, jsx_runtime_1.jsx)(react_2.TooltipContent, { children: (0, jsx_runtime_1.jsx)("span", { className: "text-as-primary w-[140px]", children: "Fiat payments are not supported for this amount" }) })] }))] }) }), (0, jsx_runtime_1.jsx)(react_2.TabsContent, { value: "crypto", children: (0, jsx_runtime_1.jsxs)("div", { className: "mt-2 flex flex-col gap-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "border-as-border-secondary bg-as-surface-secondary flex w-full flex-col gap-4 rounded-xl border p-4", children: [(0, jsx_runtime_1.jsxs)(react_3.motion.div, { initial: false, animate: {
|
|
511
520
|
opacity: hasMounted ? 1 : 0,
|
|
512
521
|
y: hasMounted ? 0 : 20,
|
|
513
522
|
filter: hasMounted ? "blur(0px)" : "blur(10px)",
|
|
514
|
-
}, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, className: "relative flex w-full items-center justify-between", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-tertiarry flex h-7 items-center text-sm", children: "Pay" }), (0, jsx_runtime_1.jsx)("button", { className: "text-as-tertiarry flex h-7 items-center gap-2 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), children:
|
|
523
|
+
}, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, className: "relative flex w-full items-center justify-between", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-tertiarry flex h-7 items-center text-sm", children: "Pay" }), (0, jsx_runtime_1.jsx)("button", { className: "text-as-tertiarry flex h-7 items-center gap-2 text-sm transition-colors hover:text-blue-700", onClick: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), children: effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.CONNECT_WALLET ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [connectedAddress ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)("span", { className: "text-as-tertiarry flex items-center gap-1", children: connectedName ? (0, utils_1.formatUsername)(connectedName) : (0, formatAddress_1.shortenAddress)(connectedAddress || "") }) })) : ("Connect wallet"), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] })) : effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.TRANSFER_CRYPTO ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Transfer crypto", (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Select payment method", (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] })) })] }), (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), recipientSection, (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-4", children: [(0, jsx_runtime_1.jsxs)(react_3.motion.div, { initial: false, animate: {
|
|
515
524
|
opacity: hasMounted ? 1 : 0,
|
|
516
525
|
y: hasMounted ? 0 : 20,
|
|
517
526
|
filter: hasMounted ? "blur(0px)" : "blur(10px)",
|
|
@@ -527,7 +536,7 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
|
|
|
527
536
|
opacity: hasMounted ? 1 : 0,
|
|
528
537
|
y: hasMounted ? 0 : 20,
|
|
529
538
|
filter: hasMounted ? "blur(0px)" : "blur(10px)",
|
|
530
|
-
}, transition: { duration: 0.3, delay: 0.3, ease: "easeInOut" }, className: "flex w-full flex-col gap-2", children: (0, jsx_runtime_1.jsx)(react_2.ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", disabled: isCreatingOrder || isLoadingAnyspendQuote || !anyspendQuote, onClick: () => handleConfirmOrder(), className: "relative w-full", children: isCreatingOrder ? ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "size-4 animate-spin" }), (0, jsx_runtime_1.jsx)("span", { children: "Creating order..." })] })) : isLoadingAnyspendQuote ? ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "size-4 animate-spin" }), (0, jsx_runtime_1.jsx)("span", { children: "Loading quote..." })] })) : !recipientAddress ? ("Select recipient") :
|
|
539
|
+
}, transition: { duration: 0.3, delay: 0.3, ease: "easeInOut" }, className: "flex w-full flex-col gap-2", children: (0, jsx_runtime_1.jsx)(react_2.ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", disabled: isCreatingOrder || isLoadingAnyspendQuote || !anyspendQuote, onClick: () => handleConfirmOrder(), className: "relative w-full", children: isCreatingOrder ? ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "size-4 animate-spin" }), (0, jsx_runtime_1.jsx)("span", { children: "Creating order..." })] })) : isLoadingAnyspendQuote ? ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "size-4 animate-spin" }), (0, jsx_runtime_1.jsx)("span", { children: "Loading quote..." })] })) : !recipientAddress ? ("Select recipient") : effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE ? ("Choose payment method") : anyspendQuote ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: "Checkout" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRightCircle, { className: "absolute right-0 top-1/2 size-6 -translate-y-1/2 opacity-70" })] })) : ("No quote found") }) }) })] }) }), (0, jsx_runtime_1.jsx)(react_2.TabsContent, { value: "fiat", children: (0, jsx_runtime_1.jsxs)("div", { className: "mt-2 flex flex-col gap-6", children: [(0, jsx_runtime_1.jsxs)("div", { className: "border-as-border-secondary bg-as-surface-secondary flex w-full flex-col gap-4 rounded-xl border p-4", children: [(0, jsx_runtime_1.jsxs)(react_3.motion.div, { initial: false, animate: {
|
|
531
540
|
opacity: hasMounted ? 1 : 0,
|
|
532
541
|
y: hasMounted ? 0 : 20,
|
|
533
542
|
filter: hasMounted ? "blur(0px)" : "blur(10px)",
|
|
@@ -554,7 +563,11 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
|
|
|
554
563
|
setActivePanel(PanelView.CONFIRM_ORDER);
|
|
555
564
|
} }) }));
|
|
556
565
|
// Crypto payment method view
|
|
557
|
-
const cryptoPaymentMethodView = ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("bg-as-surface-primary mx-auto w-[460px] max-w-full rounded-xl p-4"), children: (0, jsx_runtime_1.jsx)(CryptoPaymentMethod_1.CryptoPaymentMethod, { globalAddress: currentWallet?.wallet?.address, globalWallet: currentWallet?.wallet, selectedPaymentMethod:
|
|
566
|
+
const cryptoPaymentMethodView = ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("bg-as-surface-primary mx-auto w-[460px] max-w-full rounded-xl p-4"), children: (0, jsx_runtime_1.jsx)(CryptoPaymentMethod_1.CryptoPaymentMethod, { globalAddress: currentWallet?.wallet?.address, globalWallet: currentWallet?.wallet, selectedPaymentMethod: effectiveCryptoPaymentMethod, setSelectedPaymentMethod: method => {
|
|
567
|
+
// When user explicitly selects a payment method, save it
|
|
568
|
+
setSelectedCryptoPaymentMethod(method);
|
|
569
|
+
}, isCreatingOrder: isCreatingOrder, onBack: () => setActivePanel(PanelView.CONFIRM_ORDER), onSelectPaymentMethod: (method) => {
|
|
570
|
+
// When user explicitly selects a payment method, save it and go back
|
|
558
571
|
setSelectedCryptoPaymentMethod(method);
|
|
559
572
|
setActivePanel(PanelView.CONFIRM_ORDER);
|
|
560
573
|
} }) }));
|
|
@@ -14,7 +14,6 @@ const react_2 = require("motion/react");
|
|
|
14
14
|
const react_3 = require("react");
|
|
15
15
|
const sonner_1 = require("sonner");
|
|
16
16
|
const react_4 = require("thirdweb/react");
|
|
17
|
-
const utils_2 = require("../../utils");
|
|
18
17
|
const useAnyspendFlow_1 = require("../hooks/useAnyspendFlow");
|
|
19
18
|
const AnySpendFingerprintWrapper_1 = require("./AnySpendFingerprintWrapper");
|
|
20
19
|
const CryptoPaySection_1 = require("./common/CryptoPaySection");
|
|
@@ -37,7 +36,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
37
36
|
SYMBOL: destinationToken.symbol ?? "TOKEN",
|
|
38
37
|
LOGO_URI: destinationToken.metadata?.logoURI ?? "",
|
|
39
38
|
};
|
|
40
|
-
const { activePanel, setActivePanel, orderId, setOrderId, oat, selectedSrcChainId, setSelectedSrcChainId, selectedSrcToken, setSelectedSrcToken, selectedDstToken, selectedDstChainId, srcAmount, setSrcAmount, dstAmount, isSrcInputDirty, setIsSrcInputDirty, selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, selectedFiatPaymentMethod, setSelectedFiatPaymentMethod, selectedRecipientAddress, setSelectedRecipientAddress, recipientName, globalAddress, hasEnoughBalance, isBalanceLoading, anyspendQuote, isLoadingAnyspendQuote, activeInputAmountInWei, geoData, coinbaseAvailablePaymentMethods, stripeWeb2Support, createOrder, isCreatingOrder, createOnrampOrder, isCreatingOnrampOrder, } = (0, useAnyspendFlow_1.useAnyspendFlow)({
|
|
39
|
+
const { activePanel, setActivePanel, orderId, setOrderId, oat, selectedSrcChainId, setSelectedSrcChainId, selectedSrcToken, setSelectedSrcToken, selectedDstToken, selectedDstChainId, srcAmount, setSrcAmount, dstAmount, isSrcInputDirty, setIsSrcInputDirty, selectedCryptoPaymentMethod, effectiveCryptoPaymentMethod, setSelectedCryptoPaymentMethod, selectedFiatPaymentMethod, setSelectedFiatPaymentMethod, selectedRecipientAddress, setSelectedRecipientAddress, recipientName, globalAddress, hasEnoughBalance, isBalanceLoading, anyspendQuote, isLoadingAnyspendQuote, activeInputAmountInWei, geoData, coinbaseAvailablePaymentMethods, stripeWeb2Support, createOrder, isCreatingOrder, createOnrampOrder, isCreatingOnrampOrder, } = (0, useAnyspendFlow_1.useAnyspendFlow)({
|
|
41
40
|
paymentType,
|
|
42
41
|
recipientAddress,
|
|
43
42
|
loadOrder,
|
|
@@ -53,18 +52,15 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
53
52
|
});
|
|
54
53
|
const { connectedEOAWallet } = (0, react_1.useAccountWallet)();
|
|
55
54
|
const setActiveWallet = (0, react_4.useSetActiveWallet)();
|
|
56
|
-
const activeWallet = (0, react_4.useActiveWallet)();
|
|
57
|
-
const setGlobalAccountWallet = (0, utils_2.useGlobalWalletState)(state => state.setGlobalAccountWallet);
|
|
58
55
|
const appliedPreferEoa = (0, react_3.useRef)(false);
|
|
59
56
|
(0, react_3.useEffect)(() => {
|
|
60
57
|
if (preferEoa && !appliedPreferEoa.current) {
|
|
61
58
|
if (connectedEOAWallet) {
|
|
62
59
|
appliedPreferEoa.current = true;
|
|
63
|
-
setGlobalAccountWallet(activeWallet);
|
|
64
60
|
setActiveWallet(connectedEOAWallet);
|
|
65
61
|
}
|
|
66
62
|
}
|
|
67
|
-
}, [preferEoa, connectedEOAWallet, setActiveWallet
|
|
63
|
+
}, [preferEoa, connectedEOAWallet, setActiveWallet]);
|
|
68
64
|
const selectedRecipientOrDefault = selectedRecipientAddress ?? recipientAddress;
|
|
69
65
|
const expectedDstAmountRaw = anyspendQuote?.data?.currencyOut?.amount ?? "0";
|
|
70
66
|
const buildCustomPayload = (_recipient) => {
|
|
@@ -93,12 +89,12 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
93
89
|
if (!anyspendQuote || !anyspendQuote.success)
|
|
94
90
|
return { text: "Get quote error", disable: true, error: true, loading: false };
|
|
95
91
|
if (paymentType === "crypto") {
|
|
96
|
-
if (
|
|
92
|
+
if (effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE) {
|
|
97
93
|
return { text: "Choose payment method", disable: false, error: false, loading: false };
|
|
98
94
|
}
|
|
99
95
|
if (!hasEnoughBalance &&
|
|
100
96
|
!isBalanceLoading &&
|
|
101
|
-
|
|
97
|
+
effectiveCryptoPaymentMethod === CryptoPaymentMethod_1.CryptoPaymentMethodType.CONNECT_WALLET) {
|
|
102
98
|
return { text: "Insufficient balance", disable: true, error: true, loading: false };
|
|
103
99
|
}
|
|
104
100
|
return { text: `Execute ${actionLabel}`, disable: false, error: false, loading: false };
|
|
@@ -118,7 +114,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
118
114
|
selectedRecipientOrDefault,
|
|
119
115
|
anyspendQuote,
|
|
120
116
|
paymentType,
|
|
121
|
-
|
|
117
|
+
effectiveCryptoPaymentMethod,
|
|
122
118
|
selectedFiatPaymentMethod,
|
|
123
119
|
hasEnoughBalance,
|
|
124
120
|
isBalanceLoading,
|
|
@@ -147,7 +143,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
147
143
|
}
|
|
148
144
|
};
|
|
149
145
|
const headerContent = header ? (header({ anyspendPrice: anyspendQuote, isLoadingAnyspendPrice: isLoadingAnyspendQuote })) : ((0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-as-primary text-xl font-bold", children: actionLabel }), (0, jsx_runtime_1.jsx)("p", { className: "text-as-secondary text-sm", children: "Pay from any token to execute a custom exact-in transaction." })] }) }));
|
|
150
|
-
const mainView = ((0, jsx_runtime_1.jsxs)("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [headerContent, (0, jsx_runtime_1.jsx)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod:
|
|
146
|
+
const mainView = ((0, jsx_runtime_1.jsxs)("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [headerContent, (0, jsx_runtime_1.jsx)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(useAnyspendFlow_1.PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect })) : ((0, jsx_runtime_1.jsx)(react_2.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: (0, jsx_runtime_1.jsx)(PanelOnramp_1.PanelOnramp, { srcAmountOnRamp: srcAmount, setSrcAmountOnRamp: setSrcAmount, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: selectedRecipientOrDefault, destinationToken: selectedDstToken, destinationChainId: selectedDstChainId, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, hideDstToken: true, destinationAmount: dstAmount, onDestinationTokenChange: () => { }, onDestinationChainChange: () => { }, fiatPaymentMethodIndex: useAnyspendFlow_1.PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: useAnyspendFlow_1.PanelView.RECIPIENT_SELECTION, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.FEE_DETAIL), customUsdInputValues: customUsdInputValues }) })), (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: (0, jsx_runtime_1.jsx)(react_1.Button, { variant: "ghost", className: (0, cn_1.cn)("swap-direction-button border-as-stroke bg-as-surface-primary z-10 h-10 w-10 cursor-default rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl"), children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex items-center justify-center transition-opacity", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }), paymentType === "crypto" && ((0, jsx_runtime_1.jsx)(CryptoReceiveSection_1.CryptoReceiveSection, { isDepositMode: false, isBuyMode: true, selectedRecipientAddress: selectedRecipientOrDefault, recipientName: recipientName || undefined, onSelectRecipient: () => setActivePanel(useAnyspendFlow_1.PanelView.RECIPIENT_SELECTION), dstAmount: dstAmount, dstToken: selectedDstToken, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, dstTokenLogoURI: DESTINATION_TOKEN_DETAILS.LOGO_URI, selectedDstChainId: selectedDstChainId, setSelectedDstChainId: () => { }, setSelectedDstToken: () => { }, isSrcInputDirty: isSrcInputDirty, onChangeDstAmount: value => {
|
|
151
147
|
setIsSrcInputDirty(false);
|
|
152
148
|
setSrcAmount(value);
|
|
153
149
|
}, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.FEE_DETAIL) }))] }) }), (0, jsx_runtime_1.jsx)(react_2.motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: (0, cn_1.cn)("mt-4 flex w-full max-w-[460px] flex-col gap-2"), children: (0, jsx_runtime_1.jsx)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: (0, cn_1.cn)("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: (0, cn_1.cn)(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-center gap-2", children: [btnInfo.loading && (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-4 w-4 animate-spin" }), btnInfo.text] }) }) }), mainFooter ? mainFooter : null] }));
|
|
@@ -227,7 +223,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
|
|
|
227
223
|
sonner_1.toast.error("Failed to create order: " + err.message);
|
|
228
224
|
}
|
|
229
225
|
};
|
|
230
|
-
const orderDetailsView = ((0, jsx_runtime_1.jsx)("div", { className: "mx-auto w-[460px] max-w-full", children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex flex-col gap-4", children: oat && ((0, jsx_runtime_1.jsx)(OrderDetails_1.OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, cryptoPaymentMethod: paymentType === "fiat" ? CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE :
|
|
226
|
+
const orderDetailsView = ((0, jsx_runtime_1.jsx)("div", { className: "mx-auto w-[460px] max-w-full", children: (0, jsx_runtime_1.jsx)("div", { className: "relative flex flex-col gap-4", children: oat && ((0, jsx_runtime_1.jsx)(OrderDetails_1.OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, cryptoPaymentMethod: paymentType === "fiat" ? CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE : effectiveCryptoPaymentMethod, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onPaymentMethodChange: setSelectedCryptoPaymentMethod, onBack: () => {
|
|
231
227
|
setOrderId(undefined);
|
|
232
228
|
setActivePanel(useAnyspendFlow_1.PanelView.MAIN);
|
|
233
229
|
}, disableUrlParamManagement: true, points: oat.data.points || undefined })) }) }));
|
|
@@ -26,7 +26,6 @@ const OrderDetails_1 = require("./common/OrderDetails");
|
|
|
26
26
|
const PointsDetailPanel_1 = require("./common/PointsDetailPanel");
|
|
27
27
|
const RecipientSelection_1 = require("./common/RecipientSelection");
|
|
28
28
|
const lucide_react_1 = require("lucide-react");
|
|
29
|
-
const utils_1 = require("../../utils");
|
|
30
29
|
const PanelOnramp_1 = require("./common/PanelOnramp");
|
|
31
30
|
const SLIPPAGE_PERCENT = 3;
|
|
32
31
|
exports.HYPE_TOKEN_DETAILS = {
|
|
@@ -52,18 +51,15 @@ function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress,
|
|
|
52
51
|
});
|
|
53
52
|
const { connectedEOAWallet: connectedEOAWallet } = (0, react_1.useAccountWallet)();
|
|
54
53
|
const setActiveWallet = (0, react_4.useSetActiveWallet)();
|
|
55
|
-
const activeWallet = (0, react_4.useActiveWallet)();
|
|
56
|
-
const setGlobalAccountWallet = (0, utils_1.useGlobalWalletState)(state => state.setGlobalAccountWallet);
|
|
57
54
|
const appliedPreferEoa = (0, react_3.useRef)(false);
|
|
58
55
|
(0, react_3.useEffect)(() => {
|
|
59
56
|
if (preferEoa && !appliedPreferEoa.current) {
|
|
60
57
|
if (connectedEOAWallet) {
|
|
61
58
|
appliedPreferEoa.current = true;
|
|
62
|
-
setGlobalAccountWallet(activeWallet);
|
|
63
59
|
setActiveWallet(connectedEOAWallet);
|
|
64
60
|
}
|
|
65
61
|
}
|
|
66
|
-
}, [preferEoa, connectedEOAWallet, setActiveWallet
|
|
62
|
+
}, [preferEoa, connectedEOAWallet, setActiveWallet]);
|
|
67
63
|
// Button state logic
|
|
68
64
|
const btnInfo = (0, react_3.useMemo)(() => {
|
|
69
65
|
if (activeInputAmountInWei === "0")
|
|
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
4
4
|
exports.CryptoPaymentMethodType = void 0;
|
|
5
5
|
exports.CryptoPaymentMethod = CryptoPaymentMethod;
|
|
6
6
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
7
|
-
const utils_1 = require("../../../../anyspend/utils");
|
|
8
7
|
const react_1 = require("../../../../global-account/react");
|
|
9
8
|
const cn_1 = require("../../../../shared/utils/cn");
|
|
10
9
|
const formatAddress_1 = require("../../../../shared/utils/formatAddress");
|
|
@@ -34,8 +33,6 @@ function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentMethod,
|
|
|
34
33
|
const [showWalletModal, setShowWalletModal] = (0, react_3.useState)(false);
|
|
35
34
|
const setActiveWallet = (0, react_4.useSetActiveWallet)();
|
|
36
35
|
const { data: eoaWalletInfo } = (0, react_4.useWalletInfo)(connectedEOAWallet?.id);
|
|
37
|
-
const activeWallet = (0, react_4.useActiveWallet)();
|
|
38
|
-
const setGlobalAccountWallet = (0, utils_1.useGlobalWalletState)(state => state.setGlobalAccountWallet);
|
|
39
36
|
const isConnected = !!connectedEOAWallet;
|
|
40
37
|
const globalAddress = connectedSmartWallet?.getAccount()?.address;
|
|
41
38
|
// Use custom hook to determine wallet display logic
|
|
@@ -166,7 +163,6 @@ function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentMethod,
|
|
|
166
163
|
return ((0, jsx_runtime_1.jsxs)("div", { className: "crypto-payment-method mx-auto h-fit w-[460px] max-w-full", children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, cn_1.cn)("relative flex flex-col gap-10"), children: [(0, jsx_runtime_1.jsx)("button", { onClick: onBack, className: "text-as-quaternary hover:text-as-primary absolute flex h-8 w-8 items-center justify-center rounded-lg transition-colors", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronLeft, { className: "h-6 w-6" }) }), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-around gap-4", children: (0, jsx_runtime_1.jsx)("div", { className: "flex-1 text-center", children: (0, jsx_runtime_1.jsx)("h2", { className: "text-as-primary text-lg font-semibold", children: "Select a payment method" }) }) }), (0, jsx_runtime_1.jsxs)("div", { className: "crypto-payment-methods flex flex-col gap-4", children: [(shouldShowConnectedEOA || shouldShowWagmiWallet || globalAddress) && ((0, jsx_runtime_1.jsxs)("div", { className: "installed-wallets", children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-as-primary/80 mb-3 text-sm font-medium", children: "Connected wallets" }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-2", children: [shouldShowConnectedEOA && ((0, jsx_runtime_1.jsx)("button", { onClick: () => {
|
|
167
164
|
setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
|
|
168
165
|
onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
|
|
169
|
-
setGlobalAccountWallet(activeWallet);
|
|
170
166
|
if (connectedEOAWallet) {
|
|
171
167
|
setActiveWallet(connectedEOAWallet);
|
|
172
168
|
}
|
|
@@ -93,8 +93,12 @@ export declare function useAnyspendFlow({ paymentType, recipientAddress, loadOrd
|
|
|
93
93
|
setDstAmount: import("react").Dispatch<import("react").SetStateAction<string>>;
|
|
94
94
|
isSrcInputDirty: boolean;
|
|
95
95
|
setIsSrcInputDirty: import("react").Dispatch<import("react").SetStateAction<boolean>>;
|
|
96
|
+
cryptoPaymentMethod: CryptoPaymentMethodType;
|
|
97
|
+
setCryptoPaymentMethod: (method: CryptoPaymentMethodType) => void;
|
|
96
98
|
selectedCryptoPaymentMethod: CryptoPaymentMethodType;
|
|
97
|
-
setSelectedCryptoPaymentMethod:
|
|
99
|
+
setSelectedCryptoPaymentMethod: (method: CryptoPaymentMethodType) => void;
|
|
100
|
+
effectiveCryptoPaymentMethod: CryptoPaymentMethodType;
|
|
101
|
+
resetPaymentMethods: () => void;
|
|
98
102
|
selectedFiatPaymentMethod: FiatPaymentMethod;
|
|
99
103
|
setSelectedFiatPaymentMethod: import("react").Dispatch<import("react").SetStateAction<FiatPaymentMethod>>;
|
|
100
104
|
selectedRecipientAddress: string | undefined;
|
|
@@ -11,11 +11,12 @@ const react_3 = require("react");
|
|
|
11
11
|
const sonner_1 = require("sonner");
|
|
12
12
|
const viem_1 = require("viem");
|
|
13
13
|
const chains_1 = require("viem/chains");
|
|
14
|
-
const wagmi_1 = require("wagmi");
|
|
15
14
|
const CryptoPaymentMethod_1 = require("../components/common/CryptoPaymentMethod");
|
|
16
15
|
const FiatPaymentMethod_1 = require("../components/common/FiatPaymentMethod");
|
|
17
16
|
const useAutoSelectCryptoPaymentMethod_1 = require("./useAutoSelectCryptoPaymentMethod");
|
|
18
17
|
const useAutoSetActiveWalletFromWagmi_1 = require("./useAutoSetActiveWalletFromWagmi");
|
|
18
|
+
const useConnectedWalletDisplay_1 = require("./useConnectedWalletDisplay");
|
|
19
|
+
const useCryptoPaymentMethodState_1 = require("./useCryptoPaymentMethodState");
|
|
19
20
|
var PanelView;
|
|
20
21
|
(function (PanelView) {
|
|
21
22
|
PanelView[PanelView["MAIN"] = 0] = "MAIN";
|
|
@@ -46,12 +47,12 @@ function useAnyspendFlow({ paymentType = "crypto", recipientAddress, loadOrder,
|
|
|
46
47
|
const [isSrcInputDirty, setIsSrcInputDirty] = (0, react_3.useState)(true);
|
|
47
48
|
// Derive destination chain ID from token or prop (cannot change)
|
|
48
49
|
const selectedDstChainId = destinationTokenChainId || selectedDstToken.chainId;
|
|
49
|
-
// Payment method state
|
|
50
|
-
const
|
|
50
|
+
// Payment method state with dual-state system (auto + explicit user selection)
|
|
51
|
+
const { cryptoPaymentMethod, setCryptoPaymentMethod, selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, effectiveCryptoPaymentMethod, resetPaymentMethods, } = (0, useCryptoPaymentMethodState_1.useCryptoPaymentMethodState)();
|
|
51
52
|
const [selectedFiatPaymentMethod, setSelectedFiatPaymentMethod] = (0, react_3.useState)(FiatPaymentMethod_1.FiatPaymentMethod.NONE);
|
|
52
53
|
// Recipient state
|
|
53
54
|
const { address: globalAddress } = (0, react_2.useAccountWallet)();
|
|
54
|
-
const {
|
|
55
|
+
const { walletAddress } = (0, useConnectedWalletDisplay_1.useConnectedWalletDisplay)(effectiveCryptoPaymentMethod);
|
|
55
56
|
const [selectedRecipientAddress, setSelectedRecipientAddress] = (0, react_3.useState)(recipientAddress);
|
|
56
57
|
const recipientProfile = (0, react_2.useProfile)({ address: selectedRecipientAddress, fresh: true });
|
|
57
58
|
const recipientName = recipientProfile.data?.name;
|
|
@@ -66,7 +67,7 @@ function useAnyspendFlow({ paymentType = "crypto", recipientAddress, loadOrder,
|
|
|
66
67
|
// Check token balance for crypto payments
|
|
67
68
|
const { rawBalance, isLoading: isBalanceLoading } = (0, react_2.useTokenBalance)({
|
|
68
69
|
token: selectedSrcToken,
|
|
69
|
-
address:
|
|
70
|
+
address: walletAddress,
|
|
70
71
|
});
|
|
71
72
|
// Check if user has enough balance
|
|
72
73
|
const hasEnoughBalance = (0, react_3.useMemo)(() => {
|
|
@@ -83,8 +84,9 @@ function useAnyspendFlow({ paymentType = "crypto", recipientAddress, loadOrder,
|
|
|
83
84
|
// Auto-select crypto payment method based on available wallets and balance
|
|
84
85
|
(0, useAutoSelectCryptoPaymentMethod_1.useAutoSelectCryptoPaymentMethod)({
|
|
85
86
|
paymentType,
|
|
87
|
+
cryptoPaymentMethod,
|
|
88
|
+
setCryptoPaymentMethod,
|
|
86
89
|
selectedCryptoPaymentMethod,
|
|
87
|
-
setSelectedCryptoPaymentMethod,
|
|
88
90
|
hasEnoughBalance,
|
|
89
91
|
isBalanceLoading,
|
|
90
92
|
});
|
|
@@ -184,9 +186,9 @@ function useAnyspendFlow({ paymentType = "crypto", recipientAddress, loadOrder,
|
|
|
184
186
|
if (!disableUrlParamManagement) {
|
|
185
187
|
const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
|
|
186
188
|
params.set("orderId", newOrderId);
|
|
187
|
-
if (
|
|
188
|
-
console.log("Setting cryptoPaymentMethod in URL:",
|
|
189
|
-
params.set("cryptoPaymentMethod",
|
|
189
|
+
if (effectiveCryptoPaymentMethod !== CryptoPaymentMethod_1.CryptoPaymentMethodType.NONE) {
|
|
190
|
+
console.log("Setting cryptoPaymentMethod in URL:", effectiveCryptoPaymentMethod);
|
|
191
|
+
params.set("cryptoPaymentMethod", effectiveCryptoPaymentMethod);
|
|
190
192
|
}
|
|
191
193
|
else {
|
|
192
194
|
console.log("Payment method is NONE, not setting in URL");
|
|
@@ -250,8 +252,12 @@ function useAnyspendFlow({ paymentType = "crypto", recipientAddress, loadOrder,
|
|
|
250
252
|
isSrcInputDirty,
|
|
251
253
|
setIsSrcInputDirty,
|
|
252
254
|
// Payment methods
|
|
255
|
+
cryptoPaymentMethod,
|
|
256
|
+
setCryptoPaymentMethod,
|
|
253
257
|
selectedCryptoPaymentMethod,
|
|
254
258
|
setSelectedCryptoPaymentMethod,
|
|
259
|
+
effectiveCryptoPaymentMethod,
|
|
260
|
+
resetPaymentMethods,
|
|
255
261
|
selectedFiatPaymentMethod,
|
|
256
262
|
setSelectedFiatPaymentMethod,
|
|
257
263
|
// Recipient
|
|
@@ -2,10 +2,12 @@ import { CryptoPaymentMethodType } from "../components/common/CryptoPaymentMetho
|
|
|
2
2
|
interface UseAutoSelectCryptoPaymentMethodParams {
|
|
3
3
|
/** Current payment type (crypto or fiat) */
|
|
4
4
|
paymentType?: "crypto" | "fiat";
|
|
5
|
-
/**
|
|
5
|
+
/** Auto-selected payment method based on balance (not used in hook logic, but part of state management) */
|
|
6
|
+
cryptoPaymentMethod: CryptoPaymentMethodType;
|
|
7
|
+
/** Function to update the auto-selected payment method */
|
|
8
|
+
setCryptoPaymentMethod: (method: CryptoPaymentMethodType) => void;
|
|
9
|
+
/** User explicitly selected payment method (NONE means no explicit selection) */
|
|
6
10
|
selectedCryptoPaymentMethod: CryptoPaymentMethodType;
|
|
7
|
-
/** Function to update the selected payment method */
|
|
8
|
-
setSelectedCryptoPaymentMethod: (method: CryptoPaymentMethodType) => void;
|
|
9
11
|
/** Whether user has enough balance to pay */
|
|
10
12
|
hasEnoughBalance: boolean;
|
|
11
13
|
/** Whether balance is still loading */
|
|
@@ -16,11 +18,11 @@ interface UseAutoSelectCryptoPaymentMethodParams {
|
|
|
16
18
|
* based on available wallets and balance.
|
|
17
19
|
*
|
|
18
20
|
* Auto-selection logic:
|
|
19
|
-
* - Only auto-selects when
|
|
21
|
+
* - Only auto-selects when selectedCryptoPaymentMethod is NONE (user hasn't explicitly chosen)
|
|
20
22
|
* - If EOA/Wagmi wallet connected + has balance → CONNECT_WALLET
|
|
21
23
|
* - If EOA/Wagmi wallet connected + insufficient balance → TRANSFER_CRYPTO
|
|
22
24
|
* - If only Global wallet available → GLOBAL_WALLET
|
|
23
25
|
* - If no wallets → remains NONE
|
|
24
26
|
*/
|
|
25
|
-
export declare function useAutoSelectCryptoPaymentMethod({ paymentType,
|
|
27
|
+
export declare function useAutoSelectCryptoPaymentMethod({ paymentType, cryptoPaymentMethod: _cryptoPaymentMethod, setCryptoPaymentMethod, selectedCryptoPaymentMethod, hasEnoughBalance, isBalanceLoading, }: UseAutoSelectCryptoPaymentMethodParams): void;
|
|
26
28
|
export {};
|