useCreateNFT
Hook for creating an NFT, accessing the active process step as well as the transaction hash
Usage
import { CreateNftStep, useCreateNFT } from '@nft/hooks'
import React from 'react'
export default function Component() {
const signer = undefined // type of "Signer & TypedDataSigner" Get the signer from the wallet. Need to be an Ethers Signer (https://docs.ethers.io/v5/api/signer/)
const [createNFT, { activeStep, transactionHash }] = useCreateNFT(signer, {
uploadUrl: 'Your liteflow upload URL',
})
const handleClick = async () => {
await createNFT({
chainId: 1, // chainId of the network to mint on
collectionAddress: '0x0000', // address of the collection to use
name: 'Azuki #1', // name of the NFT
description: 'Take the red bean to join the garden.', // description of the NFT
content: azukiImage, // content file uploaded by the user
isAnimation: false, // set to true if content file is a video. Require to set preview
isPrivate: false, // set to true if content is private. Require to set preview.
// optional
amount: 1, // number of NFT to create. Require ERC1155
royalties: 10, // royalty amount in percentage
preview: azukiImagePreview, // preview in the case of private or animation content uploaded by user
traits: [
{ type: 'Head', value: 'Cap' },
{ type: 'Body', value: 'Samurai' },
], // Array of traits associated to the NFT
})
}
return (
<>
{activeStep === CreateNftStep.INITIAL && (
<button onClick={handleClick}>Create NFT</button>
)}
{activeStep === CreateNftStep.UPLOAD && <p>Images are uploading</p>}
{activeStep === CreateNftStep.LAZYMINT_SIGNATURE && (
<p>Please sign transaction for lazy mint in wallet</p>
)}
{activeStep === CreateNftStep.LAZYMINT_PENDING && (
<p>Transaction for lazy mint is pending</p>
)}
{activeStep === CreateNftStep.TRANSACTION_SIGNATURE && (
<p>Please sign transaction in wallet</p>
)}
{activeStep === CreateNftStep.TRANSACTION_PENDING && (
<p>Transaction is pending</p>
)}
{activeStep === CreateNftStep.OWNERSHIP && <p>Verifying ownership</p>}
{transactionHash && <p>Transaction hash is {transactionHash}</p>}
</>
)
}
Configuration
useCreateNFT(
signer: Signer & TypedDataSigner, // Ethers signer: https://docs.ethers.io/v5/api/signer/
{
uploadUrl: string, // Your Liteflow API upload url
}
)
Return values
[
({
chainId: number
collectionAddress: string
name: string
description: string
content: File
preview?: File
isAnimation: boolean
isPrivate: boolean
amount?: number
royalties?: number
traits?: { type: string; value: string }[]
}) => Promise<string>, // createNFT function
{
activeStep: CreateNftStep, // steps of the NFT creation process
transactionHash: string | undefined // returns the transaction hash after transaction has been placed on the blockchain
}
]
createNFT
Function to create an NFT. It returns the created NFT ID.
Arguments:
{
chainId: Number, // id of the chain to mint on
collectionAddress: string, // address of the collection to mint on
name: string, // name of the NFT
description: string, // description of the NFT
content: File, // content file uploaded by the user
preview?: File, // preview in the case of private or animation content uploaded by user
isAnimation: boolean, // set to true if content file is a video. Require to set preview
isPrivate: boolean, // set to true if content is private. Require to set preview.
amount?: number, // number of NFT to create. Require ERC1155
royalties?: number, // royalty amount in percentage
traits?: { type: string, value: string }[] // Array of traits associated to the NFT
}
activeStep
The status of the transaction as an enum CreateNftStep
executed in this order. Once the NFT creation has been complete the state returns to CreateNftStep.INITIAL
enum CreateNftStep {
INITIAL, // Default
UPLOAD, // Upload has started
LAZYMINT_SIGNATURE, // Asking signature for lazy mint (only for lazy mint)
LAZYMINT_PENDING, // Lazy mint is pending (only for lazy mint)
TRANSACTION_SIGNATURE, // Transaction has been initiated (only for normal mint)
TRANSACTION_PENDING, // Transaction is pending (only for normal mint)
OWNERSHIP, // Ownership is being verified (only for normal mint)
}
transactionHash
The hash of the blockchain transaction of the created NFT. This is only accessible after the approval of the transaction (after CreateNftStep.TRANSACTION_SIGNATURE
)