Skip to content
On this page

useListing ​

Definition ​

Basic usage ​

ts
const { 
 getInitialListing,
 getCurrentListing,
 getElements,
 getSortingOrders,
 getCurrentSortingOrder,
 getCurrentPage,
 getTotal,
 getTotalPagesCount,
 getLimit,
 getInitialFilters,
 getAvailableFilters,
 getCurrentFilters,
 loading,
 loadingMore,
 setInitialListing,
 initSearch,
 search,
 loadMore,
 changeCurrentSortingOrder,
 changeCurrentPage,
 setCurrentFilters,
 resetFilters,
 filtersToQuery 
} = useListing(params);

Signature ​

ts
export function useListing(params?: {
  listingType: ListingType;
  categoryId?: string;
  defaultSearchCriteria?: operations["searchPage post /search"]["body"];
}): UseListingReturn 

Parameters ​

NameTypeDescription
params
{
  listingType: ListingType;
  categoryId?: string;
  defaultSearchCriteria?: operations["searchPage post /search"]["body"];
}

Return type ​

See UseListingReturn
ts
export type UseListingReturn = {
  /**
   * Listing that is currently set
   * {@link ListingResult} object
   */
  getInitialListing: ComputedRef<Schemas["ProductListingResult"] | null>;
  /**
   * Sets the initial listing - available synchronously
   * @param {@link initialListing} - initial listing to set
   * @returns
   */
  setInitialListing(
    initialListing: Schemas["ProductListingResult"],
  ): Promise<void>;
  /**
   * @deprecated - use `search` instead
   * Searches for the listing based on the criteria
   * @param criteria {@link Schemas['Criteria']}
   * @returns
   */
  initSearch(
    criteria: operations["searchPage post /search"]["body"],
  ): Promise<Schemas["ProductListingResult"]>;
  /**
   * Searches for the listing based on the criteria
   * @param criteria
   * @returns
   */
  search(
    criteria:
      | operations["readProductListing post /product-listing/{categoryId}"]["body"]
      | operations["searchPage post /search"]["body"],
  ): Promise<void>;
  /**
   * Loads more (next page) elements to the listing
   */
  loadMore(
    criteria: operations["searchPage post /search"]["body"],
  ): Promise<void>;
  /**
   * Listing that is currently set
   */
  getCurrentListing: ComputedRef<Schemas["ProductListingResult"] | null>;
  /**
   * Listing elements ({@link Product}) that are currently set
   */
  getElements: ComputedRef<Schemas["ProductListingResult"]["elements"]>;
  /**
   * Available sorting orders
   */
  getSortingOrders: ComputedRef<
    Schemas["ProductSorting"][] | { key: string; label: string }[] | undefined
  >;
  /**
   * Current sorting order
   */
  getCurrentSortingOrder: ComputedRef<string | undefined>;
  /**
   * Changes the current sorting order
   * @param order - i.e. "name-asc"
   * @returns
   */
  changeCurrentSortingOrder(
    order: string,
    query?: operations["searchPage post /search"]["body"],
  ): Promise<void>;
  /**
   * Current page number
   */
  getCurrentPage: ComputedRef<number>;
  /**
   * Changes the current page number
   * @param pageNumber - page number to change to
   * @returns
   */
  changeCurrentPage(
    page: number,
    query?: operations["searchPage post /search"]["body"],
  ): Promise<void>;
  /**
   * Total number of elements found for the current search criteria
   */
  getTotal: ComputedRef<number>;
  /**
   * Total number of pages found for the current search criteria
   */
  getTotalPagesCount: ComputedRef<number>;
  /**
   * Number of elements per page
   */
  getLimit: ComputedRef<number>;
  /**
   * Initial filters
   */
  getInitialFilters: ComputedRef<ReturnType<typeof getListingFilters>>;
  /**
   * All available filters
   */
  getAvailableFilters: ComputedRef<ReturnType<typeof getListingFilters>>;
  /**
   * Filters that are currently set
   */
  getCurrentFilters: ComputedRef<any>;
  /**
   * Sets the filters to be applied for the listing
   * @param filters
   * @returns
   */
  setCurrentFilters(filters: any): Promise<void>;
  /**
   * Indicates if the listing is being fetched
   */
  loading: ComputedRef<boolean>;
  /**
   * Indicates if the listing is being fetched via `loadMore` method
   */
  loadingMore: ComputedRef<boolean>;
  /**
   * Resets the filters - clears the current filters
   */
  resetFilters(): Promise<void>;
  /**
   * Change selected filters to the query object
   */
  filtersToQuery(filters: any): Record<string, any>;
};

Properties ​

NameTypeDescription
getInitialListing
ComputedRef< | null>
Listing that is currently set{@link ListingResult} object
getCurrentListing
ComputedRef< | null>
Listing that is currently set
getElements
ComputedRef<>
Listing elements ({@link Product}) that are currently set
getSortingOrders
ComputedRef<Array<> | Array<{ key: string; label: string }> | undefined>
Available sorting orders
getCurrentSortingOrder
ComputedRef<string | undefined>
Current sorting order
getCurrentPage
ComputedRef<number>
Current page number
getTotal
ComputedRef<number>
Total number of elements found for the current search criteria
getTotalPagesCount
ComputedRef<number>
Total number of pages found for the current search criteria
getLimit
ComputedRef<number>
Number of elements per page
getInitialFilters
ComputedRef<ReturnType<>>
Initial filters
getAvailableFilters
ComputedRef<ReturnType<>>
All available filters
getCurrentFilters
ComputedRef<any>
Filters that are currently set
loading
ComputedRef<boolean>
Indicates if the listing is being fetched
loadingMore
ComputedRef<boolean>
Indicates if the listing is being fetched via `loadMore` method

Methods ​

NameTypeDescription
setInitialListing
Promise<void>
Sets the initial listing - available synchronously
initSearch
Promise<>
search
Promise<void>
Searches for the listing based on the criteria
loadMore
Promise<void>
Loads more (next page) elements to the listing
changeCurrentSortingOrder
Promise<void>
Changes the current sorting order
changeCurrentPage
Promise<void>
Changes the current page number
setCurrentFilters
Promise<void>
Sets the filters to be applied for the listing
resetFilters
Promise<void>
Resets the filters - clears the current filters
filtersToQuery
Record<string, any>
Change selected filters to the query object
useListing has loaded