Skip to main content

useActiveListings

Hook for fetching all active listings from a Marketplace contract. "Active" means the listing is not canceled, expired, or sold.

Marketplace V3

Note: This hook is only for Marketplace contracts.

For Marketplace V3 contracts, use useValidDirectListings or useValidEnglishAuctions instead.

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

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

Usage

Provide your marketplace contract as the argument to the hook.

The returned data contains both kinds of listings; auctions and direct.

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

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

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

Configuration

filter (optional)

By default, the hook returns all active listings from the marketplace.

You can filter the results by providing a filter object as the second argument.

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

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

function App() {
const { contract } = useContract(contractAddress, "marketplace");

const { data, isLoading, error } = useActiveListings(
contract,
{
seller: "{{wallet_address}}", // Filter by seller
tokenContract: "{{contract_address}}", // Filter by token contract
offeror: "{{wallet_address}}", // Filter by offeror
tokenId: "{{token_id}}", // Filter by token ID
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, returns an array containing both AuctionListing and DirectListing objects. Use the type property to determine which type of listing each one is.

(AuctionListing | DirectListing)[]

// Properties available on both listing types below...

AuctionListing {
// The id of the listing
id: string;

// The address of the asset being listed.
assetContractAddress: string;

// The ID of the token to list.
tokenId: BigNumberish;

// The asset being listed.
asset: NFTMetadata;

// The start time of the listing.
startTimeInEpochSeconds: BigNumberish;

// Number of seconds until the auction expires.
endTimeInEpochSeconds: BigNumberish;

// The quantity of tokens in the listing.
// For ERC721s, this value should always be 1
quantity: BigNumberish;

// The address of the currency to accept for the listing.
currencyContractAddress: string;

// The reserve price is the minimum price that a bid must be in order to be accepted.
reservePrice: BigNumber;

// The buyout price of the listing.
buyoutPrice: BigNumber;

// The `CurrencyValue` of the buyout price listing.
// Useful for displaying the price information.
buyoutCurrencyValuePerToken: CurrencyValue;

// The `CurrencyValue` of the reserve price.
// Useful for displaying the price information.
reservePriceCurrencyValuePerToken: CurrencyValue;

// The address of the seller.
sellerAddress: string;

// Listing type Enum
type: ListingType.Auction;
}


DirectListing {
// The id of the listing.
id: string;

//The address of the asset being listed.
assetContractAddress: string;

// The ID of the token to list.
tokenId: BigNumberish;

//The asset being listed.
asset: NFTMetadata;

//The start time of the listing.
startTimeInSeconds: BigNumberish;

//Number of seconds until the listing expires.
secondsUntilEnd: BigNumberish;

// The quantity of tokens to include in the listing.
// For ERC721s, this value should always be 1
quantity: BigNumberish;

// The address of the currency to accept for the listing.
currencyContractAddress: string;

// The `CurrencyValue` of the listing. Useful for displaying the price information.
buyoutCurrencyValuePerToken: CurrencyValue;

// The buyout price of the listing.
buyoutPrice: BigNumber;

// The address of the seller.
sellerAddress: string;

// Listing type Enum
type: ListingType.Direct;
}