{% load form_helpers %}
{% load helpers %}
{% load render_table from django_tables2 %}

<div id="lease-search" hx-target="#lease-search" hx-swap="outerHTML" hx-push-url="true">
  <div class="row px-3">
    <div class="col col-6 offset-3 py-3">
      <form
        class="form form-horizontal"
        hx-get="."
        hx-indicator="#search-indicator"
        hx-disabled-elt="#lease-search-btn"
        {% if form.is_bound and is_embedded and form.is_valid %}hx-trigger="load"{% endif %}
      >
        {% if form.cleaned_data.page %}
          {# Only include on full page load so that the user lands on the correct page. #}
          <input type="hidden" id="id_page" name="page" value="{{ form.cleaned_data.page }}">
        {% endif %}
        {% for e in form.errors.page %}
          <div class="alert alert-danger" role="alert">{{ e }}</div>
        {% endfor %}
        {% render_form form %}
        <div class="text-end">
          <div id="search-indicator" class="spinner-border d-inline-block align-middle htmx-indicator me-2" role="status">
            <span class="visually-hidden">Loading...</span>
          </div>
          <button id="lease-search-btn" type="submit" class="btn btn-primary">
            <span class="mdi mdi-magnify" aria-hidden="true"></span> Search
          </button>
        </div>
      </form>
    </div>
  </div>

  {% if not is_embedded and form.is_valid %}
    {% include "inc/table_controls_htmx.html" with table_modal="LeasesTable_config" %}
    {% with preferences|get_key:"pagination.placement" as paginator_placement %}
      <form method="post" action="{{ delete_action }}">
        {% csrf_token %}
        <input type="hidden" name="return_url" value="{{ request.path }}?{{ request.GET.urlencode }}" />
        <div class="card table-responsive">
          {% if paginator_placement == 'top' or paginator_placement == 'both' %}
            {% include "netbox_kea/inc/server_dhcp_leases_paginator.html" with table=table paginate=paginate placement="top" %}
          {% endif %}
          {% render_table table "inc/table_htmx.html" %}
          {% if paginator_placement != "top" %}
            {% include "netbox_kea/inc/server_dhcp_leases_paginator.html" with table=table paginate=paginate placement="bottom" %}
          {% endif %}
        </div>
        <div class="d-print-none d-flex justify-content-between mt-2">
          <div>
            {% if can_delete %}
              <button type="submit" class="btn btn-sm btn-danger"><i class="mdi mdi-trash-can-outline" aria-hidden="true"></i> Delete Selected</button>
            {% endif %}
          </div>

          <div class="dropdown">
            <button type="button" class="btn btn-purple dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
              <i class="mdi mdi-download"></i> Export
            </button>
            <ul class="dropdown-menu dropdown-menu-end">
              <li><a class="dropdown-item" href="{% querystring request export="table" %}">Current View</a></li>
              <li><a class="dropdown-item" href="{% querystring request export="" %}">All Data (CSV)</a></li>
            </ul>
          </div>
        </div>
      </form>
    {% endwith %}
  {% endif %}
</div>
