Marketplace Data Hooks

Collection of GET hooks for retrieving key Marketplace data. Useful for fetching and managing Marketplace information in your UI.

useMarketplaceConfig

The useMarketplaceConfig hook retrieves your Marketplace’s configuration, including collections, social links, title, and other settings from Builder.

import { useMarketplaceConfig } from "@0xsequence/marketplace-sdk/react";

## Into your React component:

const data = useMarketplaceConfig();

useMarketplaceConfig

* return properties

Show child attributes

publisherId · string

Unique identifier of the marketplace publisher.

title · string

The title of the marketplace.

shortDescription · string

A brief description of the marketplace.

socials · MarketplaceSocials

Social media links associated with the marketplace.

faviconUrl · string

URL of the marketplace’s favicon.

landingBannerUrl · string

URL of the Marketplace banner for landing page

collections · MarketplaceCollection[]

Array of collections from the marketplace.

walletOptions · MarketplaceWalletOptions

Configuration options for wallet integrations.

landingPageLayout · string

Layout configuration for the marketplace’s landing page.

logoUrl · string

URL of the marketplace’s logo.

bannerUrl · string

URL of the marketplace’s banner.

fontUrl · string | undefined

URL of the custom font used in the marketplace.

ogImage · string | undefined

URL of the ogImage

cssString · string

Custom CSS styles for the marketplace.

manifestUrl · string

URL of the marketplace manifest file.

useListCollectibles

The useListCollectibles hook retrieves the current listings and offers in a collection from your Marketplace. Useful for accessing and managing listings and offers efficiently.

import { OrderSide } from '@0xsequence/marketplace-sdk';
import { useListCollectibles } from '@0xsequence/marketplace-sdk/react';

## Into your React component:

const {
  data: collectibles,
  isLoading: collectiblesLoading,
  fetchNextPage: fetchNextCollectibles,
} = useListCollectibles({
  chainId,
  collectionAddress,
  filter: {
    // # Optional filters
    includeEmpty,
    searchText,
    properties,
  },
  side: OrderSide.listing,
});

const collectiblesFlat =
  collectibles?.pages.flatMap((p) => p.collectibles) ?? [];

return (
  <div>
    {collectiblesFlat?.map((collectible) => (
      // Your Collectibles component
    ))}
  </div>
);

useListCollectibles

* params

Show child attributes

interface UseListCollectiblesArgs {
  chainId: string;
  side: OrderSide;
  collectionAddress: `0x${string}`;
  page?: {
    page: number;
    pageSize: number;
    sort?: {
      order: SortOrder$1;
      column: string;
    }[];
    more?: boolean;
  };
  filter?: {
    includeEmpty: boolean;
    searchText?: string;
    properties?: {
      type: PropertyType;
      name: string;
      values?: any[];
      max?: number;
      min?: number;
    }[];
    marketplaces?: MarketplaceKind[];
    inAccounts?: string[];
    notInAccounts?: string[];
    ordersCreatedBy?: string[];
    ordersNotCreatedBy?: string[];
  };
  query?: {
    enabled?: boolean;
  };
}

* return properties

Show child attributes

data · ListCollectiblesReturn

Contains the paginated collectible orders data.

data.pages · CollectibleOrder[]

List of collectible orders returned in pages.

isLoading · boolean

Indicates whether the data is currently loading.

fetchNextPage · (options?: FetchNextPageOptions) => Promise<UseInfiniteQueryResult>

This function allows you to fetch the next “page” of results.

useListCollectiblesPaginated

The useListCollectiblesPaginated hook efficiently retrieves and manages current listings and offers from your Marketplace, making it ideal for displaying paginated NFTs within a collection.

import { OrderSide } from '@0xsequence/marketplace-sdk';
import { useListCollectiblesPaginated } from '@0xsequence/marketplace-sdk/react';

const chainId = 137;
const searchText = "";
const enabled = true;
const includeEmpty = true;
const properties = [];
const pageSize = 30;
const currentPage = 1;
const collectionAddress = "0x0e5566a108e617baedbebb44e3fcc7bf03e3a839";

## Into your React component:

const {
    data: collectiblesResponse,
    isLoading: collectiblesLoading,
} = useListCollectiblesPaginated({
  chainId: String(chainId),
  collectionAddress,
  side: OrderSide.listing,
  filter: {
    // # Optional filters
    includeEmpty,
    searchText,
    properties,
  },
  page: {
    page: currentPage,
    pageSize,
  },
  query: {
    page: currentPage,
    pageSize,
    enabled,
  },
});

const collectiblesList = collectiblesResponse?.collectibles ?? [];

return (
  <div>
    {collectiblesList?.map((collectible) => (
      // Your Collectibles component
    ))}
  </div>
);

useListCollectiblesPaginated details

* params

Show child attributes

interface UseListCollectiblesPaginatedArgs {
  chainId: string;
  side: OrderSide;
  collectionAddress: `0x${string}`;
  page?: {
    page: number;
    pageSize: number;
    sort?: {
      order: SortOrder$1;
      column: string;
    }[];
    more?: boolean;
  };
  filter?: {
    includeEmpty: boolean;
    searchText?: string;
    properties?: {
      type: PropertyType;
      name: string;
      values?: any[];
      max?: number;
      min?: number;
    }[];
    marketplaces?: MarketplaceKind[];
    inAccounts?: string[];
    notInAccounts?: string[];
    ordersCreatedBy?: string[];
    ordersNotCreatedBy?: string[];
  };
  query: {
    page: number;
    pageSize: number;
    enabled?: boolean;
  };
}

* return properties

Show child attributes

data · ListCollectiblesReturn

Contains the collectible orders data.

data.collectibles · CollectibleOrder[]

List of collectible orders.

isLoading · boolean

Indicates whether the data is currently loading.

useCountOfCollectables

The useCountOfCollectables hook returns the number of NFTs in a collection.

import { OrderSide } from '@0xsequence/marketplace-sdk';
import { useCountOfCollectables } from '@0xsequence/marketplace-sdk/react';

const countOfCollectables = useCountOfCollectables({
  chainId,
  collectionAddress,
  side: OrderSide.listing,
  filter: {
    searchText: text,
    includeEmpty,
    properties,
  },
});

useCountOfCollectables details

* params

Show child attributes

interface UseCountOfCollectables {
  chainId: ChainId;
  collectionAddress: CollectionAddress;
  query?: { enabled?: boolean };
  filter?: {
    includeEmpty: boolean;
    searchText?: string;
    properties?: {
      name: string;
      type: PropertyType;
      min?: number;
      max?: number;
      values?: any[];
    }[];
    marketplaces?: MarketplaceKind[];
    inAccounts?: string[];
    notInAccounts?: string[];
    ordersCreatedBy?: string[];
    ordersNotCreatedBy?: string[];
  };
  side?: OrderSide;
}

* return properties

Show child attributes

data · number

Numeric response data.

isLoading · boolean

Indicates whether the data is currently loading.