{% extends "dac/base.html" %}
{% load static i18n %}

{% block title %}
  {% trans "Manage email" %}
{% endblock title %}

{% block page.breadcrumbs %}
  {{ block.super }}
  <c-breadcrumbs.item text="{% trans "Manage email" %}" />
{% endblock page.breadcrumbs %}

{% block page.content %}
  {% if emailaddresses %}
    <c-card title="{% trans "Your email addresses" %}"
            fs="3"
            icon="email">
      <c-list-group flush :border="False">
        {% for radio in emailaddress_radios %}
          {% with emailaddress=radio.emailaddress %}
            <c-list-group.item>
              <div class="d-flex align-items-center w-100 gap-2">
                <span>{{ emailaddress }}</span>
                <!-- Email badges -->
                <div class="d-flex gap-1">
                  {% if emailaddress.primary %}
                    <c-badge text="{% trans "Primary" %}" />
                  {% endif %}
                  {% if emailaddress.verified %}
                    <c-badge variant="success" text="{% trans "Verified" %}" />
                  {% else %}
                    <c-badge variant="secondary"
                             text="{% trans "Unverified" %}" />
                  {% endif %}
                </div>
                <c-dropdown icon="three-dots"
                            :caret="False"
                            align="end"
                            dropdown_class="ms-auto">
                  <form method="post" action="{% url "account_email" %}">
                    {% csrf_token %}
                    <input type="hidden"
                           name="email"
                           value="{{ emailaddress.email }}" />
                    {# "Make primary" only applies to non-primary addresses; the current primary cannot promote itself. #}
                    {% if not emailaddress.primary %}
                      <c-dropdown.item type="submit"
                                       name="action_primary"
                                       text="{% trans "Make primary" %}" />
                    {% endif %}
                    {# "Re-send verification" is only useful for unverified addresses. #}
                    {% if not emailaddress.verified %}
                      <c-dropdown.item type="submit"
                                       name="action_send"
                                       text="{% trans "Re-send verification" %}" />
                    {% endif %}
                    {# Divider appears only when there are action items above it (i.e. this is not the primary address). #}
                    {% if not emailaddress.primary %}<c-dropdown.divider />{% endif %}
                    {# "Remove" is always shown but rendered disabled for the primary address, which cannot be deleted. #}
                    <c-dropdown.item type="submit"
                                     class="{% if emailaddress.primary %}disabled{% else %}link-danger{% endif %}"
                                     icon="delete"
                                     name="action_remove"
                                     text="{% trans "Remove" %}" />
                  </form>
                </c-dropdown>
              </div>
              {# Show a description blurb only under the primary address row. #}
              {% if emailaddress.primary %}
                <c-text text="{% trans "This email address is the default for notifications and account-related activity." %}"
                        small
                        tight />
              {% endif %}
            </c-list-group.item>
          {% endwith %}
        {% endfor %}
      </c-list-group>
      {# Show the "add email" form only when the user hasn't reached the configured address limit (ACCOUNT_MAX_EMAIL_ADDRESSES). #}
      <c-card.section :condition="can_add_email"
                      divider
                      message="{% trans "Add a backup email in case you lose access to the others." %}">
        <c-form id="addEmailForm"
                method="post"
                action="{% url "account_email" %}"
                :form-obj="form">
          <c-slot name="actions">
            <c-button text="{% trans "Add email" %}"
                      icon="add"
                      name="action_add"
                      type="submit"
                      variant="primary" />
          </c-slot>
        </c-form>
      </c-card.section>
    </c-card>
  {% else %}
    {% include "account/snippets/warn_no_email.html" %}
  {% endif %}
{% endblock page.content %}

{% block extra_js %}
  <script src="{% static "account/js/account.js" %}"></script>
  <script src="{% static "account/js/onload.js" %}"></script>
  {# djlint:off #}
  <script data-allauth-onload="allauth.account.forms.manageEmailForm" type="application/json">
    {
      "i18n": {
        "confirmDelete": "{% trans "Do you really want to remove the selected email address?" %}"
      }
    }
</script>
  {# djlint:on #}
{% endblock extra_js %}