useCheckoutModal

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

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

function App() {
  const { address } = useAccount()
  const { triggerCheckout } = useCheckoutModal()
  
  const handleCheckout = () => {
    // NFT purchase settings
    const chainId = ChainId.POLYGON
    const orderbookAddress = '0xfdb42A198a932C8D3B506Ffa5e855bC4b348a712'
    const nftQuantity = '1'
    const orderId = 'your-order-id'
    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: [
        {
          title: 'NFT #' + tokenId,
          subtitle: 'Your Collection',
          imageUrl: 'https://example.com/nft.png'
        }
      ]
    })
  }
  
  return (
    <button onClick={handleCheckout}>
      Checkout
    </button>
  )
}

type UseCheckoutModalReturnType = {
  triggerCheckout: (settings: CheckoutSettings) => void
  closeCheckout: () => void
  settings: CheckoutSettings | undefined
}