Import
import { useERC1155SaleContractCheckout } from '@0xsequence/checkout'
Usage
import { useERC1155SaleContractCheckout } from "@0xsequence/checkout"
import { useAccount } from "wagmi"
function App() {
const { address: userAddress } = useAccount()
const { openCheckoutModal } = useERC1155SaleContractCheckout({
chain: 80001, // chainId of the chain the collectible is on
contractAddress: "0x0327b2f274e04d292e74a06809bcd687c63a4ba4", // address of the contract handling the minting function
wallet: userAddress!, // address of the recipient
collectionAddress: "0x888a322db4b8033bac3ff84412738c096f87f9d0", // address of the collection contract
items: [
// array of collectibles to purchase
{
tokenId: "0",
quantity: "1",
},
],
onSuccess: (txnHash: string) => {
console.log("success!", txnHash)
},
onError: (error: Error) => {
console.error(error)
},
})
const onClick = () => {
if (!userAddress) {
return
}
openCheckoutModal()
}
return <button onClick={onClick}>Buy ERC-1155 collectible!</button>
}
Return Type: UseERC1155SaleContractCheckoutReturnType
The hook returns an object with the following properties:
interface UseERC1155SaleContractCheckoutReturnType {
openCheckoutModal: () => void
closeCheckoutModal: () => void
selectPaymentSettings?: SelectPaymentSettings
isLoading: boolean
isError: boolean
}
Properties
openCheckoutModal
() => void
Function to open the checkout modal with the configured ERC-1155 purchase.
closeCheckoutModal
() => void
Function to close the checkout modal.
selectPaymentSettings
SelectPaymentSettings | undefined
export interface SelectPaymentSettings {
collectibles: Collectible[]
chain: number | string
currencyAddress: string | Hex
price: string
targetContractAddress: string | Hex
txData: Hex
collectionAddress: string | Hex
recipientAddress: string | Hex
approvedSpenderAddress?: string
transactionConfirmations?: number
onSuccess?: (txHash: string) => void
onError?: (error: Error) => void
onClose?: () => void
enableMainCurrencyPayment?: boolean
enableSwapPayments?: boolean
enableTransferFunds?: boolean
creditCardProviders?: string[]
copyrightText?: string
transakConfig?: TransakConfig
customProviderCallback?: (onSuccess: (txHash: string) => void, onError: (error: Error) => void, onClose: () => void) => void
supplementaryAnalyticsInfo?: SupplementaryAnalyticsInfo
}
The current payment settings configuration for the modal.
isLoading
boolean
Whether the contract data is still loading.
isError
boolean
Whether there was an error loading the contract data.
Parameters
The hook accepts a configuration object with the following properties:
Parameter | Type | Description |
---|
chain | number | Chain ID where the sale contract is deployed |
contractAddress | string | Address of the ERC-1155 sale contract |
wallet | string | Address of the wallet that will receive the NFTs |
collectionAddress | string | Address of the ERC-1155 token contract |
items | Array<{tokenId: string, quantity: string}> | Array of token IDs and quantities to purchase |
onSuccess | (txnHash: string) => void | (Optional) Callback function when the transaction is successful |
onError | (error: Error) => void | (Optional) Callback function when an error occurs |
onClose | () => void | (Optional) Callback function when the modal is closed |
Notes
This hook simplifies the process of purchasing ERC-1155 tokens by automatically:
- Fetching price information from the sale contract
- Determining payment options (crypto, credit card, etc.)
- Generating the proper transaction data
- Opening and managing the checkout modal
Deprecation Notice
The useERC1155SaleContractPaymentModal
hook is deprecated. Use useERC1155SaleContractCheckout
instead.