Basket Overall API

Feature name: basket

Api name: basketOverallApi

---

API used to perform actions regarding a basket summary section like setting a comment to order, clearing the products in the basket or retrieving a sum, delivery method or invalid sections of this part of the basket.

classDiagram
direction LR
    class selectActions["selectActions$"]
    class selectId["selectId$"]
    class selectComment["selectComment$"]
    class selectIsVatEu["selectIsVatEu$"]
    class selectDelivery["selectDelivery$"]
    class selectSum["selectSum$"]
    class selectSumWithoutPaymentAndShipping["selectSumWithoutPaymentAndShipping$"]
    class selectInvalidSections["selectInvalidSections$"]
    class selectSectionValidation["selectSectionValidation$"]


    BasketOverallAPI --> getActions
    BasketOverallAPI --> selectActions
    BasketOverallAPI --> selectId
    BasketOverallAPI --> getId
    BasketOverallAPI --> selectComment
    BasketOverallAPI --> getComment
    BasketOverallAPI --> selectIsVatEu
    BasketOverallAPI --> getIsVatEu
    BasketOverallAPI --> selectDelivery
    BasketOverallAPI --> getDelivery
    BasketOverallAPI --> selectSum
    BasketOverallAPI --> getSum
    BasketOverallAPI --> getSumWithoutPaymentAndShipping
    BasketOverallAPI --> selectSumWithoutPaymentAndShipping
    BasketOverallAPI --> cleanBasket
    BasketOverallAPI --> setComment
    BasketOverallAPI --> getInvalidSections
    BasketOverallAPI --> selectInvalidSections
    BasketOverallAPI --> getSectionValidation
    BasketOverallAPI --> selectSectionValidation

    class BasketOverallAPI {
        getActions() TBasketActions
        selectActions$() Observable~TBasketActions~
        getId() string
        selectId$() Observable~string~
        getComment() string
        selectComment$() Observable~string~
        getIsVatEu() boolean
        selectIsVatEu$() Observable~boolean~
        getDelivery() Delivery
        selectDelivery$() Observable~Delivery~
        getSum() FullPrice
        selectSum$() Observable~FullPrice~
        getSumWithoutPaymentAndShipping() FullPrice
        selectSumWithoutPaymentAndShipping$() Observable~FullPrice~
        cleanBasket() Promise~void~
        setComment(comment: string) Promise~void~
        getInvalidSections() TBasketInvalidSections
        selectInvalidSections$() Observable~TBasketInvalidSections~
        getSectionValidation() TSectionValidation
        selectSectionValidation$() Observable~TSectionValidation~
    }

    link getActions "../methods/get-actions/"
    link selectActions "../methods/select-actions/"
    link getId "../methods/get-id/"
    link selectId "../methods/select-id/"
    link getComment "../methods/get-comment/"
    link selectComment "../methods/select-comment/"
    link getIsVatEu "../methods/get-is-vat-eu/"
    link selectIsVatEu "../methods/select-is-vat-eu/"
    link getDelivery "../methods/get-delivery/"
    link selectDelivery "../methods/select-delivery/"
    link getSum "../methods/get-sum/"
    link selectSum "../methods/select-sum/"
    link getSumWithoutPaymentAndShipping "../methods/get-sum-without-payment-and-shipping/"
    link selectSumWithoutPaymentAndShipping "../methods/select-sum-without-payment-and-shipping/"
    link cleanBasket "../methods/clean-basket/"
    link setComment "../methods/set-comment/"
    link getInvalidSections "../methods/get-invalid-sections/"
    link selectInvalidSections "../methods/select-invalid-sections/"
    link getSectionValidation "../methods/get-section-validation/"
    link selectSectionValidation "../methods/select-section-validation/"

Get API

To get the Basket Overall API use its name basketOverallApi with the getApi method.

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

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

• getActions - retrieve a key value object with various basket actions
• selectActions$ - select a key value object with various basket actions
• getId - retrieve an id of a current basket
• selectId$ - select an id of a current basket
• getComment - retrieve the text from Comments to order field
• selectComment$ - select the text from Comments to order field
• getIsVatEu - retrieve whether the current order has obligations regarding the eu vat or not
• selectIsVatEu$ - select whether the current order has obligations regarding the eu vat or not
• getDelivery - retrieve an object containing information about a chosen delivery method of a current basket
• selectDelivery$ - select an object containing information about a chosen delivery method of a current basket
• getSum - retrieve information about a total sum of products in the current basket
• selectSum$ - select information about a total sum of products in the current basket
• getSumWithoutPaymentAndShipping - retrieve information about a total sum of products in the current basket excluding payment method and shipping costs
• selectSumWithoutPaymentAndShipping$ - select information about a total sum of products in the current basket excluding payment method and shipping costs
• cleanBasket - clear the products in the current basket
• setComment - set a comment to order in the current basket
• getInvalidSections - retrieve the incorrectly filled sections of the current basket
• selectInvalidSections$ - select the incorrectly filled sections of the current basket
• getSectionValidation - retrieve a validation for the basket summary section
• selectSectionValidation$ - select a validation for the basket summary section

Example

In this example we make a basketOverallApi call to retrieve a current comment for the order.

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

        const comment = basketOverallApi.getComment();

        console.log('current comment: ', comment);
    });
});

Example

In this example we make a basketOverallApi call to select a total sum of products in the basket without costs regarding the payment method and shipping.

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

        const sumWithoutPaymentAndShipping$ = basketOverallApi.selectSumWithoutPaymentAndShipping$();

        sumWithoutPaymentAndShipping$.subscribe((sumWithoutPaymentAndShipping) => {
            console.log('current sum without payment and shipping:', sumWithoutPaymentAndShipping.grossValueFormatted);
        });
    });
});

Example

In this example we make a basketOverallApi call to select the incorrectly filled sections of the current basket

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

        const invalidSections$ = basketOverallApi.selectInvalidSections$();

        invalidSections$.subscribe((invalidSections) => {
            console.log('currently invalid fields:');

            Object.entries(invalidSections).forEach(([section, validationError]) => {
                if (!validationError) return;

                console.log(`${section}: ${validationError}`);
            });
        });
    });
});

Example

In this example we make a basketOverallApi call to clear the products in the basket.

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

        await basketOverallApi.cleanBasket();
    });
});

Example

In this example we make a basketOverallApi call to set a comment to the order.

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

        await basketOverallApi.setComment('Please make sure to draw a kitten on the box');
    });
});

Example

In this example we make a basketOverallApi call to get an action for changing a billing address in order to set its new value. We also use a getBillingAddress method from Basket Addresses API to get the action for setting the billing address with the retrieved action.

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

        const changeBillingAddressAction = basketOverallApi.getActions().changeBillingAddress;

        await basketAddressesApi.setBillingAddress(changeBillingAddressAction, {
            isCompany: false,
            companyName: '',
            firstName: 'John',
            lastName: 'Snow',
            personalIdNumber: '',
            taxId: '',
            countryId: 'US',
            city: 'My City',
            postalCode: '12-345',
            street: 'example street 8',
            street2: '',
            phone: '123456789',
            state: '',
            useAsBillingAddress: false,
            createUserAccount: false
        });
    });
});

Objects reference

• TBasketActions
• TBasketInvalidSections
• TSectionValidation

Models reference

• Delivery
• FullPrice

APIs reference

• Basket Addresses API
• Feature System API