docs
  1. SCAYLE Resource Center
  2. Onboarding Guide
  3. Onboarding: frontend
  4. Get All Basket Items

Get All Basket Items

In the following section, we will cover the necessary endpoints for adding products to the basket, as well as updating and deleting those items. For more information, click here.

Retrieve all items in a specific customer's basket

bapiClient.basket.get

What is this endpoint for?

The bapiClient.basket.get retrieves the contents of the basket for a given basketKey. The basketKey is stored in the context. The API additionally needs the WITH option, which specifies the information about the product that should be returned.

Here’s an example of how it can be used on the web client:

const basket = useBasket()

...

const DEFAULT_BASKET_WITH = {
  items: {
    product: {
      attributes: 'all',
      advancedAttributes: {
        withKey: ['customizableProduct', 'compositeProductImageFlock'],
      },
      variants: {
        attributes: 'all',
        advancedAttributes: {
          withKey: ['deliveryForecast', 'materialgruppeRabattsperre'],
        },
      },
      categories: {
        properties: {
          withName: ['baseCategories'],
        },
      },
    },
    variant: {
      attributes: 'all',
      advancedAttributes: {
        withKey: ['deliveryForecast'],
      },
      lowestPriorPrice: true,
    },
  },
} as any

...

onMounted(() => basket.fetch({ with: DEFAULT_BASKET_WITH }))

Dev-to-Dev Hint

Instead of passing all, specify attributes as an array of strings to reduce the size of the response data.

Add a variant to a user's basket

Add a variant to a user's basket and update an existing basket item by defining its quantity

bapiClient.basket.addOrUpdateItems

What is this endpoint for?

The bapiClient.basket.addOrUpdateItems adds an array of items to the basket. It requires the basketKey, the array of items, and the existingItemHandling strategy.

Dev-to-Dev Hint

Use the existingItemHandling parameter as follows to suit your specific needs:

export declare enum ExistingItemHandling {
    KeepExisting = 0,
    AddQuantityToExisting = 1,
    ReplaceExisting = 2,
    ReplaceExistingWithCombinedQuantity = 3
}

Example

await bapiClient.basket.addOrUpdateItems(
    basketKey,
    [
      {
        variantId,
        quantity,
        params: {
          campaignKey,
          displayData,
          pricePromotionKey,
          customData,
          itemGroup,
          with: _with || {
            items: {
              variant: {
                attributes: {
                  withKey: ['size', 'shopSize', 'vendorSize', 'packageUnit'],
                },
              },
              product: {
                attributes: {
                  withKey: ['brand', 'name', 'colorDetail', 'wearingTime'],
                },
                variants: {
                  attributes: {
                    withKey: [
                      'price',
                      'size',
                      'shopSize',
                      'vendorSize',
                      'brand',
                      'name',
                    ],
                  },
                },
              },
            },
          },
        },
      },
    ],
    {
      skipAvailabilityCheck: false,
    },
    {
      existingItemHandling,
      considerItemGroupForUniqueness: true,
    }
  )

Delete an item from the basket

bapiClient.basket.delete

What is this endpoint for?

This endpoint allows you to remove an item from the current basket.
It requires both basketKey and itemId.

Example

await bapiClient.basket.deleteItem(basketKey, itemKey, {
  with: _with || defaultListWith,
  campaignKey,
})