feature-shopping-list hooks

The components already use these hooks. Reach for them when you build your own UI on the same data. Open a hook for its options and what it returns.

Changing data

useAddToShoppingListAdd a product to a shopping list.

import { useAddToShoppingList } from "@evolve-storefront/feature-shopping-list/hooks";

function useAddToShoppingList()

Returns A React Query mutation: mutate, mutateAsync, isPending and the rest.

useCreateAnonymousShoppingListOpt-in: create a shareable anonymous list from a set of SKUs.

import { useCreateAnonymousShoppingList } from "@evolve-storefront/feature-shopping-list/hooks";

function useCreateAnonymousShoppingList()

Returns A React Query mutation: mutate, mutateAsync, isPending and the rest.

useCreateShoppingListCreate a shopping list, with lineItems on it when given.

import { useCreateShoppingList } from "@evolve-storefront/feature-shopping-list/hooks";

function useCreateShoppingList()

Returns A React Query mutation: mutate, mutateAsync, isPending and the rest.

useDeleteShoppingListDelete a shopping list.

import { useDeleteShoppingList } from "@evolve-storefront/feature-shopping-list/hooks";

function useDeleteShoppingList()

Returns A React Query mutation: mutate, mutateAsync, isPending and the rest.

useRemoveFromShoppingListRemove one or more line items from a specific shopping list.

import { useRemoveFromShoppingList } from "@evolve-storefront/feature-shopping-list/hooks";

function useRemoveFromShoppingList()

Returns A React Query mutation: mutate, mutateAsync, isPending and the rest.

useUpdateShoppingListRename / re-describe a shopping list via the input-based update mutation.

import { useUpdateShoppingList } from "@evolve-storefront/feature-shopping-list/hooks";

function useUpdateShoppingList()

Returns A React Query mutation: mutate, mutateAsync, isPending and the rest.

useUpdateShoppingListItemChange a line item's quantity (server-persisted).

import { useUpdateShoppingListItem } from "@evolve-storefront/feature-shopping-list/hooks";

function useUpdateShoppingListItem()

Returns A React Query mutation: mutate, mutateAsync, isPending and the rest.

Other hooks

useActiveShoppingListDefault active-list seam: persists the selected list id in localStorage and resolves it against the provided lists (fallback: the first list).

import { useActiveShoppingList } from "@evolve-storefront/feature-shopping-list/hooks";

function useActiveShoppingList(
  shoppingLists: ShoppingListOverviewItem[] | undefined,
): UseActiveShoppingListResult

Returns UseActiveShoppingListResult

useShoppingListFormReads the state seeded by ShoppingListForm.

import { useShoppingListForm } from "@evolve-storefront/feature-shopping-list/shopping-list-form";

function useShoppingListForm(): ShoppingListFormContextValue

Returns ShoppingListFormContextValue