{% load utilities %}
{% load shelf_tags %}
{% load i18n %}

{% with next_shelf_identifier=active_shelf.shelf.identifier|next_shelf %}

<div
    class="{% if next_shelf_identifier != 'complete' %}is-hidden{% endif %}"
    data-shelf-identifier="complete"
>
    <button type="button" class="button {{ class }}" disabled>
        <span>{% trans "Read" %}</span>
    </button>
</div>

{% for shelf in shelves %}
    <div
        class="{% if next_shelf_identifier != shelf.identifier %}is-hidden{% endif %}"
        data-shelf-identifier="{{ shelf.identifier }}"
        data-shelf-next="{{ shelf.identifier|next_shelf }}"
    >
    {% if shelf.identifier == 'reading' %}

            {% trans "Start reading" as button_text %}
            {% url 'reading-status' 'start' book.id as fallback_url %}
            {% join "start_reading" button_uuid as modal_id %}
            {% include 'snippets/shelve_button/modal_button.html' with class=class fallback_url=fallback_url %}

    {% elif shelf.identifier == 'read' %}

            {% trans "Finish reading" as button_text %}
            {% url 'reading-status' 'finish' book.id as fallback_url %}
            {% join "finish_reading" button_uuid as modal_id %}
            {% include 'snippets/shelve_button/modal_button.html' with class=class fallback_url=fallback_url %}

    {% elif shelf.identifier == 'stopped-reading' %}

            {% trans "Stop reading" as button_text %}
            {% url 'reading-status' 'stop' book.id as fallback_url %}
            {% join "stop_reading" button_uuid as modal_id %}
            {% include 'snippets/shelve_button/modal_button.html' with class=class fallback_url=fallback_url %}

    {% elif shelf.identifier == 'to-read' %}

            {% trans "Want to read" as button_text %}
            {% url 'reading-status' 'want' book.id as fallback_url %}
            {% join "want_to_read" button_uuid as modal_id %}
            {% include 'snippets/shelve_button/modal_button.html' with class=class fallback_url=fallback_url %}

    {% elif shelf.editable %}

        <form name="shelve-{{ uuid }}-{{ shelf.identifier }}" action="/shelve/" method="post">
            {% csrf_token %}
            <input type="hidden" name="book" value="{{ active_shelf.book.id }}">
            <button
                class="button {{ class }}"
                name="shelf"
                type="submit"
                value="{{ shelf.identifier }}"
                {% if book|is_book_on_shelf:shelf %} disabled {% endif %}
            >
                <span>{{ shelf.name }}</span>
            </button>
        </form>

    {% endif %}
    </div>
{% endfor %}

{% endwith %}