Skip to content

Basket Products API

Feature name: basket

Api name: basketProductsApi

API used to perform actions related to products in a basket like retrieving a list of products currently in a basket, their sum or a number of positions in the basket.

classDiagram
direction LR
    class select["select$"]
    class selectBasketCount["selectBasketCount$"]
    class selectBasketPositions["selectBasketPositions$"]
    class selectSum["selectSum$"]
    class selectDiscountedSum["selectDiscountedSum$"]
    class selectSectionValidation["selectSectionValidation$"]

    BasketProductsAPI --> get
    BasketProductsAPI --> select
    BasketProductsAPI --> remove
    BasketProductsAPI --> update
    BasketProductsAPI --> getBasketCount
    BasketProductsAPI --> selectBasketCount
    BasketProductsAPI --> getBasketPositions
    BasketProductsAPI --> selectBasketPositions
    BasketProductsAPI --> getSum
    BasketProductsAPI --> selectSum
    BasketProductsAPI --> getDiscountedSum
    BasketProductsAPI --> selectDiscountedSum
    BasketProductsAPI --> getSectionValidation
    BasketProductsAPI --> selectSectionValidation

    class BasketProductsAPI {
        get(): ProductBasket[];
        select(): Observable<ProductBasket[]>;
        remove(product: ProductBasket): void;
        update(product: ProductBasket, quantity: number): void;
        getBasketCount(): number;
        selectBasketCount(): Observable<number>;
        getBasketPositions(): number;
        selectBasketPositions(): Observable<number>;
        getSum(): FullPrice;
        selectSum(): Observable<FullPrice>;
        getDiscountedSum(): FullPrice;
        selectDiscountedSum(): Observable<FullPrice>;
        getSectionValidation(): TSectionValidation;
        selectSectionValidation(): Observable<TSectionValidation>;
    }

    link get "../methods/get/"
    link select "../methods/select/"
    link remove "../methods/remove/"
    link update "../methods/update/"
    link getBasketCount "../methods/get-basket-count/"
    link selectBasketCount "../methods/select-basket-count/"
    link getBasketPositions "../methods/get-basket-positions/"
    link selectBasketPositions "../methods/select-basket-positions/"
    link getSum "../methods/get-sum/"
    link selectSum "../methods/select-sum/"
    link getDiscountedSum "../methods/get-discounted-sum/"
    link selectDiscountedSum "../methods/select-discounted-sum/"
    link getSectionValidation "../methods/get-section-validation/"
    link selectSectionValidation "../methods/select-section-validation/"

Get API

To get the Basket Products API use its name basketProductsApi with the getApi method.

useStorefront(async ({ eventBus, getApi }) => {
    eventBus.on('basket.initialized', async () => {
        const basketProductsApi = await getApi('basketProductsApi');
    });
});

This API is not automatically initialized. Unless you initialize it by hand or use a proper event like in the example above, you won't be able to fetch the API. Read more in the Retrieving basket APIs section

Methods

  • get - retrieve a list of items inside the basket
  • select$ - select a list of items inside the basket
  • remove - remove an item from the basket
  • update - update the item quantity in basket
  • getBasketCount - retrieve a number of items in the basket
  • selectBasketCount$ - select a number of items in the basket
  • getBasketPositions - retrieve a number of positions in the basket
  • selectBasketPositions$ - retrieve a number of positions in the basket
  • getSum - retrieve a sum of all products in the basket before applying all discounts and promotions
  • selectSum$ - select a sum of all products in the basket before applying all discounts and promotions
  • getDiscountedSum - retrieve a sum of all products in the basket after applying all discounts and promotions
  • selectDiscountedSum$ - retrieve a sum of all products in the basket after applying all discounts and promotions
  • getSectionValidation - validate a section containing products and check for potential errors
  • selectSectionValidation$ - select a validation of a section containing products and check for potential errors

Event Bus events

This API listens to the following events with the Event Bus:

Example

In this example we make a basketProductsApi call to retrieve a list of items inside the basket.

useStorefront(async ({ eventBus, getApi }) => {
    eventBus.on('basket.initialized', async () => {
        const basketProductsApi = await getApi('basketProductsApi');

        const productsInBasket = basketProductsApi.get();
    });
});

Example

In this example we make a basketProductsApi call to select a sum of all products in the basket after applying all discounts and promotions.

useStorefront(async ({ eventBus, getApi }) => {
    eventBus.on('basket.initialized', async () => {
        const basketProductsApi = await getApi('basketProductsApi');

        const discountedSum$ = basketProductsApi.selectDiscountedSum$();
    });
});

Example

In this example we make a basketProductsApi call to select a number of positions in the basket.

useStorefront(async ({ eventBus, getApi }) => {
    eventBus.on('basket.initialized', async () => {
        const basketProductsApi = await getApi('basketProductsApi');

        const amountOfProductPositionsInBasket$ = basketProductsApi.selectBasketPositions$();
    });
});

Example

In this example we make a basketProductsApi call to validate a section containing products and check for potential errors.

useStorefront(async ({ eventBus, getApi }) => {
    eventBus.on('basket.initialized', async () => {
        const basketProductsApi = await getApi('basketProductsApi');

        const validation = basketProductsApi.getSectionValidation();
    });
});

Models reference

APIs reference