{% load i18n %}
{% load wishlist_tags %}

<div class="wishlist_wrapper">
{% if user.is_authenticated %}
    {% with wishlists=user.wishlists.all %}
        {# Select wishlists that contains product #}
        {% wishlists_containing_product wishlists product as product_wishlists %}
        {% if wishlists %}
            <div class="btn-group btn-wishlist">
                <a class="btn btn-default dropdown-toggle no-caret icon-spaceing" data-toggle="dropdown" href="#">{% trans "Add to wish list" %} <small><i class="fa fa-heart"></i></small></a>
                <ul class="dropdown-menu pull-right text-left wish-dropdown" style="min-width: 250px;">
                    <li class="nav-item"><a class="nav-link" href="{% url 'customer:wishlists-create-with-product' product_pk=product.pk %}">{% trans 'Create a new wishlist' %}</a></li>
                    <li class="dropdown-divider"></li>
                    {% for wishlist in wishlists %}
                        {% if wishlist not in product_wishlists %}
                            <li class="nav-item">
                                <a class="nav-link" href="{% url 'customer:wishlists-add-product' key=wishlist.key product_pk=product.pk %}">
                                    {{ wishlist.name }}
                                </a>
                            </li>
                        {% endif %}
                    {% endfor %}
                </ul>
            </div>
        {% else %}
            {# 1 or no existing wishlists - show a simple button #}
            <form id="add_to_wishlist_form" action="{% url 'customer:wishlists-add-product' product_pk=product.pk %}" method="post" class="btn-wishlist">
                {% csrf_token %}
                <button type="submit" aria-labelby="add to wishlist" class="btn btn-lg" data-loading-text="{% trans 'Adding...' %}">{% trans "Add to wish list" %}</button>
            </form>
        {% endif %}

    {% endwith %}
{% else %}
    <div class="btn btn-lg btn-wishlist icon-spaceing disabled" data-toggle="tooltip" data-placement="top" title="{% trans 'Please login to add products to a wish list.' %}"><i class="fal fa-heart"></i></div><br/>
{% endif %}
</div>