{% load i18n %}

<div class="card">
  <h2 class="card-header">{% trans "Port Mappings" %}</h2>
  <table class="table table-hover">
    {% if front_port_mappings %}
      <thead>
        <tr>
          <th>{% trans "Position" %}</th>
          <th>{% trans "Front Port" %}</th>
        </tr>
      </thead>
    {% endif %}
    <tbody>
      {% for mapping in front_port_mappings %}
        <tr>
          <td>{{ mapping.rear_port_position }}</td>
          <td>
            <a href="{{ mapping.front_port.get_absolute_url }}">{{ mapping.front_port }}:{{ mapping.front_port_position }}</a>
          </td>
        </tr>
      {% empty %}
        <tr>
          <td class="text-muted">{% trans "No mappings defined" %}</td>
        </tr>
      {% endfor %}
    </tbody>
  </table>
</div>