> This page is for Developer.

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.bigcommerce.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.bigcommerce.com/_mcp/server.

# Wishlists

> How Catalyst's built-in wishlists let customers save products from the product page and manage their wishlists in My Account.

Catalyst includes built-in wishlists, similar to those in Stencil. Customers can save products to one or more wishlists from the product detail page (PDP), manage those wishlists in their account, and optionally share them publicly. This page covers how wishlists behave and where their code lives, so you can customize or extend them.

## Functionality

* Customers add products to a wishlist from the PDP with the wishlist button.
* Customers manage multiple wishlists (view, create, rename, and delete) from their account page.
* Customers can share a wishlist publicly with a unique URL.

## Behavior

| Scenario                                        | Behavior                                                                                |
| ----------------------------------------------- | --------------------------------------------------------------------------------------- |
| A customer adds a product with selected options | The selected options are added to the wishlist *if* they form a complete variant (SKU). |
| A signed-out shopper clicks the wishlist button | They're prompted to sign in, then redirected back to the PDP to finish the action.      |

## Customize wishlists

Wishlists work out of the box, so you don't need to build them. You can customize them, for example to:

* Change the UI of the wishlist modals or buttons
* Add analytics events
* Modify the server logic for creating and updating wishlists

## Key code paths

Wishlist code lives in the following paths in your Catalyst project.

### Account pages

| Path                                                   | Description                                                            |
| ------------------------------------------------------ | ---------------------------------------------------------------------- |
| `app/[locale]/(default)/account/wishlists`             | Main Wishlists page inside the customer’s account dashboard.           |
| `app/[locale]/(default)/account/wishlists/[id]`        | Wishlist details page (shows products within a specific wishlist).     |
| `app/[locale]/(default)/account/wishlists/_actions`    | Server actions (GraphQL mutations for create, update, delete, rename). |
| `app/[locale]/(default)/account/wishlists/_components` | Components related to the Account wishlist UI.                         |
| `app/[locale]/(default)/account/wishlists/modals.tsx`  | Defines wishlist modals, such as “Create a new wishlist.”              |

### Public wishlists

| Path                                      | Description                               |
| ----------------------------------------- | ----------------------------------------- |
| `app/[locale]/(default)/wishlist/[token]` | Page route for publicly shared wishlists. |

### Shared and PDP components

| Path                                                                | Description                                                           |
| ------------------------------------------------------------------- | --------------------------------------------------------------------- |
| `components/wishlist/`                                              | Shared wishlist components used in both the account and public views. |
| `components/wishlist/share-button.tsx`                              | Share button used on both the account and public wishlist pages.      |
| `app/[locale]/(default)/product/[slug]/_components/wishlist-button` | PDP-specific wishlist button component.                               |