{# SPDX-License-Identifier: Apache-2.0 #}
{# Copyright (C) 2025 Marcin Zieba <marcinpsk@gmail.com> #}
{# Lazy-loaded fragment: Nokia L2 services (M37 P2a) — paginated from last-synced state. #}
<div class="nso-cat-pager"
     data-url="{% url 'plugins:netbox_nso_plugin:device_nso_category' pk=object.pk key='l2_services' %}"
     data-q="{{ q }}" data-page="{{ page.number }}">
  <div class="nso-cat-results">
    {% include "netbox_nso_plugin/categories/_adapter_error.html" %}
    <div class="nso-cat-msg"></div>
    {% include "netbox_nso_plugin/categories/_cat_search.html" with placeholder=placeholder q=q %}
    {% if l2_sap_states %}
    <p class="text-muted small mb-2">Service and SAP ID form the structural identity. The SAP ID includes its port and interface-local dot1q encapsulation (not a VLAN). Accept makes NetBox the source of truth and writes the SAP on Apply; epipe and vpls are supported.</p>
    <div class="table-responsive">
      <table class="table table-sm table-hover mb-0">
        <thead>
          <tr><th>Service</th><th>SAP endpoint</th><th>Status</th><th>Last Synced</th><th></th></tr>
        </thead>
        <tbody>
          {% for sap in l2_sap_states %}
          <tr data-status="{{ sap.status }}" data-owned="{{ sap.accepted_at|yesno:'true,false' }}">
            <td>
              <span class="fw-semibold">{{ sap.service_name }}</span>
              <div class="small">
                {% if sap.service_type == "vpls" %}<span class="badge text-bg-primary">vpls</span>{% elif sap.service_type == "epipe" %}<span class="badge text-bg-info">epipe</span>{% else %}<span class="badge text-bg-secondary">{{ sap.service_type|default:"unknown" }}</span>{% endif %}
                {% if sap.l2vpn %} · <a href="{{ sap.l2vpn.get_absolute_url }}">L2VPN</a>{% endif %}
              </div>
            </td>
            <td>
              <code class="text-break">{{ sap.sap_id }}</code>
              {% if sap.port %}<div class="small"><span class="text-muted">port:</span> {% if sap.port_url %}<a href="{{ sap.port_url }}">{{ sap.port }}</a>{% else %}<span class="text-warning" title="Port not present in NetBox">{{ sap.port }}</span>{% endif %}</div>{% endif %}
            </td>
            <td>{% include "netbox_nso_plugin/categories/_state_badge.html" with status=sap.status residue=sap.residue_survivor residue_job=sap.residue_job_id %}</td>
            <td class="text-nowrap">{% if sap.last_sync_at %}{{ sap.last_sync_at|date:"Y-m-d H:i" }}{% else %}—{% endif %}</td>
            <td class="text-nowrap">
              {% if sap.service_type == "epipe" or sap.service_type == "vpls" %}
                {% url 'plugins:netbox_nso_plugin:l2_accept_sap' pk=sap.pk as accept_url %}{% include "netbox_nso_plugin/categories/_accept_cell.html" with accept_url=accept_url status=sap.status form_class="nso-row-form" title="Make NetBox the source of truth for this SAP (written to the device on Apply)" %}
              {% else %}
                <span class="badge text-bg-secondary" title="The current SAP writer supports only epipe and vpls services">read-only</span>
              {% endif %}
            </td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
    {% include "netbox_nso_plugin/categories/_cat_pager.html" with page=page %}
    {% else %}
    <p class="text-muted mb-0">No L2 services{% if q %} matching “{{ q }}”{% else %} reported for this device{% endif %}.</p>
    {% endif %}
  </div>
</div>