<!--
Variables:
- content_type_id: The content type id of the object
- object: The object
- target: The target div id
-->


{% load static %}

<!-- Title -->
{% if title %}
<h3 class="card-title">{{ title }}</h3>
{% endif %}
<!-- End title -->

<!-- Search & filter -->
<div class="d-flex justify-content-between">

    <div class="d-flex">
        <input 
            type="text" 
            class="form-control form-control-sm" 
            placeholder="Search file"
            hx-get="{% url 'components_files' %}?content_type_id={{ content_type_id }}&object_id={{ object.pk }}"
            hx-trigger="keyup delay:500ms"
            hx-target="#{{ target}}"
            hx-swap="innerHTML"
            hx-include="#currentFolderForm"
            name="query"
        >
    </div>

    <div class="d-flex">
        <!-- Filter button -->
        {% url 'components_files' as url %}
        {% if object and content_type_id %}
        {% include "snippets/filter_snippet.html" with target=target url=url|add:"?content_type_id="|add:content_type_id|add:"&object_id"|add:object.pk application_fields=files_application_fields %}
        {% elif content_type_id %}
        {% include "snippets/filter_snippet.html" with target=target url=url|add:"?content_type_id="|add:content_type_id %}
        {% elif object %}
        {% include "snippets/filter_snippet.html" with target=target url=url|add:"?object_id="|add:object.pk %}
        {% else %}
        {% include "snippets/filter_snippet.html" with target=target url=url %}
        {% endif %}
        <!-- End filter button -->
    </div>
</div>
<!-- End search & filter -->

<div 
    id="{{ target }}"
    hx-get="{% url 'components_files' %}?content_type_id={{ content_type_id }}&object_id={{ object.pk }}"
    hx-trigger="load"
    hx-target="#{{ target }}"
    hx-swap="innerHTML"
    class="mt-2"
    >
</div>

