useCheckoutModal

import { useCheckoutModal } from '@0xsequence/checkout'

import { useCheckoutModal } from '@0xsequence/checkout'
import { polygon } from 'viem/chains'
import { useAccount } from 'wagmi'

function Home() {
  const { address } = useAccount()
  const { triggerCheckout, closeCheckout, settings } = useCheckoutModal()

  const handleCheckout = () => {
    // NFT purchase settings
    const chainId = polygon.id
    const orderbookAddress = '0xfdb42A198a932C8D3B506Ffa5e855bC4b348a712'
    const nftQuantity = '1'
    const tokenContractAddress = '0xabcdef...' // NFT contract address
    const tokenId = '123' // NFT token ID

    triggerCheckout({
      creditCardCheckout: {
        chainId,
        contractAddress: orderbookAddress,
        recipientAddress: address || '',
        currencyQuantity: '100000',
        currencySymbol: 'USDC',
        currencyAddress: '0x3c499c542cef5e3811e1192ce70d8cc03d5c3359',
        currencyDecimals: '6',
        nftId: tokenId,
        nftAddress: tokenContractAddress,
        nftQuantity,
        approvedSpenderAddress: orderbookAddress,
        calldata: "0x...",
        onSuccess: (txHash) => console.log('Success!', txHash)
      },
      orderSummaryItems: [
        {
          chainId: chainId,
          contractAddress: orderbookAddress,
          quantityRaw: nftQuantity,
          tokenId: tokenId,
        }
      ]
    })
  }

  return (
    <button onClick={handleCheckout}>
      Checkout
    </button>
  )
}

export default Home