getShoppingList

Method fetching user's shopping lists.

This method sends a POST request to the getShoppingList endpoint of the Vue Storefront API Middleware. In turn, it fetches a list of shopping lists from commercetools by sending a request to its GraphQL API. The default GraphQL query used by this method can be found here.

By default the method fetches a single, most recent wishlist belonging to a particular guest or a customer. Refer to the examples section to learn how to modify this behaviour.

The method can also be accessed with the getMyShoppingList alias.

Signature

export declare function getShoppingList<Res extends PartialGetShoppingListResponse = GetShoppingListResponse>(
	params?: GetShoppingListParams,
	options?: MethodOptions<CustomQuery<"getMe">>
): Promise<Res>;

Parameters

Name	Required	Type	Description
`params`	Optional	`GetShoppingListParams`	Parameter object which can be used with this method. Refer to its type definition to learn about possible properties.
`options`	Optional	`MethodOptions<CustomQuery<"getMe">>`	Options that can be passed to additionally configure the request or customize the logic in a plugin.

Returns

Returns a representation of the GetShoppingListResponse.

Referenced Types

Examples

Fetching the most recently created shopping list.

import { sdk } from '~/sdk.config.ts';

const { me: { shoppingLists } } = await sdk.commerce.getShoppingList();

Fetching a list of max 5 shopping lists sorted by name in ascending order. Learn more about sorting in commercetools here.

import { sdk } from '~/sdk.config.ts';

const { me: { shoppingLists } } = await sdk.commerce.getShoppingList({
  limit: 5,
  sort: ['name.en asc']
});

Fetching a shopping list using the where parameter. Learn more about building query predicates in commercetools here.

import { sdk } from '~/sdk.config.ts';

const { me: { shoppingLists } } = await sdk.commerce.getShoppingList({
  where: 'name(en="wishlist")'
});

Fetching a shopping list using the id convenience parameter. It only has an effect when the where parameter is not defined.

import { sdk } from '~/sdk.config.ts';

const { me: { shoppingLists } } = await sdk.commerce.getShoppingList({
  id: '793e8642-7517-4af9-9431-3e29b6206e10'
});

Creating a custom GraphQL query for fetching user's shopping list in middleware.config.js.

module.exports = {
  integrations: {
    ct: {
      // ...
      customQueries: {
       'get-shopping-list-custom-query': ({ query, variables, metadata }) => ({
         variables: Object.assign(variables, metadata?.variables),
         query: `
           query getMe(
             $where: String,
             $sort: [String!],
             $limit: Int,
             $offset: Int
           ) {
             me {
               shoppingLists(
                 where: $where,
                 sort: $sort,
                 limit: $limit,
                 offset: $offset
               ) {
                 results {
                   ${metadata?.fields}
                 }
               }
             }
           }
         `
       }),
      }
    }
  }
};

Fetching the most recently created shopping list and selecting response fields using the custom GraphQL query from the previous example. Notice how we are using the type parameter to overwrite the default response interface.

import { sdk } from '~/sdk.config.ts';

type CustomGetShoppingListResponse = {
  me: {
    shoppingLists: {
      results: {
       id: string;
       version: number;
      }
    }
  }
}

const { me } = await sdk.commerce.getShoppingList<CustomGetShoppingListResponse>(
  null,
  {
    customQuery: {
      getMe: 'get-shopping-list-custom-query',
      metadata: 'id,version'
    }
  }
);