{% extends 'dcim/device/base.html' %}
{% load render_table from django_tables2 %}
{% load helpers %}
{% load static %}

{% block content %}
  <form method="post">
    {% csrf_token %}
    <div class="row mb-3 justify-content-between">
      <div class="col col-12 col-lg-4 my-3 my-lg-0 d-flex noprint table-controls">
        <div class="input-group input-group-sm">
          <input
              type="text"
              name="q"
              class="form-control"
              placeholder="Quick search"
              hx-get="{{ request.full_path }}"
              hx-target="#object_list"
              hx-trigger="keyup changed delay:500ms"
          />
        </div>
      </div>
      <div class="col col-md-3 mb-0 d-flex noprint table-controls">
        <div class="input-group input-group-sm justify-content-end">
          {% if request.user.is_authenticated %}
            <button
                type="button"
                class="btn btn-sm btn-outline-dark"
                data-bs-toggle="modal"
                data-bs-target="#DeviceInterfaceTable_config"
                title="Configure Table">
                <i class="mdi mdi-cog"></i> Configure Table
            </button>
          {% endif %}
          <button class="btn btn-sm btn-outline-dark dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
            <i class="mdi mdi-eye"></i>
          </button>
          <ul class="dropdown-menu">
            <button type="button" class="dropdown-item toggle-enabled" data-state="show">Hide Enabled</button>
            <button type="button" class="dropdown-item toggle-disabled" data-state="show">Hide Disabled</button>
          </ul>
        </div>
      </div>
    </div>

    <div class="card">
      <div class="card-body" id="object_list">
        {% include 'htmx/table.html' %}
      </div>
    </div>

    <div class="noprint bulk-buttons">
        <div class="bulk-button-group">
        {% if perms.dcim.change_interface %}
            <button type="submit" name="_rename" formaction="{% url 'dcim:interface_bulk_rename' %}?return_url={% url 'dcim:device_interfaces' pk=object.pk %}" class="btn btn-outline-warning btn-sm">
                <i class="mdi mdi-pencil-outline" aria-hidden="true"></i> Rename
            </button>
            <button type="submit" name="_edit" formaction="{% url 'dcim:interface_bulk_edit' %}?device={{ object.pk }}&return_url={% url 'dcim:device_interfaces' pk=object.pk %}" class="btn btn-warning btn-sm">
                <i class="mdi mdi-pencil" aria-hidden="true"></i> Edit
            </button>
            <button type="submit" name="_disconnect" formaction="{% url 'dcim:interface_bulk_disconnect' %}?return_url={% url 'dcim:device_interfaces' pk=object.pk %}" class="btn btn-outline-danger btn-sm">
                <span class="mdi mdi-ethernet-cable-off" aria-hidden="true"></span> Disconnect
            </button>
        {% endif %}
        {% if perms.dcim.delete_interface %}
            <button type="submit" name="_delete" formaction="{% url 'dcim:interface_bulk_delete' %}?return_url={% url 'dcim:device_interfaces' pk=object.pk %}" class="btn btn-danger btn-sm">
                <i class="mdi mdi-trash-can-outline" aria-hidden="true"></i> Delete
            </button>
        {% endif %}
        </div>
        {% if perms.dcim.add_interface %}
            <div class="bulk-button-group">
                <a href="{% url 'dcim:interface_add' %}?device={{ object.pk }}&return_url={% url 'dcim:device_interfaces' pk=object.pk %}" class="btn btn-primary btn-sm">
                    <i class="mdi mdi-plus-thick" aria-hidden="true"></i> Add Interfaces
                </a>
            </div>
        {% endif %}
    </div>
  </form>
  {% table_config_form table %}
{% endblock %}