useUnclaimedNFTs

Hook for fetching information about all NFTs that haven't been claimed yet from an NFT Drop contract.

Available to use on contracts that implement the ERC721LazyMintable interface.

import { useUnclaimedNFTs } from "@thirdweb-dev/react";

const { data, isLoading, error } = useUnclaimedNFTs(contract);

Usage

Provide your contract instance as the first argument.

import { useUnclaimedNFTs, useContract } from "@thirdweb-dev/react";

// Your smart contract address
const contractAddress = "{{contract_address}}";

function App() {
  const { contract } = useContract(contractAddress);
  const { data, isLoading, error } = useUnclaimedNFTs(contract);
}

Configuration

queryParams (optional)

By default, the hook returns the first 100 unclaimed NFTs from the contract.

Paginate the results by providing a queryParams object as the second argument.

import { useUnclaimedNFTs, useContract } from "@thirdweb-dev/react";

// Your smart contract address
const contractAddress = "{{contract_address}}";

function App() {
  const { contract } = useContract(contractAddress);
  const { data, isLoading, error } = useUnclaimedNFTs(
    contract,
    {
      count: 10, // Limit the number of results
      start: 0, // Start from the nth result (useful for pagination)
    },
  );
}

Return Value

Return Value

The hook's data property, once loaded, contains an array of NFTMetadata objects.

{
  name?: string | number | undefined;
  description?: string | null | undefined;
  image?: string | null | undefined;
  external_url?: string | null | undefined;
  animation_url?: string | null | undefined;
  background_color?: string | undefined;
  properties?: {
      [x: string]: unknown;
  } | {
      [x: string]: unknown;
  }[] | undefined;
  id: string;
  uri: string;
}[]