README

Add a wishlist (a.k.a. favourites / save for later) to your Sylius store. Visitors can save products whether or not they're logged in, the wishlist follows them from anonymous browsing into their account, and they can move everything to the cart in one click.

Features

• 🛍️ Guest and customer wishlists – anonymous visitors get a wishlist tied to a cookie; logged-in customers get one tied to their account.
• 🔄 Automatic hand-off on login – when a guest with a wishlist logs in, their items are moved onto their customer wishlist, so nothing is lost.
• ❤️ Drop-in toggle button – a ready-made "heart" button that adds/removes a product (or a specific variant) over AJAX, plus a JS event you can hook into.
• 🛒 Add the whole wishlist to the cart in a single request.
• 📝 Per-item notes – shoppers can add a free-text note to each wishlist item (e.g. a size or colour preference), editable by the owner and visible to anyone they share the wishlist with.
• 🔗 Shareable wishlists – every wishlist has a UUID, so it can be viewed via a stable, shareable URL.
• 🧩 Extensible – all resources (models, repositories, factories) are overridable, and the "whose wishlist is this?" logic is a tagged service you can plug into.

Heads up: the data model already supports multiple wishlists per customer, but the UI/flow for choosing between them is still a work in progress (the select-wishlists endpoint currently returns Not implemented).

How it works

A few concepts are worth understanding before you integrate the plugin.

Wishlists and items

Wishlist is an abstract resource with two concrete subclasses:

Each wishlist holds WishlistItems. An item references either a product or a specific product variant (plus a quantity and an optional free-text note), and every wishlist exposes a uuid (UUID v7) used in its public, shareable URL.

Who owns the current wishlist?

Everything in the plugin asks one service – WishlistProviderInterface – for "the current visitor's wishlists". It's a composite built from two tagged providers, consulted by priority, returning the first non-empty result:

1. UserWishlistProvider – the wishlists of the logged-in customer (via Symfony Security).
2. GuestWishlistProvider – the guest wishlist for the current cookie client id.

The result is memoized for the duration of the request by a caching decorator. To add another source (e.g. a shared/team wishlist), implement WishlistProviderInterface and tag it – you never touch the composite itself.

Guest identity

Anonymous visitors are identified through setono/client-bundle, which assigns a stable client id stored in a cookie. That id keys the guest wishlist. When the visitor authenticates, a login subscriber (ConvertGuestWishlistToUserWishlistSubscriber) converts the guest wishlist into a user wishlist.

Templates & the toggle flow

The plugin exposes two Twig functions so your templates can react to wishlist state:

{# is this product (or variant) on the current visitor's wishlist? #}
{{ setono_sylius_wishlist_on_wishlist(product) }}   {# returns a bool #}

{# does the current visitor have any non-empty wishlist? #}
{{ setono_sylius_wishlist_has_wishlist() }}          {# returns a bool #}

Adding/removing happens against small JSON endpoints. The bundled wishlist-action-handler.js listens for clicks on button.ssw-toggle, calls the endpoint, flips the button state, and dispatches a ssw:product-toggled event you can listen to (e.g. to update a header counter).

Requirements

Installation

1. Require the package

composer require setono/sylius-wishlist-plugin

2. Register the plugin

Add the bundle to config/bundles.php before SyliusGridBundle, otherwise you'll get a You have requested a non-existent parameter "setono_sylius_wishlist.model.wishlist.class" exception:

<?php
# config/bundles.php
return [
    // ...
    Setono\SyliusWishlistPlugin\SetonoSyliusWishlistPlugin::class => ['all' => true],
    Sylius\Bundle\GridBundle\SyliusGridBundle::class => ['all' => true],
    // ...
];

3. Import the routing

# config/routes/setono_sylius_wishlist.yaml
setono_sylius_wishlist:
    resource: "@SetonoSyliusWishlistPlugin/Resources/config/routes.yaml"

If your shop doesn't use locales in the URL, import routes_no_locale.yaml instead:

# config/routes/setono_sylius_wishlist.yaml
setono_sylius_wishlist:
    resource: "@SetonoSyliusWishlistPlugin/Resources/config/routes_no_locale.yaml"

4. Update your database

The plugin ships Doctrine mappings; generate and run a migration for your app:

php bin/console doctrine:migrations:diff
php bin/console doctrine:migrations:migrate

5. Install the assets

The toggle button's stylesheet and script are injected into the shop layout automatically (via sylius_ui events), but the JS file still needs to be published:

php bin/console assets:install

Usage

Add a wishlist button to your product page

Include the bundled partial wherever you render a product (e.g. the product box or the product show page), passing the product and – optionally – the selected productVariant:

{% include '@SetonoSyliusWishlistPlugin/shop/wishlist/_toggle_button.html.twig' with {
    'product': product,
    'productVariant': variant ?? null,
} %}

It renders a heart button.ssw-toggle whose data-url points at the correct add/remove route and whose state reflects setono_sylius_wishlist_on_wishlist(...). No extra wiring is needed – the CSS/JS are already on the page.

React to toggles in JavaScript

Every toggle dispatches a bubbling ssw:product-toggled event:

document.addEventListener('ssw:product-toggled', (e) => {
    // e.detail.event === 'added' | 'removed'
    // e.detail.wishlistItemsCount === total items across the visitor's wishlists
    document.querySelector('#wishlist-counter').textContent = e.detail.wishlistItemsCount;
});

You can override the handler's defaults by setting window.sswWishlist before the script loads (e.g. to change the selector.toggle or provide your own callback.onToggle).

Link to the wishlist

The wishlist index and a single (shareable) wishlist are available at these routes:

(The *_product_variant variants of the add/remove routes exist too.) Because a wishlist is addressed by its uuid, the _show URL can be shared with anyone.

Customization

Override a resource

Models, repositories and factories follow the standard Sylius Resource configuration. To swap in your own model:

# config/packages/setono_sylius_wishlist.yaml
setono_sylius_wishlist:
    resources:
        wishlist:
            classes:
                model: App\Entity\Wishlist\Wishlist
        # guest_wishlist, user_wishlist and wishlist_item are configurable too

Provide your own wishlists

Implement Setono\SyliusWishlistPlugin\Provider\WishlistProviderInterface and tag it; the composite provider picks it up automatically (higher priority is consulted first):

# config/services.yaml
services:
    App\Wishlist\Provider\SharedWishlistProvider:
        tags:
            - { name: 'setono_sylius_wishlist.wishlist_provider', priority: 0 }

Edit authorization

Edit actions are guarded by WishlistVoter (the wishlist_edit attribute), which grants access only when the subject wishlist belongs to the current visitor. Override the voter if you need different rules.

Development

The repository contains a full test Sylius application under tests/Application used for integration testing.

composer install
composer analyse        # PHPStan (level max)
composer check-style    # Easy Coding Standard
composer phpunit        # unit tests

# commands that need the booted app:
(cd tests/Application && bin/console lint:container)

License

This plugin is released under the MIT License.