{% extends "pobsync_backend/base.html" %}

{% block title %}Notifications | pobsync{% endblock %}

{% block content %}
  <header class="page-header">
    <div class="page-title">
      <div class="page-kicker">Reports</div>
      <h1>Notifications</h1>
      <div class="page-subtitle">Send email or webhook reports when backup runs finish.</div>
    </div>
    <section class="actions" aria-label="Notification actions">
      <a class="button-link" href="{% url 'create_notification_target' %}">New target</a>
      <a class="button-link secondary" href="{% url 'dashboard' %}">Back to dashboard</a>
    </section>
  </header>

  <section class="panel">
    <h2>Targets</h2>
    <table>
      <thead>
        <tr>
          <th>Name</th>
          <th>Channel</th>
          <th>Status</th>
          <th>Events</th>
          <th>Destination</th>
          <th>Last delivery</th>
          <th>Actions</th>
        </tr>
      </thead>
      <tbody>
        {% for target in targets %}
          <tr>
            <td><a href="{% url 'edit_notification_target' target.id %}">{{ target.name }}</a></td>
            <td>{{ target.get_channel_display }}</td>
            <td><span class="status {% if target.enabled %}ok{% else %}skipped{% endif %}">{{ target.enabled|yesno:"enabled,disabled" }}</span></td>
            <td>{{ target.statuses|join:", " }}</td>
            <td>
              {% if target.channel == "email" %}
                {{ target.email_to|linebreaksbr }}
              {% else %}
                <code>{{ target.webhook_url|truncatechars:70 }}</code>
              {% endif %}
            </td>
            <td>
              {% if target.last_status %}
                <span class="status {{ target.last_status }}">{{ target.last_status }}</span>
                {% if target.last_error %}<div class="muted">{{ target.last_error|truncatechars:90 }}</div>{% endif %}
                {% if target.last_sent_at %}<div class="muted">{{ target.last_sent_at }}</div>{% endif %}
              {% else %}
                <span class="muted">none</span>
              {% endif %}
            </td>
            <td><a class="button-link secondary" href="{% url 'edit_notification_target' target.id %}">Edit</a></td>
          </tr>
        {% empty %}
          <tr><td colspan="7" class="muted">No notification targets configured yet.</td></tr>
        {% endfor %}
      </tbody>
    </table>
  </section>

  <section class="panel">
    <h2>Recent Deliveries</h2>
    <table>
      <thead>
        <tr>
          <th>Target</th>
          <th>Run</th>
          <th>Status</th>
          <th>Created</th>
          <th>Error</th>
        </tr>
      </thead>
      <tbody>
        {% for delivery in deliveries %}
          <tr>
            <td>{{ delivery.target.name }}</td>
            <td><a href="{% url 'run_detail' delivery.run.id %}">Run {{ delivery.run.id }}</a> {{ delivery.run.host.host }}</td>
            <td><span class="status {{ delivery.status }}">{{ delivery.status }}</span></td>
            <td>{{ delivery.created_at }}</td>
            <td class="muted">{{ delivery.error|default:"" }}</td>
          </tr>
        {% empty %}
          <tr><td colspan="5" class="muted">No notification deliveries recorded yet.</td></tr>
        {% endfor %}
      </tbody>
    </table>
  </section>
{% endblock %}