{% extends 'dcim/device/base.html' %}
{% load helpers %}
{% load i18n %}
{% load kentik_filters %}

{% block content %}
  {% if kentik_device %}
  <div class="row mb-3">
    <div class="col-md-6">
      <div class="card">
        <h2 class="card-header">{% trans "Device" %}</h2>
        <table class="table table-hover attr-table">
          <tr>
            <th scope="row">{% trans "ID" %}</th>
            <td>{{ kentik_device.id }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Name" %}</th>
            <td>{{ kentik_device.deviceName }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Alias" %}</th>
            <td>{{ kentik_device.deviceAlias|placeholder }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Type" %}</th>
            <td><code>{{ kentik_device.deviceType }}</code>{% if kentik_device.deviceSubtype %} / <code>{{ kentik_device.deviceSubtype }}</code>{% endif %}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Description" %}</th>
            <td>{{ kentik_device.deviceDescription|placeholder }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Role" %}</th>
            <td>{{ kentik_device.role|placeholder }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Manufacturer" %}</th>
            <td>{{ kentik_device.deviceManufacturer|placeholder }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Site ID" %}</th>
            <td>{{ kentik_device.site.id }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Site name" %}</th>
            <td>{{ kentik_device.site.siteName }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Sending IPs" %}</th>
            <td>{% kentik_ip_links kentik_device.sendingIps %}</td>
          </tr>
            <tr>
                <th scope="row"> </th>
                <td>{% kentik_dates kentik_device.createdDate kentik_device.updatedDate %}</td>
            </tr>
        </table>
      </div>
      <div class="card mt-3">
        <h2 class="card-header">{% trans "Plan" %}</h2>
        <table class="table table-hover attr-table">
          <tr>
            <th scope="row">{% trans "ID" %}</th>
            <td>{{ kentik_device.plan.id }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Name" %}</th>
            <td>{{ kentik_device.plan.name }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Active" %}</th>
            <td>{% checkmark kentik_device.plan.active %}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "BGP" %}</th>
            <td>{% checkmark kentik_device.plan.bgp %}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Description" %}</th>
            <td>{{ kentik_device.plan.description|placeholder }}</td>
          </tr>
            <tr>
                <th scope="row"> </th>
                <td>{% kentik_dates kentik_device.plan.cdate kentik_device.plan.edate %}</td>
            </tr>
        </table>
      </div>
    </div>
    <div class="col-md-6">
      <div class="card">
        <h2 class="card-header">{% trans "BGP" %}</h2>
        <table class="table table-hover attr-table">
          <tr>
            <th scope="row">{% trans "Kentik peer IPv4" %}</th>
            <td>{{ kentik_device.bgpPeerIp4|strip_host_mask|placeholder }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Kentik peer IPv6" %}</th>
            <td>{{ kentik_device.bgpPeerIp6|strip_host_mask|placeholder }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Neighbor ASN" %}</th>
            <td>{% kentik_asn_link kentik_device.deviceBgpNeighborAsn %}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Neighbor IPv4" %}</th>
            <td>{% kentik_ip_links kentik_device.deviceBgpNeighborIp %}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Neighbor IPv6" %}</th>
            <td>{% kentik_ip_links kentik_device.deviceBgpNeighborIp6 %}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Flowspec" %}</th>
            <td>{% checkmark kentik_device.deviceBgpFlowspec %}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Labeled unicast" %}</th>
            <td>{% checkmark kentik_device.deviceBgpLabelUnicast %}</td>
          </tr>
          {% if kentik_device.deviceProxyBgp or kentik_device.deviceProxyBgp6 %}
          <tr>
            <th scope="row">{% trans "Proxy IPv4" %}</th>
            <td>{{ kentik_device.deviceProxyBgp|placeholder }}</td>
          </tr>
          <tr>
            <th scope="row">{% trans "Proxy IPv6" %}</th>
            <td>{{ kentik_device.deviceProxyBgp6|placeholder }}</td>
          </tr>
          {% endif %}
        </table>
      </div>
      <div class="card mt-3">
        <h2 class="card-header">{% trans "Labels" %}</h2>
        {% if kentik_device.labels %}
        <table class="table table-hover attr-table">
          {% for label in kentik_device.labels|dictsort:"name" %}
          <tr>
            <td>{{ label.id }}</td>
            <td><span class="badge" style="background-color: {{ label.color }}; color: #fff;">{{ label.name }}</span></td>
            <td>
              {{ label.description|placeholder }}
              {% kentik_dates label.cdate label.edate %}
            </td>
          </tr>
          {% endfor %}
        </table>
        {% else %}
        <div class="card-body">
          <div class="alert alert-info d-flex align-items-center mb-0" role="alert">
            <span class="text-info fs-1">
              <i class="mdi mdi-information"></i>
            </span>
            <span class="flex-fill">
            {% blocktrans %}
                No labels are set on this device.
            {% endblocktrans %}
            </span>
          </div>
        </div>
        {% endif %}
      </div>
      {% include 'netbox_kentik/inc/match_info_card.html' %}
    </div>
  </div>
  {% else %}
  <div class="alert alert-warning d-flex align-items-center" role="alert">
      <span class="text-warning fs-1">
        <i class="mdi mdi-alert"></i>
      </span>
      <span class="flex-fill">
      {% blocktrans %}
          Error retrieving device from Kentik cache.
      {% endblocktrans %}
      </span>
  </div>
  {% endif %}
{% endblock content %}