{% extends 'search/layout.html' %}
{% load i18n %}
{% load humanize %}
{% load book_display_tags %}

{% block panel %}

{% if results or remote_results %}
<ul class="block">
{% for result in results %}
    <li class="pd-4 mb-5 local-book-search-result" id="tour-local-book-search-result">
        <div class="columns is-mobile is-gapless mb-0">
            <div class="column is-cover">
                {% include 'snippets/book_cover.html' with book=result cover_class='is-w-xs is-h-xs' %}
            </div>

            <div class="column is-10 ml-3">
                <p>
                    <strong>
                        {% include "snippets/book_titleby.html" with book=result %}
                    </strong>
                </p>
                <p>
                    {% with book_review_count=result|review_count %}
                    {% blocktrans trimmed count counter=book_review_count with formatted_review_count=book_review_count|intcomma %}
                    {{ formatted_review_count }} review
                    {% plural %}
                    {{ formatted_review_count }} reviews
                    {% endblocktrans %}
                    {% endwith %}

                    {% if result.first_published_date or result.published_date %}
                        {% firstof result.first_published_date.year result.published_date.year as pub_year %}
                        {% blocktrans %}(published {{ pub_year }}){% endblocktrans %}
                    {% endif %}
                </p>
            </div>
        </div>
    </li>
{% endfor %}
</ul>

<div class="block">
{% for result_set in remote_results %}
    {% if result_set.results %}
    <section class="mb-5">
        <details class="details-panel box" open>
            <summary class="is-flex is-align-items-center is-flex-wrap-wrap is-gap-2 remote-book-search-result" id="tour-remote-search-result">
                <span class="mb-0 title is-5">
                    {% trans 'Results from' %}
                    <a
                        href="{{ result_set.connector.base_url }}"
                        target="_blank"
                        rel="nofollow noopener noreferrer"
                    >{{ result_set.connector.name|default:result_set.connector.identifier }}</a>
                </span>

                <span class="details-close icon icon-x" aria-hidden="true"></span>
            </summary>

        <div>
            <div class="is-flex is-flex-direction-row-reverse">
                <ul class="is-flex-grow-1">
                    {% for result in result_set.results %}
                        <li class="{% if not forloop.last %}mb-5{% endif %}">
                            <div class="columns is-mobile is-gapless">
                                <div class="column is-1 is-cover">
                                    {% include 'snippets/book_cover.html' with book=result cover_class='is-w-xs is-h-xs' external_path=True %}
                                </div>
                                <div class="column is-10 ml-3">
                                    <p>
                                        <strong>
                                            <a
                                                href="{{ result.view_link|default:result.key }}"
                                                rel="nofollow noopener noreferrer"
                                                target="_blank"
                                            >{{ result.title }}</a>
                                        </strong>
                                    </p>
                                    <p>
                                        {{ result.author }}
                                        {% if result.year %}({{ result.year }}){% endif %}
                                    </p>
                                    <form class="mt-1" action="/resolve-book" method="post">
                                        {% csrf_token %}
                                        <input type="hidden" name="remote_id" value="{{ result.key }}">
                                        <div class="control">
                                            <button type="submit" class="button is-small is-link">
                                                {% trans "Import book" %}
                                            </button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </li>
                    {% endfor %}
                </ul>
            </div>
        </div>
        </details>
    </section>
    {% endif %}
    {% endfor %}
</div>
{% endif %}
{% endblock %}

{% block search_footer %}
<p class="block">
    {% if request.user.is_authenticated %}
        {% if not remote %}
        <a href="{{ request.path }}?q={{ query|urlencode }}&type=book&remote=true" id="tour-load-from-other-catalogues">
            {% trans "Load results from other catalogues" %}
        </a>
        {% else %}
        <a href="{% url 'create-book' %}" id="tour-manually-add-book">
            {% trans "Manually add book" %}
        </a>
        {% endif %}
    {% else %}
        <a href="{% url 'login' %}">
            {% trans "Log in to import or add books." %}
        </a>
    {% endif %}
</p>

{% endblock %}