{% extends "generic/object.html" %}
{% load render_table from django_tables2 %}

{% block content %}
<div class="row mb-3">
  <div class="col">
    {% if not hook_available %}
    <div class="alert alert-warning" role="alert">
      <i class="mdi mdi-alert-circle-outline"></i>
      The <strong>host_cmds</strong> hook library is not loaded on this Kea server.
      Reservation management requires the <code>host_cmds</code> hook.
    </div>
    {% endif %}
  </div>
</div>

{% if hook_available %}
<div class="card mb-3">
  <div class="card-header">
    <strong><i class="mdi mdi-magnify"></i> Search Reservations</strong>
  </div>
  <div class="card-body">
    <form method="get" class="row g-2 align-items-end">
      <div class="col-auto flex-grow-1">
        <label for="id_q" class="form-label">{{ search_form.q.label }}</label>
        {{ search_form.q }}
        {% if search_form.q.errors %}
        <div class="text-danger small">{{ search_form.q.errors }}</div>
        {% endif %}
      </div>
      <div class="col-auto">
        <label for="id_subnet_id" class="form-label">{{ search_form.subnet_id.label }}</label>
        {{ search_form.subnet_id }}
        {% if search_form.subnet_id.errors %}
        <div class="text-danger small">{{ search_form.subnet_id.errors }}</div>
        {% endif %}
      </div>
      <div class="col-auto">
        <button type="submit" class="btn btn-primary btn-sm">
          <i class="mdi mdi-magnify"></i> Filter
        </button>
        {% if request.GET %}
        <a href="{{ request.path }}" class="btn btn-outline-secondary btn-sm">
          <i class="mdi mdi-close"></i> Clear
        </a>
        {% endif %}
      </div>
    </form>
  </div>
</div>
{% endif %}

<div class="row mb-3">
  <div class="col text-end">
    {% if hook_available and bulk_sync_url %}
    <form method="post" action="{{ bulk_sync_url }}" class="d-inline">
      {% csrf_token %}
      <button type="submit" class="btn btn-outline-info btn-sm me-2">
        <i class="mdi mdi-sync" aria-hidden="true"></i>
        Sync All to NetBox
      </button>
    </form>
    {% endif %}
    {% if hook_available and import_url %}
    <a href="{{ import_url }}" class="btn btn-outline-secondary btn-sm me-2">
      <i class="mdi mdi-upload" aria-hidden="true"></i>
      Import CSV
    </a>
    {% endif %}
    {% if hook_available %}
    <a href="{{ add_url }}" class="btn btn-primary btn-sm">
      <i class="mdi mdi-plus-thick" aria-hidden="true"></i>
      Add DHCPv{{ dhcp_version }} Reservation
    </a>
    {% else %}
    <button type="button" class="btn btn-primary btn-sm" disabled aria-disabled="true">
      <i class="mdi mdi-plus-thick" aria-hidden="true"></i>
      Add DHCPv{{ dhcp_version }} Reservation
    </button>
    {% endif %}
  </div>
</div>

<div class="card">
  <div class="card-body">
    {% render_table table %}
  </div>
</div>
{% endblock %}