<template x-component="collection-navigation">
    <div
        {% if AuthController.knowledge.can_change %}
            x-sort="await move_collection({collection: $item, order: $position, new_parent: data.id})"
            x-sort:group="collection"
        {% endif %}
    >
        <template x-for="collection in data.items" :key="collection.id">
            <div
                {% if AuthController.knowledge.can_change %}
                    x-sort:item="collection"
                    @dragstart="toggle_dragging(true)"
                    @dragend="toggle_dragging(false)"
                {% endif %}
                :id="collection.name"
                :class="{'ms-4': collection.parent.id !== -1}"
                class="mb-1 collection"
            >
                {% include 'django_spire/knowledge/sub_navigation/item/collection_sub_navigation_item.html' %}

                <div x-show="is_expanded(collection.id)" class="my-1">
                    <x-collection-navigation :data="{items: collection.children, id: collection.id}"></x-collection-navigation>
                    <div class="ms-4">
                        <div
                            {% if AuthController.knowledge.can_change %}
                                x-sort="await move_entry({entry: $item, collection: collection, order: $position})"
                                x-sort:group="entry"
                            {% endif %}
                        >
                            <template x-for="entry in collection.entries" :key="entry.version_id">
                                <div
                                    class="mb-1 entry"
                                    {% if AuthController.knowledge.can_change %}
                                        x-sort:item="entry"
                                        @dragstart="toggle_dragging(true)"
                                        @dragend="toggle_dragging(false)"
                                    {% endif %}
                                    :id="entry.name"
                                >
                                    {% include 'django_spire/knowledge/sub_navigation/item/entry_sub_navigation_item.html' %}
                                </div>
                            </template>
                        </div>
                    </div>
                </div>
            </div>
        </template>
    </div>
</template>
