@b3dotfun/sdk 0.0.9-alpha.6 → 0.0.9-alpha.7
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.
|
@@ -179,7 +179,12 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
|
|
|
179
179
|
// Main payment handler that triggers chain switch and payment
|
|
180
180
|
const handlePayment = async () => {
|
|
181
181
|
console.log("Initiating payment process. Target chain:", order.srcChain, "Current chain:", walletClient?.chain?.id);
|
|
182
|
-
|
|
182
|
+
if (order.srcChain === anyspend_1.RELAY_SOLANA_MAINNET_CHAIN_ID) {
|
|
183
|
+
await initiatePhantomTransfer(order.srcAmount, order.srcTokenAddress, order.globalAddress);
|
|
184
|
+
}
|
|
185
|
+
else {
|
|
186
|
+
await switchChainAndExecute(order.srcChain, handlePaymentProcess);
|
|
187
|
+
}
|
|
183
188
|
};
|
|
184
189
|
// When waitingForDeposit is true, we show a message to the user to wait for the deposit to be processed.
|
|
185
190
|
const setWaitingForDeposit = (0, react_4.useCallback)(() => {
|
|
@@ -214,6 +219,16 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
|
|
|
214
219
|
}
|
|
215
220
|
}, [setWaitingForDeposit, txSuccess]);
|
|
216
221
|
const [showOrderDetails, setShowOrderDetails] = (0, react_4.useState)(false);
|
|
222
|
+
const isPhantomMobile = (0, react_4.useMemo)(() => navigator.userAgent.includes("Phantom"), []);
|
|
223
|
+
const isPhantomBrowser = (0, react_4.useMemo)(() => window.phantom?.solana?.isPhantom, []);
|
|
224
|
+
// Get connected Phantom wallet address if available
|
|
225
|
+
const phantomWalletAddress = (0, react_4.useMemo)(() => {
|
|
226
|
+
const phantom = window.phantom?.solana;
|
|
227
|
+
if (phantom?.isConnected && phantom?.publicKey) {
|
|
228
|
+
return phantom.publicKey.toString();
|
|
229
|
+
}
|
|
230
|
+
return null;
|
|
231
|
+
}, []);
|
|
217
232
|
if (!srcToken || !dstToken) {
|
|
218
233
|
return (0, jsx_runtime_1.jsx)("div", { children: "Loading..." });
|
|
219
234
|
}
|
|
@@ -249,9 +264,6 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
|
|
|
249
264
|
};
|
|
250
265
|
const initiatePhantomTransfer = async (amountLamports, tokenAddress, recipientAddress) => {
|
|
251
266
|
try {
|
|
252
|
-
// Step 1: Check if Phantom is available
|
|
253
|
-
const isPhantomMobile = navigator.userAgent.includes("Phantom");
|
|
254
|
-
const isPhantomBrowser = window.phantom?.solana?.isPhantom;
|
|
255
267
|
if (!isPhantomBrowser && !isPhantomMobile) {
|
|
256
268
|
sonner_1.toast.error("Phantom wallet not installed. Please install Phantom wallet to continue.");
|
|
257
269
|
return;
|
|
@@ -359,22 +371,6 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
|
|
|
359
371
|
const { blockhash } = await connection.getLatestBlockhash("confirmed");
|
|
360
372
|
transaction.recentBlockhash = blockhash;
|
|
361
373
|
transaction.feePayer = fromPubkey;
|
|
362
|
-
// Optional: Simulate transaction to catch issues early
|
|
363
|
-
try {
|
|
364
|
-
const simulation = await connection.simulateTransaction(transaction, {
|
|
365
|
-
sigVerify: false,
|
|
366
|
-
replaceRecentBlockhash: true,
|
|
367
|
-
});
|
|
368
|
-
if (simulation.value.err) {
|
|
369
|
-
console.error("Transaction simulation failed:", simulation.value.err);
|
|
370
|
-
sonner_1.toast.error("Transaction simulation failed. Please check your balance and try again.");
|
|
371
|
-
return;
|
|
372
|
-
}
|
|
373
|
-
console.log("Transaction simulation successful. Compute units used:", simulation.value.unitsConsumed);
|
|
374
|
-
}
|
|
375
|
-
catch (simError) {
|
|
376
|
-
console.warn("Transaction simulation failed, proceeding anyway:", simError);
|
|
377
|
-
}
|
|
378
374
|
// Step 6: Sign and send transaction with priority fees
|
|
379
375
|
const signedTransaction = await phantom.signAndSendTransaction(transaction);
|
|
380
376
|
sonner_1.toast.success(`Transaction successful! Signature: ${signedTransaction.signature}`);
|
|
@@ -479,7 +475,9 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
|
|
|
479
475
|
sonner_1.toast.success("Copied to clipboard");
|
|
480
476
|
}, children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("strong", { className: "border-as-brand text-as-primary border-b-2 pb-1 text-2xl font-semibold sm:text-xl", children: [roundedUpSrcAmount, " ", srcToken.symbol] }), (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "text-as-primary/50 hover:text-as-primary h-5 w-5 cursor-pointer transition-all duration-200" })] }) }), (0, jsx_runtime_1.jsxs)(react_1.Badge, { variant: "outline", className: "flex h-10 items-center gap-2 px-3 py-1 pr-2 text-sm", children: ["on ", (0, anyspend_1.getChainName)(order.srcChain), (0, jsx_runtime_1.jsx)("img", { src: anyspend_1.ALL_CHAINS[order.srcChain].logoUrl, alt: (0, anyspend_1.getChainName)(order.srcChain), className: (0, utils_1.cn)("h-6 rounded-full", order.srcChain === chains_1.b3.id && "h-5 rounded-none") })] })] }), (0, jsx_runtime_1.jsx)("span", { className: "text-as-primary/50 mb-1 mt-2", children: " to the address:" })] }), (0, jsx_runtime_1.jsx)(react_1.CopyToClipboard, { text: order.globalAddress, onCopy: () => {
|
|
481
477
|
sonner_1.toast.success("Copied to clipboard");
|
|
482
|
-
}, children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-b3-react-background border-b3-react-border hover:border-as-brand group flex cursor-pointer items-center justify-between gap-4 rounded-lg border p-3 px-4 shadow-md transition-all duration-200", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-primary overflow-hidden text-ellipsis whitespace-nowrap text-sm", children: order.globalAddress }), (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "group-hover:text-as-brand text-as-primary/50 h-5 w-5 cursor-pointer transition-all duration-200" })] }) }), account?.address && !showQRCode ? ((0, jsx_runtime_1.jsxs)("div", { className: "mb-4 mt-8 flex w-full flex-col items-center gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full flex-col items-center gap-2", children: [(0, jsx_runtime_1.jsx)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-5/6 items-center gap-2 sm:px-0", disabled: txLoading || isSwitchingOrExecuting, onClick: handlePayment, children: txLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Transaction Pending", (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "ml-2 h-5 w-5 animate-spin" })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: "pl-4 text-lg md:text-sm", children: "Pay from Connected Wallet" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] })) }), (0, jsx_runtime_1.jsxs)("span", { className: "label-style text-as-primary/50 text-xs", children: ["Connected to:
|
|
478
|
+
}, children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-b3-react-background border-b3-react-border hover:border-as-brand group flex cursor-pointer items-center justify-between gap-4 rounded-lg border p-3 px-4 shadow-md transition-all duration-200", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-primary overflow-hidden text-ellipsis whitespace-nowrap text-sm", children: order.globalAddress }), (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "group-hover:text-as-brand text-as-primary/50 h-5 w-5 cursor-pointer transition-all duration-200" })] }) }), (account?.address || phantomWalletAddress) && !showQRCode ? ((0, jsx_runtime_1.jsxs)("div", { className: "mb-4 mt-8 flex w-full flex-col items-center gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full flex-col items-center gap-2", children: [(0, jsx_runtime_1.jsx)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-5/6 items-center gap-2 sm:px-0", disabled: txLoading || isSwitchingOrExecuting, onClick: handlePayment, children: txLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Transaction Pending", (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "ml-2 h-5 w-5 animate-spin" })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: "pl-4 text-lg md:text-sm", children: "Pay from Connected Wallet" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] })) }), (0, jsx_runtime_1.jsxs)("span", { className: "label-style text-as-primary/50 text-xs", children: ["Connected to:", " ", order.srcChain === anyspend_1.RELAY_SOLANA_MAINNET_CHAIN_ID && phantomWalletAddress
|
|
479
|
+
? (0, centerTruncate_1.default)(phantomWalletAddress, 6)
|
|
480
|
+
: (0, centerTruncate_1.default)(account?.address || "", 6)] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-col items-center gap-2", children: [(0, jsx_runtime_1.jsxs)(react_1.ShinyButton, { accentColor: colorMode === "dark" ? "#ffffff" : "#000000", className: "flex w-5/6 items-center gap-2 sm:px-0", onClick: () => setShowQRCode(true), children: [(0, jsx_runtime_1.jsx)("span", { className: "pl-4 text-lg md:text-sm", children: "Pay from a different wallet" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(react_3.WalletMetamask, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletPhantom, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletTrust, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletWalletConnect, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)("span", { className: "label-style text-as-primary/30 text-xs", children: "& more" })] })] })] })) : ((0, jsx_runtime_1.jsxs)(framer_motion_1.motion.div, { initial: { opacity: 0, filter: "blur(10px)" }, animate: { opacity: 1, filter: "blur(0px)" }, transition: { duration: 0.5, ease: "easeInOut" }, className: "flex w-full items-center justify-evenly gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mt-8 flex flex-col items-center rounded-lg bg-white p-6 pb-3", children: [(0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeSVG, { value: (0, anyspend_1.getPaymentUrl)(order.globalAddress, BigInt(order.srcAmount), order.srcTokenAddress === anyspend_1.RELAY_ETH_ADDRESS ? "ETH" : order.srcTokenAddress), className: "max-w-[200px]" }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-3 flex items-center justify-center gap-2 text-sm", children: [(0, jsx_runtime_1.jsx)("span", { className: "label-style text-as-brand/70 text-sm", children: "Scan with" }), (0, jsx_runtime_1.jsxs)(react_1.TextLoop, { interval: 3, children: [(0, jsx_runtime_1.jsx)(react_3.WalletMetamask, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletPhantom, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletTrust, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletWalletConnect, { className: "h-5 w-5", variant: "branded" })] })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-2", children: [account && ((0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "ghost", className: "text-as-primary w-full", onClick: handlePayment, children: ["Send Transaction ", (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "ml-2 h-4 w-4" })] })), anyspend_1.EVM_CHAINS[order.srcChain] ? ((0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", onClick: handlePayment, children: ["Open Metamask", (0, jsx_runtime_1.jsx)(react_3.WalletMetamask, { className: "ml-2 h-5 w-5", variant: "branded" })] })) : null, (0, jsx_runtime_1.jsx)("a", { href: handleCoinbaseRedirect(), children: (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", children: ["Open Coinbase", (0, jsx_runtime_1.jsx)(react_3.WalletCoinbase, { className: "ml-2 h-5 w-5", variant: "branded" })] }) }), (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", onClick: () => initiatePhantomTransfer(order.srcAmount, order.srcTokenAddress, order.globalAddress), children: ["Open Phantom", (0, jsx_runtime_1.jsx)(react_3.WalletPhantom, { className: "ml-2 h-5 w-5", variant: "branded" })] })] })] }))] })), (0, jsx_runtime_1.jsxs)("div", { className: "bg-as-light-brand/30 w-full rounded-lg p-4 sm:p-2 sm:px-4", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-as-secondary mb-3 text-sm", children: "Continue on another device?" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)(react_1.CopyToClipboard, { text: permalink, onCopy: () => {
|
|
483
481
|
sonner_1.toast.success("Copied to clipboard");
|
|
484
482
|
}, children: (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", children: ["Copy Link", (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "ml-2 h-3 w-3" })] }) }), (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", onClick: () => {
|
|
485
483
|
if (navigator.share) {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
-
import { ALL_CHAINS, capitalizeFirstLetter, EVM_CHAINS, getChainName, getErrorDisplay, getExplorerTxUrl, getPaymentUrl, getStatusDisplay, isNativeToken, RELAY_ETH_ADDRESS, } from "../../../../anyspend/index.js";
|
|
3
|
+
import { ALL_CHAINS, capitalizeFirstLetter, EVM_CHAINS, getChainName, getErrorDisplay, getExplorerTxUrl, getPaymentUrl, getStatusDisplay, isNativeToken, RELAY_ETH_ADDRESS, RELAY_SOLANA_MAINNET_CHAIN_ID, } from "../../../../anyspend/index.js";
|
|
4
4
|
import { Badge, Button, CopyToClipboard, ShinyButton, Skeleton, TextLoop, TextShimmer, useAccountWallet, useChainSwitchWithAction, useModalStore, useOnchainName, } from "../../../../global-account/react/index.js";
|
|
5
5
|
import { useRouter, useSearchParams } from "../../../../shared/react/hooks/index.js";
|
|
6
6
|
import { cn } from "../../../../shared/utils/index.js";
|
|
@@ -173,7 +173,12 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
|
|
|
173
173
|
// Main payment handler that triggers chain switch and payment
|
|
174
174
|
const handlePayment = async () => {
|
|
175
175
|
console.log("Initiating payment process. Target chain:", order.srcChain, "Current chain:", walletClient?.chain?.id);
|
|
176
|
-
|
|
176
|
+
if (order.srcChain === RELAY_SOLANA_MAINNET_CHAIN_ID) {
|
|
177
|
+
await initiatePhantomTransfer(order.srcAmount, order.srcTokenAddress, order.globalAddress);
|
|
178
|
+
}
|
|
179
|
+
else {
|
|
180
|
+
await switchChainAndExecute(order.srcChain, handlePaymentProcess);
|
|
181
|
+
}
|
|
177
182
|
};
|
|
178
183
|
// When waitingForDeposit is true, we show a message to the user to wait for the deposit to be processed.
|
|
179
184
|
const setWaitingForDeposit = useCallback(() => {
|
|
@@ -208,6 +213,16 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
|
|
|
208
213
|
}
|
|
209
214
|
}, [setWaitingForDeposit, txSuccess]);
|
|
210
215
|
const [showOrderDetails, setShowOrderDetails] = useState(false);
|
|
216
|
+
const isPhantomMobile = useMemo(() => navigator.userAgent.includes("Phantom"), []);
|
|
217
|
+
const isPhantomBrowser = useMemo(() => window.phantom?.solana?.isPhantom, []);
|
|
218
|
+
// Get connected Phantom wallet address if available
|
|
219
|
+
const phantomWalletAddress = useMemo(() => {
|
|
220
|
+
const phantom = window.phantom?.solana;
|
|
221
|
+
if (phantom?.isConnected && phantom?.publicKey) {
|
|
222
|
+
return phantom.publicKey.toString();
|
|
223
|
+
}
|
|
224
|
+
return null;
|
|
225
|
+
}, []);
|
|
211
226
|
if (!srcToken || !dstToken) {
|
|
212
227
|
return _jsx("div", { children: "Loading..." });
|
|
213
228
|
}
|
|
@@ -243,9 +258,6 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
|
|
|
243
258
|
};
|
|
244
259
|
const initiatePhantomTransfer = async (amountLamports, tokenAddress, recipientAddress) => {
|
|
245
260
|
try {
|
|
246
|
-
// Step 1: Check if Phantom is available
|
|
247
|
-
const isPhantomMobile = navigator.userAgent.includes("Phantom");
|
|
248
|
-
const isPhantomBrowser = window.phantom?.solana?.isPhantom;
|
|
249
261
|
if (!isPhantomBrowser && !isPhantomMobile) {
|
|
250
262
|
toast.error("Phantom wallet not installed. Please install Phantom wallet to continue.");
|
|
251
263
|
return;
|
|
@@ -353,22 +365,6 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
|
|
|
353
365
|
const { blockhash } = await connection.getLatestBlockhash("confirmed");
|
|
354
366
|
transaction.recentBlockhash = blockhash;
|
|
355
367
|
transaction.feePayer = fromPubkey;
|
|
356
|
-
// Optional: Simulate transaction to catch issues early
|
|
357
|
-
try {
|
|
358
|
-
const simulation = await connection.simulateTransaction(transaction, {
|
|
359
|
-
sigVerify: false,
|
|
360
|
-
replaceRecentBlockhash: true,
|
|
361
|
-
});
|
|
362
|
-
if (simulation.value.err) {
|
|
363
|
-
console.error("Transaction simulation failed:", simulation.value.err);
|
|
364
|
-
toast.error("Transaction simulation failed. Please check your balance and try again.");
|
|
365
|
-
return;
|
|
366
|
-
}
|
|
367
|
-
console.log("Transaction simulation successful. Compute units used:", simulation.value.unitsConsumed);
|
|
368
|
-
}
|
|
369
|
-
catch (simError) {
|
|
370
|
-
console.warn("Transaction simulation failed, proceeding anyway:", simError);
|
|
371
|
-
}
|
|
372
368
|
// Step 6: Sign and send transaction with priority fees
|
|
373
369
|
const signedTransaction = await phantom.signAndSendTransaction(transaction);
|
|
374
370
|
toast.success(`Transaction successful! Signature: ${signedTransaction.signature}`);
|
|
@@ -473,7 +469,9 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
|
|
|
473
469
|
toast.success("Copied to clipboard");
|
|
474
470
|
}, children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("strong", { className: "border-as-brand text-as-primary border-b-2 pb-1 text-2xl font-semibold sm:text-xl", children: [roundedUpSrcAmount, " ", srcToken.symbol] }), _jsx(Copy, { className: "text-as-primary/50 hover:text-as-primary h-5 w-5 cursor-pointer transition-all duration-200" })] }) }), _jsxs(Badge, { variant: "outline", className: "flex h-10 items-center gap-2 px-3 py-1 pr-2 text-sm", children: ["on ", getChainName(order.srcChain), _jsx("img", { src: ALL_CHAINS[order.srcChain].logoUrl, alt: getChainName(order.srcChain), className: cn("h-6 rounded-full", order.srcChain === b3.id && "h-5 rounded-none") })] })] }), _jsx("span", { className: "text-as-primary/50 mb-1 mt-2", children: " to the address:" })] }), _jsx(CopyToClipboard, { text: order.globalAddress, onCopy: () => {
|
|
475
471
|
toast.success("Copied to clipboard");
|
|
476
|
-
}, children: _jsxs("div", { className: "bg-b3-react-background border-b3-react-border hover:border-as-brand group flex cursor-pointer items-center justify-between gap-4 rounded-lg border p-3 px-4 shadow-md transition-all duration-200", children: [_jsx("div", { className: "text-as-primary overflow-hidden text-ellipsis whitespace-nowrap text-sm", children: order.globalAddress }), _jsx(Copy, { className: "group-hover:text-as-brand text-as-primary/50 h-5 w-5 cursor-pointer transition-all duration-200" })] }) }), account?.address && !showQRCode ? (_jsxs("div", { className: "mb-4 mt-8 flex w-full flex-col items-center gap-4", children: [_jsxs("div", { className: "relative flex w-full flex-col items-center gap-2", children: [_jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-5/6 items-center gap-2 sm:px-0", disabled: txLoading || isSwitchingOrExecuting, onClick: handlePayment, children: txLoading ? (_jsxs(_Fragment, { children: ["Transaction Pending", _jsx(Loader2, { className: "ml-2 h-5 w-5 animate-spin" })] })) : (_jsxs(_Fragment, { children: [_jsx("span", { className: "pl-4 text-lg md:text-sm", children: "Pay from Connected Wallet" }), _jsx(ChevronRight, { className: "h-4 w-4" })] })) }), _jsxs("span", { className: "label-style text-as-primary/50 text-xs", children: ["Connected to:
|
|
472
|
+
}, children: _jsxs("div", { className: "bg-b3-react-background border-b3-react-border hover:border-as-brand group flex cursor-pointer items-center justify-between gap-4 rounded-lg border p-3 px-4 shadow-md transition-all duration-200", children: [_jsx("div", { className: "text-as-primary overflow-hidden text-ellipsis whitespace-nowrap text-sm", children: order.globalAddress }), _jsx(Copy, { className: "group-hover:text-as-brand text-as-primary/50 h-5 w-5 cursor-pointer transition-all duration-200" })] }) }), (account?.address || phantomWalletAddress) && !showQRCode ? (_jsxs("div", { className: "mb-4 mt-8 flex w-full flex-col items-center gap-4", children: [_jsxs("div", { className: "relative flex w-full flex-col items-center gap-2", children: [_jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-5/6 items-center gap-2 sm:px-0", disabled: txLoading || isSwitchingOrExecuting, onClick: handlePayment, children: txLoading ? (_jsxs(_Fragment, { children: ["Transaction Pending", _jsx(Loader2, { className: "ml-2 h-5 w-5 animate-spin" })] })) : (_jsxs(_Fragment, { children: [_jsx("span", { className: "pl-4 text-lg md:text-sm", children: "Pay from Connected Wallet" }), _jsx(ChevronRight, { className: "h-4 w-4" })] })) }), _jsxs("span", { className: "label-style text-as-primary/50 text-xs", children: ["Connected to:", " ", order.srcChain === RELAY_SOLANA_MAINNET_CHAIN_ID && phantomWalletAddress
|
|
473
|
+
? centerTruncate(phantomWalletAddress, 6)
|
|
474
|
+
: centerTruncate(account?.address || "", 6)] })] }), _jsxs("div", { className: "flex w-full flex-col items-center gap-2", children: [_jsxs(ShinyButton, { accentColor: colorMode === "dark" ? "#ffffff" : "#000000", className: "flex w-5/6 items-center gap-2 sm:px-0", onClick: () => setShowQRCode(true), children: [_jsx("span", { className: "pl-4 text-lg md:text-sm", children: "Pay from a different wallet" }), _jsx(ChevronRight, { className: "h-4 w-4" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(WalletMetamask, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletPhantom, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletTrust, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletWalletConnect, { className: "h-5 w-5", variant: "branded" }), _jsx("span", { className: "label-style text-as-primary/30 text-xs", children: "& more" })] })] })] })) : (_jsxs(motion.div, { initial: { opacity: 0, filter: "blur(10px)" }, animate: { opacity: 1, filter: "blur(0px)" }, transition: { duration: 0.5, ease: "easeInOut" }, className: "flex w-full items-center justify-evenly gap-4", children: [_jsxs("div", { className: "mt-8 flex flex-col items-center rounded-lg bg-white p-6 pb-3", children: [_jsx(QRCodeSVG, { value: getPaymentUrl(order.globalAddress, BigInt(order.srcAmount), order.srcTokenAddress === RELAY_ETH_ADDRESS ? "ETH" : order.srcTokenAddress), className: "max-w-[200px]" }), _jsxs("div", { className: "mt-3 flex items-center justify-center gap-2 text-sm", children: [_jsx("span", { className: "label-style text-as-brand/70 text-sm", children: "Scan with" }), _jsxs(TextLoop, { interval: 3, children: [_jsx(WalletMetamask, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletPhantom, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletTrust, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletWalletConnect, { className: "h-5 w-5", variant: "branded" })] })] })] }), _jsxs("div", { className: "flex flex-col gap-2", children: [account && (_jsxs(Button, { variant: "ghost", className: "text-as-primary w-full", onClick: handlePayment, children: ["Send Transaction ", _jsx(ChevronRight, { className: "ml-2 h-4 w-4" })] })), EVM_CHAINS[order.srcChain] ? (_jsxs(Button, { variant: "outline", className: "w-full", onClick: handlePayment, children: ["Open Metamask", _jsx(WalletMetamask, { className: "ml-2 h-5 w-5", variant: "branded" })] })) : null, _jsx("a", { href: handleCoinbaseRedirect(), children: _jsxs(Button, { variant: "outline", className: "w-full", children: ["Open Coinbase", _jsx(WalletCoinbase, { className: "ml-2 h-5 w-5", variant: "branded" })] }) }), _jsxs(Button, { variant: "outline", className: "w-full", onClick: () => initiatePhantomTransfer(order.srcAmount, order.srcTokenAddress, order.globalAddress), children: ["Open Phantom", _jsx(WalletPhantom, { className: "ml-2 h-5 w-5", variant: "branded" })] })] })] }))] })), _jsxs("div", { className: "bg-as-light-brand/30 w-full rounded-lg p-4 sm:p-2 sm:px-4", children: [_jsx("p", { className: "text-as-secondary mb-3 text-sm", children: "Continue on another device?" }), _jsxs("div", { className: "flex items-center gap-4", children: [_jsx(CopyToClipboard, { text: permalink, onCopy: () => {
|
|
477
475
|
toast.success("Copied to clipboard");
|
|
478
476
|
}, children: _jsxs(Button, { variant: "outline", className: "w-full", children: ["Copy Link", _jsx(Copy, { className: "ml-2 h-3 w-3" })] }) }), _jsxs(Button, { variant: "outline", className: "w-full", onClick: () => {
|
|
479
477
|
if (navigator.share) {
|
package/package.json
CHANGED
|
@@ -11,6 +11,7 @@ import {
|
|
|
11
11
|
getStatusDisplay,
|
|
12
12
|
isNativeToken,
|
|
13
13
|
RELAY_ETH_ADDRESS,
|
|
14
|
+
RELAY_SOLANA_MAINNET_CHAIN_ID,
|
|
14
15
|
} from "@b3dotfun/sdk/anyspend";
|
|
15
16
|
import { components } from "@b3dotfun/sdk/anyspend/types/api";
|
|
16
17
|
import {
|
|
@@ -278,7 +279,11 @@ export const OrderDetails = memo(function OrderDetails({
|
|
|
278
279
|
// Main payment handler that triggers chain switch and payment
|
|
279
280
|
const handlePayment = async () => {
|
|
280
281
|
console.log("Initiating payment process. Target chain:", order.srcChain, "Current chain:", walletClient?.chain?.id);
|
|
281
|
-
|
|
282
|
+
if (order.srcChain === RELAY_SOLANA_MAINNET_CHAIN_ID) {
|
|
283
|
+
await initiatePhantomTransfer(order.srcAmount, order.srcTokenAddress, order.globalAddress);
|
|
284
|
+
} else {
|
|
285
|
+
await switchChainAndExecute(order.srcChain, handlePaymentProcess);
|
|
286
|
+
}
|
|
282
287
|
};
|
|
283
288
|
|
|
284
289
|
// When waitingForDeposit is true, we show a message to the user to wait for the deposit to be processed.
|
|
@@ -321,6 +326,18 @@ export const OrderDetails = memo(function OrderDetails({
|
|
|
321
326
|
|
|
322
327
|
const [showOrderDetails, setShowOrderDetails] = useState(false);
|
|
323
328
|
|
|
329
|
+
const isPhantomMobile = useMemo(() => navigator.userAgent.includes("Phantom"), []);
|
|
330
|
+
const isPhantomBrowser = useMemo(() => (window as any).phantom?.solana?.isPhantom, []);
|
|
331
|
+
|
|
332
|
+
// Get connected Phantom wallet address if available
|
|
333
|
+
const phantomWalletAddress = useMemo(() => {
|
|
334
|
+
const phantom = (window as any).phantom?.solana;
|
|
335
|
+
if (phantom?.isConnected && phantom?.publicKey) {
|
|
336
|
+
return phantom.publicKey.toString();
|
|
337
|
+
}
|
|
338
|
+
return null;
|
|
339
|
+
}, []);
|
|
340
|
+
|
|
324
341
|
if (!srcToken || !dstToken) {
|
|
325
342
|
return <div>Loading...</div>;
|
|
326
343
|
}
|
|
@@ -366,10 +383,6 @@ export const OrderDetails = memo(function OrderDetails({
|
|
|
366
383
|
|
|
367
384
|
const initiatePhantomTransfer = async (amountLamports: string, tokenAddress: string, recipientAddress: string) => {
|
|
368
385
|
try {
|
|
369
|
-
// Step 1: Check if Phantom is available
|
|
370
|
-
const isPhantomMobile = navigator.userAgent.includes("Phantom");
|
|
371
|
-
const isPhantomBrowser = (window as any).phantom?.solana?.isPhantom;
|
|
372
|
-
|
|
373
386
|
if (!isPhantomBrowser && !isPhantomMobile) {
|
|
374
387
|
toast.error("Phantom wallet not installed. Please install Phantom wallet to continue.");
|
|
375
388
|
return;
|
|
@@ -515,22 +528,6 @@ export const OrderDetails = memo(function OrderDetails({
|
|
|
515
528
|
transaction.recentBlockhash = blockhash;
|
|
516
529
|
transaction.feePayer = fromPubkey;
|
|
517
530
|
|
|
518
|
-
// Optional: Simulate transaction to catch issues early
|
|
519
|
-
try {
|
|
520
|
-
const simulation = await connection.simulateTransaction(transaction, {
|
|
521
|
-
sigVerify: false,
|
|
522
|
-
replaceRecentBlockhash: true,
|
|
523
|
-
});
|
|
524
|
-
if (simulation.value.err) {
|
|
525
|
-
console.error("Transaction simulation failed:", simulation.value.err);
|
|
526
|
-
toast.error("Transaction simulation failed. Please check your balance and try again.");
|
|
527
|
-
return;
|
|
528
|
-
}
|
|
529
|
-
console.log("Transaction simulation successful. Compute units used:", simulation.value.unitsConsumed);
|
|
530
|
-
} catch (simError) {
|
|
531
|
-
console.warn("Transaction simulation failed, proceeding anyway:", simError);
|
|
532
|
-
}
|
|
533
|
-
|
|
534
531
|
// Step 6: Sign and send transaction with priority fees
|
|
535
532
|
const signedTransaction = await phantom.signAndSendTransaction(transaction);
|
|
536
533
|
|
|
@@ -978,7 +975,7 @@ export const OrderDetails = memo(function OrderDetails({
|
|
|
978
975
|
</div>
|
|
979
976
|
</CopyToClipboard>
|
|
980
977
|
|
|
981
|
-
{account?.address && !showQRCode ? (
|
|
978
|
+
{(account?.address || phantomWalletAddress) && !showQRCode ? (
|
|
982
979
|
<div className="mb-4 mt-8 flex w-full flex-col items-center gap-4">
|
|
983
980
|
<div className="relative flex w-full flex-col items-center gap-2">
|
|
984
981
|
<ShinyButton
|
|
@@ -1001,7 +998,10 @@ export const OrderDetails = memo(function OrderDetails({
|
|
|
1001
998
|
)}
|
|
1002
999
|
</ShinyButton>
|
|
1003
1000
|
<span className="label-style text-as-primary/50 text-xs">
|
|
1004
|
-
Connected to:
|
|
1001
|
+
Connected to:{" "}
|
|
1002
|
+
{order.srcChain === RELAY_SOLANA_MAINNET_CHAIN_ID && phantomWalletAddress
|
|
1003
|
+
? centerTruncate(phantomWalletAddress, 6)
|
|
1004
|
+
: centerTruncate(account?.address || "", 6)}
|
|
1005
1005
|
</span>
|
|
1006
1006
|
</div>
|
|
1007
1007
|
|