import { Fund } from '0xtrails'
import { svmAdapter } from '@0xtrails/svm'
import { useConnection, useWallet } from '@solana/wallet-adapter-react'
import { Transaction, VersionedTransaction } from '@solana/web3.js'
import { useMemo } from 'react'
function deserializeTransaction(bytes: Uint8Array) {
try {
return VersionedTransaction.deserialize(bytes)
} catch {
return Transaction.from(bytes)
}
}
function Checkout() {
const { connection } = useConnection()
const { connected, publicKey, wallet, signTransaction } = useWallet()
const solanaWallet = useMemo(
() => ({
connected,
publicKey,
walletName: wallet?.adapter.name ?? 'Solana Wallet',
walletIcon: wallet?.adapter.icon,
connection: {
getLatestBlockhash: (commitment?: string) =>
connection.getLatestBlockhash(commitment as never),
sendRawTransaction: (transaction: unknown) =>
connection.sendRawTransaction(transaction as Uint8Array),
},
signSerializedTransaction: async (bytes: Uint8Array) => {
if (!signTransaction) {
throw new Error('Connected Solana wallet cannot sign transactions')
}
const signed = await signTransaction(deserializeTransaction(bytes))
return signed.serialize()
},
}),
[connected, connection, publicKey, signTransaction, wallet],
)
return (
<Fund
apiKey="YOUR_API_KEY"
adapters={[svmAdapter({ wallet: solanaWallet })]}
from={{token: "USDC", chain: "solana", amount: "100"}}
to={{token: "ETH", chain: "ethereum"}}
/>
)
}