{# SPDX-FileCopyrightText: 2026 Marcin Zieba <marcinpsk@gmail.com> #}
{# SPDX-License-Identifier: Apache-2.0 #}
{# Apply the Server selection after the user chooses its Servers. #}
<div class="dropdown">
  <button class="btn btn-outline-secondary dropdown-toggle" type="button"
          data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
    <i class="mdi mdi-server-network"></i>
    Servers
    {% if server_scope.is_invalid %}
      <span class="badge text-bg-warning ms-1">Invalid</span>
    {% elif server_scope.selected_pks %}
      <span class="badge text-bg-primary ms-1">{{ server_scope.selected_pks|length }}</span>
    {% else %}
      <span class="badge text-bg-secondary ms-1">All</span>
    {% endif %}
  </button>
  <div class="dropdown-menu p-3" style="min-width: 260px;">
    <form id="server-filter-form" method="get" action="{{ request.path }}">
      {% for name, value in server_selector_fields %}
        <input type="hidden" name="{{ name }}" value="{{ value }}">
      {% endfor %}
      <div class="mb-2 fw-semibold text-muted small text-uppercase">Select servers</div>
      {% if server_scope.all_servers %}
        {% for server in server_scope.all_servers %}
        <div class="form-check mb-1">
          <input class="form-check-input" type="checkbox"
                 name="server" value="{{ server.pk }}"
                 id="srv_{{ server.pk }}"
                 {% if server.pk in server_scope.selected_pks %}checked{% endif %}>
          <label class="form-check-label" for="srv_{{ server.pk }}">
            {{ server.name }}
            {% if server.dhcp4 %}<span class="badge text-bg-primary ms-1" style="font-size:0.65em">v4</span>{% endif %}
            {% if server.dhcp6 %}<span class="badge text-bg-info ms-1" style="font-size:0.65em">v6</span>{% endif %}
          </label>
        </div>
        {% endfor %}
        <button type="submit" class="btn btn-sm btn-primary w-100 mt-2">Apply</button>
        {% if server_scope.selected_pks %}
        <div class="mt-2 border-top pt-2">
          <a href="{{ server_scope.all_servers_url }}" class="btn btn-sm btn-outline-secondary w-100">
            <i class="mdi mdi-refresh"></i> Show all servers
          </a>
        </div>
        {% endif %}
      {% else %}
        <div class="text-muted small">No servers configured.</div>
      {% endif %}
    </form>
  </div>
</div>