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

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

{% block content %}
  <header class="page-header">
    <div class="page-title">
      <div class="page-kicker">Reports</div>
      <h1>{{ title }}</h1>
      <div class="page-subtitle">Choose which completed backup statuses should trigger an email or webhook report.</div>
    </div>
    <section class="actions" aria-label="Notification target form actions">
      <a class="button-link" href="{% url 'notification_targets' %}">Back to notifications</a>
    </section>
  </header>

  <section class="panel">
    <h2>{% if target %}Edit Target{% else %}Create Target{% endif %}</h2>
    <form method="post" class="form-grid">
      {% csrf_token %}
      {{ form.non_field_errors }}

      {% for field in form %}
        <div class="field">
          {{ field.errors }}
          <label for="{{ field.id_for_label }}">{{ field.label }}</label>
          {{ field }}
          {% if field.help_text %}<div class="helptext">{{ field.help_text }}</div>{% endif %}
        </div>
      {% endfor %}

      <div class="form-actions">
        <button type="submit">{{ submit_label }}</button>
        <a class="button-link secondary" href="{% url 'notification_targets' %}">Cancel</a>
      </div>
    </form>
  </section>
{% endblock %}