Recommendations Functions

The Recommendations drop-in provides API functions that enable you to programmatically control behavior, fetch data, and integrate with Adobe Commerce backend services.

Version: 1.1.1

Function	Description
getRecommendations	Retrieves product recommendations based on various parameters such as page type, current SKU, cart items, and user history.
publishRecsItemAddToCartClick	Publishes an event when a user adds a recommended product to their cart, used for tracking recommendation performance..

getRecommendations

The getRecommendations function retrieves product recommendations based on various parameters such as page type, current SKU, cart items, and user history. The function calls the GraphQL recommendations query and transforms the response into a standardized format. The function calls the recommendations query.

const getRecommendations = async (
  params: GetRecommendationsProps
): Promise<RecommendationUnitModel[] | null>

Parameter	Type	Req?	Description
params	GetRecommendationsProps	Yes	Parameters for retrieving recommendations including `pageType` (where recommendations are shown), `currentSku` (product being viewed), `cartSkus` (items in cart), `userPurchaseHistory` (previous purchases), and `userViewHistory` (previously viewed products).

Events

Emits the recommendations/data event with the transformed recommendations data as the payload.

Returns

Returns an array of RecommendationUnitModel objects or null.

---

publishRecsItemAddToCartClick

The publishRecsItemAddToCartClick function publishes an event when a user adds a recommended product to their cart, used for tracking recommendation performance.

const publishRecsItemAddToCartClick = async (
  params: PublishParams
): any

Parameter	Type	Req?	Description
params	PublishParams	Yes	Parameters for the add-to-cart event including the recommended product details and recommendation unit information.

Examples

From product recommendations block:

import { publishRecsItemAddToCartClick } from '@dropins/storefront-recommendations/api';

publishRecsItemAddToCartClick({
  recommendationUnit,
  pagePlacement: 'product-list',
  yOffsetTop: addToCart.getBoundingClientRect().top ?? 0,
  yOffsetBottom:
  addToCart.getBoundingClientRect().bottom ?? 0,
  productId: ctx.index,
})

Events

Does not emit any drop-in events.

Returns

Returns void.

---

Data Models

The following data models are used by functions in this drop-in.

RecommendationUnitModel

The RecommendationUnitModel object is returned by the following functions: getRecommendations.

interface RecommendationUnitModel {
  displayOrder: number;
  pageType: PageType;
  title: string;
  items: Item[];
  totalProducts: number;
  typeId: string;
  unitId: string;
  unitName: string;
}