@b3dotfun/sdk 0.0.44-alpha.2 → 0.0.44-alpha.3
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 +1 -1
- package/dist/cjs/anyspend/react/components/AnyspendDepositHype.js +1 -1
- package/dist/cjs/anyspend/react/components/common/OrderHistoryItem.js +2 -2
- package/dist/esm/anyspend/react/components/AnySpend.js +1 -1
- package/dist/esm/anyspend/react/components/AnyspendDepositHype.js +1 -1
- package/dist/esm/anyspend/react/components/common/OrderHistoryItem.js +2 -2
- package/package.json +1 -1
- package/src/anyspend/react/components/AnySpend.tsx +1 -1
- package/src/anyspend/react/components/AnyspendDepositHype.tsx +0 -1
- package/src/anyspend/react/components/common/OrderHistoryItem.tsx +40 -19
|
@@ -338,7 +338,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
338
338
|
? (0, viem_1.parseUnits)(srcAmount.replace(/,/g, ""), selectedSrcToken.decimals).toString()
|
|
339
339
|
: (0, viem_1.parseUnits)(dstAmount.replace(/,/g, ""), selectedDstToken.decimals).toString();
|
|
340
340
|
const srcAmountOnrampInWei = (0, viem_1.parseUnits)(srcAmountOnRamp.replace(/,/g, ""), anyspend_1.USDC_BASE.decimals).toString();
|
|
341
|
-
const { anyspendQuote, isLoadingAnyspendQuote
|
|
341
|
+
const { anyspendQuote, isLoadingAnyspendQuote } = (0, react_1.useAnyspendQuote)(activeTab === "crypto"
|
|
342
342
|
? {
|
|
343
343
|
srcChain: selectedSrcChainId,
|
|
344
344
|
dstChain: isBuyMode ? destinationTokenChainId : selectedDstChainId,
|
|
@@ -36,7 +36,7 @@ function AnySpendDepositHype(props) {
|
|
|
36
36
|
}
|
|
37
37
|
function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, onSuccess, mainFooter, onTokenSelect, customUsdInputValues, }) {
|
|
38
38
|
// Use shared flow hook
|
|
39
|
-
const { activePanel, setActivePanel, orderId, setOrderId, oat, selectedSrcChainId, setSelectedSrcChainId, selectedSrcToken, setSelectedSrcToken, srcAmount, setSrcAmount, dstAmount, setIsSrcInputDirty, selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, selectedFiatPaymentMethod, setSelectedFiatPaymentMethod, selectedRecipientAddress, setSelectedRecipientAddress, recipientName, globalAddress, anyspendQuote, isLoadingAnyspendQuote,
|
|
39
|
+
const { activePanel, setActivePanel, orderId, setOrderId, oat, selectedSrcChainId, setSelectedSrcChainId, selectedSrcToken, setSelectedSrcToken, srcAmount, setSrcAmount, dstAmount, setIsSrcInputDirty, selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, selectedFiatPaymentMethod, setSelectedFiatPaymentMethod, selectedRecipientAddress, setSelectedRecipientAddress, recipientName, globalAddress, anyspendQuote, isLoadingAnyspendQuote, activeInputAmountInWei, geoData, coinbaseAvailablePaymentMethods, stripeWeb2Support, createOrder, isCreatingOrder, createOnrampOrder, isCreatingOnrampOrder, } = (0, useAnyspendFlow_1.useAnyspendFlow)({
|
|
40
40
|
paymentType,
|
|
41
41
|
recipientAddress,
|
|
42
42
|
loadOrder,
|
|
@@ -28,9 +28,9 @@ function OrderHistoryItem({ order, onSelectOrder, mode }) {
|
|
|
28
28
|
// Check if this is a one-click payment order
|
|
29
29
|
const isOneClickPayment = !!order.oneClickBuyUrl;
|
|
30
30
|
const vendorName = order.onrampMetadata?.vendor ? (0, payment_utils_1.getVendorDisplayName)(order.onrampMetadata.vendor) : null;
|
|
31
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("bg-as-surface-secondary hover:bg-as-surface-tertiary rounded-xl p-4 transition-all", onSelectOrder && "cursor-pointer"), onClick: () => onSelectOrder?.(order.id), children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-3 flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("text-xs font-semibold", orderDisplayStatus === "processing" && "text-yellow-600", orderDisplayStatus === "success" && "text-green-600", orderDisplayStatus === "failure" && "text-red-600"), children: orderStatusText }), isOneClickPayment && vendorName && ((0, jsx_runtime_1.jsx)(react_1.Badge, { variant: "outline", className: "text-as-secondary px-2 py-0.5 text-[10px]", children: vendorName }))] }), (0, jsx_runtime_1.jsx)("div", { className: "text-as-secondary text-[10px] font-medium uppercase tracking-wide", children: (0, jsx_runtime_1.jsx)(react_timeago_1.default, { date: new Date(order.createdAt) }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [(0, jsx_runtime_1.jsx)("img", { src: order.metadata.srcToken.metadata.logoURI, alt: order.metadata.srcToken.symbol, className: "h-
|
|
31
|
+
return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("bg-as-surface-secondary hover:bg-as-surface-tertiary rounded-xl p-4 transition-all", onSelectOrder && "cursor-pointer"), onClick: () => onSelectOrder?.(order.id), children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-3 flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("text-xs font-semibold", orderDisplayStatus === "processing" && "text-yellow-600", orderDisplayStatus === "success" && "text-green-600", orderDisplayStatus === "failure" && "text-red-600"), children: orderStatusText }), isOneClickPayment && vendorName && ((0, jsx_runtime_1.jsx)(react_1.Badge, { variant: "outline", className: "text-as-secondary px-2 py-0.5 text-[10px]", children: vendorName }))] }), (0, jsx_runtime_1.jsx)("div", { className: "text-as-secondary text-[10px] font-medium uppercase tracking-wide", children: (0, jsx_runtime_1.jsx)(react_timeago_1.default, { date: new Date(order.createdAt) }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("flex items-center", isSmallView ? "gap-2" : "gap-4"), children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("flex min-w-0 flex-1 items-center", isSmallView ? "gap-1.5" : "gap-2"), children: [(0, jsx_runtime_1.jsx)("img", { src: order.metadata.srcToken.metadata.logoURI, alt: order.metadata.srcToken.symbol, className: (0, utils_1.cn)("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8") }), (0, jsx_runtime_1.jsxs)("div", { className: "min-w-0 flex-1", children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm"), children: [(0, number_1.formatTokenAmount)(BigInt(order.srcAmount), order.metadata.srcToken.decimals), " ", order.metadata.srcToken.symbol] }), (0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs"), children: [(0, jsx_runtime_1.jsx)("img", { src: anyspend_1.ALL_CHAINS[order.srcChain]?.logoUrl, alt: (0, anyspend_1.getChainName)(order.srcChain), className: "h-3 w-3" }), (0, jsx_runtime_1.jsx)("span", { className: "truncate", children: (0, anyspend_1.getChainName)(order.srcChain) })] })] })] }), (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowRight, { className: (0, utils_1.cn)("text-as-secondary shrink-0 opacity-30", isSmallView ? "h-4 w-4" : "h-5 w-5") }), (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("flex min-w-0 flex-1 items-center", isSmallView ? "gap-1.5" : "gap-2"), children: nft ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("img", { src: nft.imageUrl, alt: nft.name, className: (0, utils_1.cn)("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8") }), (0, jsx_runtime_1.jsxs)("div", { className: "min-w-0 flex-1", children: [(0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm"), children: nft.name }), (0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs"), children: [(0, jsx_runtime_1.jsx)("img", { src: anyspend_1.ALL_CHAINS[order.dstChain]?.logoUrl, alt: (0, anyspend_1.getChainName)(order.dstChain), className: "h-3 w-3" }), (0, jsx_runtime_1.jsx)("span", { className: "truncate", children: (0, anyspend_1.getChainName)(order.dstChain) })] })] })] })) : tournament ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("img", { src: tournament.imageUrl, alt: tournament.name, className: (0, utils_1.cn)("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8") }), (0, jsx_runtime_1.jsxs)("div", { className: "min-w-0 flex-1", children: [(0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm"), children: tournament.name }), (0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs"), children: [(0, jsx_runtime_1.jsx)("img", { src: anyspend_1.ALL_CHAINS[order.dstChain]?.logoUrl, alt: (0, anyspend_1.getChainName)(order.dstChain), className: "h-3 w-3" }), (0, jsx_runtime_1.jsx)("span", { className: "truncate", children: (0, anyspend_1.getChainName)(order.dstChain) })] })] })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("img", { src: dstToken.metadata.logoURI, alt: dstToken.symbol, className: (0, utils_1.cn)("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8") }), (0, jsx_runtime_1.jsxs)("div", { className: "min-w-0 flex-1", children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm"), children: [(0, number_1.formatTokenAmount)(actualDstAmount
|
|
32
32
|
? BigInt(actualDstAmount)
|
|
33
33
|
: expectedDstAmount
|
|
34
34
|
? BigInt(expectedDstAmount)
|
|
35
|
-
: BigInt(0), dstToken.decimals), " ", dstToken.symbol] }), (0, jsx_runtime_1.jsxs)("div", { className: "text-as-secondary flex items-center gap-1 text-xs", children: [(0, jsx_runtime_1.jsx)("img", { src: anyspend_1.ALL_CHAINS[order.dstChain]?.logoUrl, alt: (0, anyspend_1.getChainName)(order.dstChain), className: "h-3 w-3" }), (0, jsx_runtime_1.jsx)("span", { className: "truncate", children: (0, anyspend_1.getChainName)(order.dstChain) })] })] })] })) })] })] }, `anyspend-${order.id}`));
|
|
35
|
+
: BigInt(0), dstToken.decimals), " ", dstToken.symbol] }), (0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs"), children: [(0, jsx_runtime_1.jsx)("img", { src: anyspend_1.ALL_CHAINS[order.dstChain]?.logoUrl, alt: (0, anyspend_1.getChainName)(order.dstChain), className: "h-3 w-3" }), (0, jsx_runtime_1.jsx)("span", { className: "truncate", children: (0, anyspend_1.getChainName)(order.dstChain) })] })] })] })) })] })] }, `anyspend-${order.id}`));
|
|
36
36
|
}
|
|
@@ -331,7 +331,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
|
|
|
331
331
|
? parseUnits(srcAmount.replace(/,/g, ""), selectedSrcToken.decimals).toString()
|
|
332
332
|
: parseUnits(dstAmount.replace(/,/g, ""), selectedDstToken.decimals).toString();
|
|
333
333
|
const srcAmountOnrampInWei = parseUnits(srcAmountOnRamp.replace(/,/g, ""), USDC_BASE.decimals).toString();
|
|
334
|
-
const { anyspendQuote, isLoadingAnyspendQuote
|
|
334
|
+
const { anyspendQuote, isLoadingAnyspendQuote } = useAnyspendQuote(activeTab === "crypto"
|
|
335
335
|
? {
|
|
336
336
|
srcChain: selectedSrcChainId,
|
|
337
337
|
dstChain: isBuyMode ? destinationTokenChainId : selectedDstChainId,
|
|
@@ -29,7 +29,7 @@ export function AnySpendDepositHype(props) {
|
|
|
29
29
|
}
|
|
30
30
|
function AnySpendDepositHypeInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, onSuccess, mainFooter, onTokenSelect, customUsdInputValues, }) {
|
|
31
31
|
// Use shared flow hook
|
|
32
|
-
const { activePanel, setActivePanel, orderId, setOrderId, oat, selectedSrcChainId, setSelectedSrcChainId, selectedSrcToken, setSelectedSrcToken, srcAmount, setSrcAmount, dstAmount, setIsSrcInputDirty, selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, selectedFiatPaymentMethod, setSelectedFiatPaymentMethod, selectedRecipientAddress, setSelectedRecipientAddress, recipientName, globalAddress, anyspendQuote, isLoadingAnyspendQuote,
|
|
32
|
+
const { activePanel, setActivePanel, orderId, setOrderId, oat, selectedSrcChainId, setSelectedSrcChainId, selectedSrcToken, setSelectedSrcToken, srcAmount, setSrcAmount, dstAmount, setIsSrcInputDirty, selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, selectedFiatPaymentMethod, setSelectedFiatPaymentMethod, selectedRecipientAddress, setSelectedRecipientAddress, recipientName, globalAddress, anyspendQuote, isLoadingAnyspendQuote, activeInputAmountInWei, geoData, coinbaseAvailablePaymentMethods, stripeWeb2Support, createOrder, isCreatingOrder, createOnrampOrder, isCreatingOnrampOrder, } = useAnyspendFlow({
|
|
33
33
|
paymentType,
|
|
34
34
|
recipientAddress,
|
|
35
35
|
loadOrder,
|
|
@@ -22,9 +22,9 @@ export function OrderHistoryItem({ order, onSelectOrder, mode }) {
|
|
|
22
22
|
// Check if this is a one-click payment order
|
|
23
23
|
const isOneClickPayment = !!order.oneClickBuyUrl;
|
|
24
24
|
const vendorName = order.onrampMetadata?.vendor ? getVendorDisplayName(order.onrampMetadata.vendor) : null;
|
|
25
|
-
return (_jsxs("div", { className: cn("bg-as-surface-secondary hover:bg-as-surface-tertiary rounded-xl p-4 transition-all", onSelectOrder && "cursor-pointer"), onClick: () => onSelectOrder?.(order.id), children: [_jsxs("div", { className: "mb-3 flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: cn("text-xs font-semibold", orderDisplayStatus === "processing" && "text-yellow-600", orderDisplayStatus === "success" && "text-green-600", orderDisplayStatus === "failure" && "text-red-600"), children: orderStatusText }), isOneClickPayment && vendorName && (_jsx(Badge, { variant: "outline", className: "text-as-secondary px-2 py-0.5 text-[10px]", children: vendorName }))] }), _jsx("div", { className: "text-as-secondary text-[10px] font-medium uppercase tracking-wide", children: _jsx(TimeAgo, { date: new Date(order.createdAt) }) })] }), _jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [_jsx("img", { src: order.metadata.srcToken.metadata.logoURI, alt: order.metadata.srcToken.symbol, className: "h-
|
|
25
|
+
return (_jsxs("div", { className: cn("bg-as-surface-secondary hover:bg-as-surface-tertiary rounded-xl p-4 transition-all", onSelectOrder && "cursor-pointer"), onClick: () => onSelectOrder?.(order.id), children: [_jsxs("div", { className: "mb-3 flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: cn("text-xs font-semibold", orderDisplayStatus === "processing" && "text-yellow-600", orderDisplayStatus === "success" && "text-green-600", orderDisplayStatus === "failure" && "text-red-600"), children: orderStatusText }), isOneClickPayment && vendorName && (_jsx(Badge, { variant: "outline", className: "text-as-secondary px-2 py-0.5 text-[10px]", children: vendorName }))] }), _jsx("div", { className: "text-as-secondary text-[10px] font-medium uppercase tracking-wide", children: _jsx(TimeAgo, { date: new Date(order.createdAt) }) })] }), _jsxs("div", { className: cn("flex items-center", isSmallView ? "gap-2" : "gap-4"), children: [_jsxs("div", { className: cn("flex min-w-0 flex-1 items-center", isSmallView ? "gap-1.5" : "gap-2"), children: [_jsx("img", { src: order.metadata.srcToken.metadata.logoURI, alt: order.metadata.srcToken.symbol, className: cn("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8") }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: cn("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm"), children: [formatTokenAmount(BigInt(order.srcAmount), order.metadata.srcToken.decimals), " ", order.metadata.srcToken.symbol] }), _jsxs("div", { className: cn("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs"), children: [_jsx("img", { src: ALL_CHAINS[order.srcChain]?.logoUrl, alt: getChainName(order.srcChain), className: "h-3 w-3" }), _jsx("span", { className: "truncate", children: getChainName(order.srcChain) })] })] })] }), _jsx(ArrowRight, { className: cn("text-as-secondary shrink-0 opacity-30", isSmallView ? "h-4 w-4" : "h-5 w-5") }), _jsx("div", { className: cn("flex min-w-0 flex-1 items-center", isSmallView ? "gap-1.5" : "gap-2"), children: nft ? (_jsxs(_Fragment, { children: [_jsx("img", { src: nft.imageUrl, alt: nft.name, className: cn("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8") }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: cn("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm"), children: nft.name }), _jsxs("div", { className: cn("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs"), children: [_jsx("img", { src: ALL_CHAINS[order.dstChain]?.logoUrl, alt: getChainName(order.dstChain), className: "h-3 w-3" }), _jsx("span", { className: "truncate", children: getChainName(order.dstChain) })] })] })] })) : tournament ? (_jsxs(_Fragment, { children: [_jsx("img", { src: tournament.imageUrl, alt: tournament.name, className: cn("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8") }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: cn("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm"), children: tournament.name }), _jsxs("div", { className: cn("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs"), children: [_jsx("img", { src: ALL_CHAINS[order.dstChain]?.logoUrl, alt: getChainName(order.dstChain), className: "h-3 w-3" }), _jsx("span", { className: "truncate", children: getChainName(order.dstChain) })] })] })] })) : (_jsxs(_Fragment, { children: [_jsx("img", { src: dstToken.metadata.logoURI, alt: dstToken.symbol, className: cn("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8") }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: cn("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm"), children: [formatTokenAmount(actualDstAmount
|
|
26
26
|
? BigInt(actualDstAmount)
|
|
27
27
|
: expectedDstAmount
|
|
28
28
|
? BigInt(expectedDstAmount)
|
|
29
|
-
: BigInt(0), dstToken.decimals), " ", dstToken.symbol] }), _jsxs("div", { className: "text-as-secondary flex items-center gap-1 text-xs", children: [_jsx("img", { src: ALL_CHAINS[order.dstChain]?.logoUrl, alt: getChainName(order.dstChain), className: "h-3 w-3" }), _jsx("span", { className: "truncate", children: getChainName(order.dstChain) })] })] })] })) })] })] }, `anyspend-${order.id}`));
|
|
29
|
+
: BigInt(0), dstToken.decimals), " ", dstToken.symbol] }), _jsxs("div", { className: cn("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs"), children: [_jsx("img", { src: ALL_CHAINS[order.dstChain]?.logoUrl, alt: getChainName(order.dstChain), className: "h-3 w-3" }), _jsx("span", { className: "truncate", children: getChainName(order.dstChain) })] })] })] })) })] })] }, `anyspend-${order.id}`));
|
|
30
30
|
}
|
package/package.json
CHANGED
|
@@ -468,7 +468,7 @@ function AnySpendInner({
|
|
|
468
468
|
? parseUnits(srcAmount.replace(/,/g, ""), selectedSrcToken.decimals).toString()
|
|
469
469
|
: parseUnits(dstAmount.replace(/,/g, ""), selectedDstToken.decimals).toString();
|
|
470
470
|
const srcAmountOnrampInWei = parseUnits(srcAmountOnRamp.replace(/,/g, ""), USDC_BASE.decimals).toString();
|
|
471
|
-
const { anyspendQuote, isLoadingAnyspendQuote
|
|
471
|
+
const { anyspendQuote, isLoadingAnyspendQuote } = useAnyspendQuote(
|
|
472
472
|
activeTab === "crypto"
|
|
473
473
|
? {
|
|
474
474
|
srcChain: selectedSrcChainId,
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import { ALL_CHAINS, getChainName, getStatusDisplay } from "@b3dotfun/sdk/anyspend";
|
|
2
|
-
import { Badge,
|
|
2
|
+
import { Badge, useIsMobile } from "@b3dotfun/sdk/global-account/react";
|
|
3
3
|
import { cn } from "@b3dotfun/sdk/shared/utils";
|
|
4
4
|
import { formatTokenAmount } from "@b3dotfun/sdk/shared/utils/number";
|
|
5
5
|
import { getVendorDisplayName } from "@b3dotfun/sdk/shared/utils/payment.utils";
|
|
6
|
-
import { ArrowRight
|
|
6
|
+
import { ArrowRight } from "lucide-react";
|
|
7
7
|
import TimeAgo from "react-timeago";
|
|
8
|
-
import { b3 } from "viem/chains";
|
|
9
8
|
import { components } from "@b3dotfun/sdk/anyspend/types/api";
|
|
10
9
|
|
|
11
10
|
interface OrderHistoryItemProps {
|
|
@@ -70,20 +69,20 @@ export function OrderHistoryItem({ order, onSelectOrder, mode }: OrderHistoryIte
|
|
|
70
69
|
</div>
|
|
71
70
|
|
|
72
71
|
{/* Main Content: From -> To */}
|
|
73
|
-
<div className="flex items-center gap-4">
|
|
72
|
+
<div className={cn("flex items-center", isSmallView ? "gap-2" : "gap-4")}>
|
|
74
73
|
{/* From Section */}
|
|
75
|
-
<div className="flex min-w-0 flex-1 items-center gap-2">
|
|
74
|
+
<div className={cn("flex min-w-0 flex-1 items-center", isSmallView ? "gap-1.5" : "gap-2")}>
|
|
76
75
|
<img
|
|
77
76
|
src={order.metadata.srcToken.metadata.logoURI}
|
|
78
77
|
alt={order.metadata.srcToken.symbol}
|
|
79
|
-
className="h-
|
|
78
|
+
className={cn("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8")}
|
|
80
79
|
/>
|
|
81
80
|
<div className="min-w-0 flex-1">
|
|
82
|
-
<div className="text-as-primary truncate text-
|
|
81
|
+
<div className={cn("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm")}>
|
|
83
82
|
{formatTokenAmount(BigInt(order.srcAmount), order.metadata.srcToken.decimals)}{" "}
|
|
84
83
|
{order.metadata.srcToken.symbol}
|
|
85
84
|
</div>
|
|
86
|
-
<div className="text-as-secondary flex items-center gap-1 text-xs">
|
|
85
|
+
<div className={cn("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs")}>
|
|
87
86
|
<img src={ALL_CHAINS[order.srcChain]?.logoUrl} alt={getChainName(order.srcChain)} className="h-3 w-3" />
|
|
88
87
|
<span className="truncate">{getChainName(order.srcChain)}</span>
|
|
89
88
|
</div>
|
|
@@ -91,16 +90,24 @@ export function OrderHistoryItem({ order, onSelectOrder, mode }: OrderHistoryIte
|
|
|
91
90
|
</div>
|
|
92
91
|
|
|
93
92
|
{/* Arrow */}
|
|
94
|
-
<ArrowRight className="text-as-secondary h-
|
|
93
|
+
<ArrowRight className={cn("text-as-secondary shrink-0 opacity-30", isSmallView ? "h-4 w-4" : "h-5 w-5")} />
|
|
95
94
|
|
|
96
95
|
{/* To Section */}
|
|
97
|
-
<div className="flex min-w-0 flex-1 items-center gap-2">
|
|
96
|
+
<div className={cn("flex min-w-0 flex-1 items-center", isSmallView ? "gap-1.5" : "gap-2")}>
|
|
98
97
|
{nft ? (
|
|
99
98
|
<>
|
|
100
|
-
<img
|
|
99
|
+
<img
|
|
100
|
+
src={nft.imageUrl}
|
|
101
|
+
alt={nft.name}
|
|
102
|
+
className={cn("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8")}
|
|
103
|
+
/>
|
|
101
104
|
<div className="min-w-0 flex-1">
|
|
102
|
-
<div className="text-as-primary truncate text-
|
|
103
|
-
|
|
105
|
+
<div className={cn("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm")}>
|
|
106
|
+
{nft.name}
|
|
107
|
+
</div>
|
|
108
|
+
<div
|
|
109
|
+
className={cn("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs")}
|
|
110
|
+
>
|
|
104
111
|
<img
|
|
105
112
|
src={ALL_CHAINS[order.dstChain]?.logoUrl}
|
|
106
113
|
alt={getChainName(order.dstChain)}
|
|
@@ -112,10 +119,18 @@ export function OrderHistoryItem({ order, onSelectOrder, mode }: OrderHistoryIte
|
|
|
112
119
|
</>
|
|
113
120
|
) : tournament ? (
|
|
114
121
|
<>
|
|
115
|
-
<img
|
|
122
|
+
<img
|
|
123
|
+
src={tournament.imageUrl}
|
|
124
|
+
alt={tournament.name}
|
|
125
|
+
className={cn("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8")}
|
|
126
|
+
/>
|
|
116
127
|
<div className="min-w-0 flex-1">
|
|
117
|
-
<div className="text-as-primary truncate text-
|
|
118
|
-
|
|
128
|
+
<div className={cn("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm")}>
|
|
129
|
+
{tournament.name}
|
|
130
|
+
</div>
|
|
131
|
+
<div
|
|
132
|
+
className={cn("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs")}
|
|
133
|
+
>
|
|
119
134
|
<img
|
|
120
135
|
src={ALL_CHAINS[order.dstChain]?.logoUrl}
|
|
121
136
|
alt={getChainName(order.dstChain)}
|
|
@@ -127,9 +142,13 @@ export function OrderHistoryItem({ order, onSelectOrder, mode }: OrderHistoryIte
|
|
|
127
142
|
</>
|
|
128
143
|
) : (
|
|
129
144
|
<>
|
|
130
|
-
<img
|
|
145
|
+
<img
|
|
146
|
+
src={dstToken.metadata.logoURI}
|
|
147
|
+
alt={dstToken.symbol}
|
|
148
|
+
className={cn("shrink-0 rounded-full", isSmallView ? "h-7 w-7" : "h-8 w-8")}
|
|
149
|
+
/>
|
|
131
150
|
<div className="min-w-0 flex-1">
|
|
132
|
-
<div className="text-as-primary truncate text-
|
|
151
|
+
<div className={cn("text-as-primary truncate font-bold", isSmallView ? "text-xs" : "text-sm")}>
|
|
133
152
|
{formatTokenAmount(
|
|
134
153
|
actualDstAmount
|
|
135
154
|
? BigInt(actualDstAmount)
|
|
@@ -140,7 +159,9 @@ export function OrderHistoryItem({ order, onSelectOrder, mode }: OrderHistoryIte
|
|
|
140
159
|
)}{" "}
|
|
141
160
|
{dstToken.symbol}
|
|
142
161
|
</div>
|
|
143
|
-
<div
|
|
162
|
+
<div
|
|
163
|
+
className={cn("text-as-secondary flex items-center gap-1", isSmallView ? "text-[10px]" : "text-xs")}
|
|
164
|
+
>
|
|
144
165
|
<img
|
|
145
166
|
src={ALL_CHAINS[order.dstChain]?.logoUrl}
|
|
146
167
|
alt={getChainName(order.dstChain)}
|