{% extends "socialaccount/base_manage.html" %}
{% comment %}
SPDX-FileCopyrightText: 2023 Helmholtz-Zentrum Dresden-Rossendorf (HZDR)

SPDX-License-Identifier: GPL-3.0-or-later
{% endcomment %}
{% load allauth account socialaccount %}
{% block head_title %}
  Account Connections
{% endblock head_title %}
{% block content %}
  {% include "allauth/elements/heliport_heading.html" with text="Account Connections" %}
  {% if form.accounts %}
    <p>You can sign in to your account using any of the following third-party accounts:</p>
    <form method="post" action="{% url 'socialaccount_connections' %}">
      {% csrf_token %}
      <fieldset>
        {% include "allauth/elements/heliport_form_errors.html" with errors=form.non_field_errors %}
        {% for base_account in form.accounts %}
          {% with base_account.get_provider_account as account %}
            <div class="form-check mb-3">
              <input class="form-check-input"
                     id="id_account_{{ base_account.id }}"
                     type="radio"
                     name="account"
                     value="{{ base_account.id }}" />
              <label class="form-check-label" for="id_account_{{ base_account.id }}">
                {{ account }} ({{ account.get_brand.name }})
                <i class="fa-solid fa-circle-info"
                   title="Click to show additional information"
                   _="on click toggle .d-none on #info_{{ base_account.id }}"></i>
              </label>
              <label id="info_{{ base_account.id }}"
                     class="d-block d-none"
                     for="id_account_{{ base_account.id }}">
                <pre><code>{{ base_account.extra_data | pprint }}</code></pre>
              </label>
            </div>
          {% endwith %}
        {% endfor %}
        <div class="d-grid">
          <button class="btn btn-danger" type="submit">Remove</button>
        </div>
      </fieldset>
    </form>
  {% else %}
    <p>You currently have no social network accounts connected to this account.</p>
  {% endif %}
  <hr />
  <p>Add a third party account:</p>
  {% include "allauth/elements/heliport_socialaccounts_list_form.html" with process="connect" %}
{% endblock content %}