{% extends "channel-base.html" %}

{% block extra_config %}
  {% if let BackendConfig::Email(email_data) = channel.backend_config %}
    <section class="mb-4">
      <form
        method="post"
        action="{{ breadcrumbs.join("update-email-recipient") }}"
      >
        <div class="mb-3">
          <label for="channel-recipient-input" class="form-label">Recipient Email</label>
          <input
            type="text"
            class="form-control"
            id="channel-recipient-input"
            name="recipient"
            value="{{ email_data.recipient }}"
            aria-describedby="channel-recipient-help"
          >
          <div id="channel-recipient-help" class="form-text">
            {% if email_data.verified %}
              Updating this will require verification of the new recipient.
            {% else %}
              Recipient must be verified before they can receive messages.
            {% endif %}
          </div>
        </div>
        <div class="mb-3">
          <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
          <button class="btn btn-primary" type="submit">Send Verification</button>
        </div>
      </form>
    </section>
    {% if email_data.recipient != "" && !email_data.verified %}
      <section class="mb-4">
        <form
          method="post"
          action="{{ breadcrumbs.join("verify-email") }}"
        >
          <div class="mb-3">
            <label for="channel-recipient-verification-code" class="form-label">
              Verification Code
            </label>
            <input
              type="text"
              class="form-control"
              name="code"
              id="channel-recipient-verification-code"
              aria-describedby="channel-recipient-verification-code-help"
            >
            <div id="channel-recipient-verification-code-help" class="form-text">
              Enter the most recent Shout.dev verification code for this address.
              <input
                type="submit"
                form="email-verification-form"
                class="btn btn-link align-baseline p-0"
                type="submit"
                style="font-size: inherit;"
                value="Re-send verification email"
              >
            </div>
          </div>
          <div class="mb-3">
            <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
            <button class="btn btn-primary" type="submit">Verify</button>
          </div>
        </form>
        <form
          id="email-verification-form"
          method="post"
          action="{{ breadcrumbs.join("update-email-recipient") }}"
        >
          <input type="hidden" name="recipient" value="{{ email_data.recipient }}">
          <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
        </form>
      </section>
    {% endif %}
  {% endif %}
{% endblock %}