{% extends 'django_spire/card/title_card.html' %}

{% block card_title %}
	Entries
{% endblock %}

{% block card_button %}
    {% if perms.django_spire_knowledge.add_collection %}
        <div class='container'>
            <div class='row'>
                <div class='col-auto'>
                    {% url 'django_spire:knowledge:entry:form:import' collection_pk=collection.pk as import_url %}
                    <a class="btn btn-sm btn-primary" href="{{ import_url }}">
                        <i class="bi bi-upload"></i>
                        Import
                    </a>
                </div>
                <div class='col-auto'>
                    {% url 'django_spire:knowledge:entry:form:create' collection_pk=collection.pk as create_url %}
                    <a class="btn btn-sm btn-primary" href="{{ create_url }}">
                        <i class="bi bi-plus"></i>
                        Add
                    </a>
                </div>
            </div>
        </div>
    {% endif %}
{% endblock %}

{% block card_title_content %}
    <div class="card-body">
        <div x-data="{
                async reorder_entries({entry_id, order}){
                    let response = null
                    try {
                        response = await Glue.http.postJson(
                            '{% url "django_spire:knowledge:entry:json:reorder" %}',
                            {entry_id: entry_id, order: order, collection_id: {{ collection.id }}}
                        )
                    } catch (e) {
                        window.location.reload()
                    }

                    if (response.type === 'error') {
                        $dispatch('notify', {'type': response.type, 'message': response.message})
                    }
                }
            }"
             x-sort="await reorder_entries({entry_id: $item, order: $position})"
        >
            {% for entry in current_entries %}
                <div x-sort:item="{{ entry.pk }}">
                    {% include 'django_spire/knowledge/entry/item/list_item.html' %}
                </div>
            {% empty %}
                {% include 'django_spire/item/no_data_item.html' %}
            {% endfor %}
        </div>
    </div>
{% endblock %}