{% extends "base.html" %}
{% block title %}Destinations{% endblock %}

{% block content %}
<div class="flex items-center justify-between mb-6">
  <h1 class="text-xl font-bold text-gray-900">Destinations de transfert</h1>
  <a href="{{ url_for('destination_new') }}"
     class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg text-sm font-medium transition">
    + Nouvelle destination
  </a>
</div>

{% if not destinations %}
  <div class="bg-white rounded-xl border border-gray-200 px-6 py-12 text-center text-gray-400">
    <p class="text-lg">Aucune destination configurée.</p>
    <p class="text-sm mt-2">Les archives sont conservées localement uniquement.</p>
    <a href="{{ url_for('destination_new') }}" class="mt-4 inline-block text-blue-600 hover:underline text-sm">
      Configurer une première destination →
    </a>
  </div>
{% else %}
  <div class="space-y-4">
    {% for dest in destinations %}
    <div class="bg-white rounded-xl border border-gray-200 shadow-sm p-5">
      <div class="flex items-start justify-between gap-4">
        <div class="space-y-1 min-w-0">
          <div class="flex items-center gap-2">
            <span class="font-semibold text-gray-900">{{ dest.name }}</span>
            {% if dest.enabled %}
              <span class="bg-green-100 text-green-700 text-xs px-2 py-0.5 rounded-full font-medium">actif</span>
            {% else %}
              <span class="bg-gray-100 text-gray-500 text-xs px-2 py-0.5 rounded-full font-medium">inactif</span>
            {% endif %}
          </div>
          <p class="text-sm font-mono text-gray-600">
            {{ dest.user }}@{{ dest.host }}:{{ dest.port }} → {{ dest.remote_path }}
          </p>
          {% if dest.jobs %}
            <p class="text-xs text-gray-400">
              Utilisée par : {{ dest.jobs | map(attribute='name') | join(', ') }}
            </p>
          {% endif %}
        </div>

        <div class="flex items-center gap-2 shrink-0">
          <form method="post" action="{{ url_for('destination_test', dest_id=dest.id) }}">
            <button type="submit"
              class="bg-gray-50 hover:bg-gray-100 text-gray-700 text-xs px-3 py-1.5 rounded border border-gray-200 transition">
              Tester
            </button>
          </form>
          <a href="{{ url_for('destination_edit', dest_id=dest.id) }}"
             class="bg-gray-50 hover:bg-gray-100 text-gray-700 text-xs px-3 py-1.5 rounded border border-gray-200 transition">
            Éditer
          </a>
          <form method="post" action="{{ url_for('destination_delete', dest_id=dest.id) }}"
                onsubmit="return confirm('Supprimer la destination « {{ dest.name }} » ?')">
            <button type="submit"
              class="text-red-300 hover:text-red-600 text-xs px-2 py-1.5 rounded hover:bg-red-50 transition">
              ✕
            </button>
          </form>
        </div>
      </div>
    </div>
    {% endfor %}
  </div>
{% endif %}
{% endblock %}