{% extends "socialaccount/base.html" %}
{% load i18n %}

{% block title %}{{ block.super }} - {% trans "Account Connections" %}{% endblock title %}
{% block page_title %}{% trans "Account Connections" %}{% endblock page_title %}

{% block content %}
{% if form.accounts %}
  <p>{% blocktrans %}You can sign in to your account using any of the following third party accounts:{% endblocktrans %}</p>

  <form method="post" action="{% url 'socialaccount_connections' %}">
    {% csrf_token %}
    {% if form.non_field_errors %}<div class="text-error">{{form.non_field_errors}}</div>{% endif %}

    <table class="table table-condensed">
      <thead>
        <tr>
          <th><span class="sr-only">{% trans "Select" %}</span></th>
          <th>{% trans "Provider" %}</th>
          <th>{% trans "Account name" %}</th>
        </tr>
      </thead>
      <tbody>
      {% for base_account in form.accounts %}
      {% with account=base_account.get_provider_account provider=base_account.provider %}
        <tr>
          <td><input id="id_account_{{base_account.id}}" type="radio" name="account" value="{{base_account.id}}"/></td>
          <td><label for="id_account_{{base_account.id}}"><i
       class="fa fa-{% if provider == 'twitter' %}twitter{% elif provider == 'google' %}google{% elif provider == 'linkedin_oauth2' %}linkedin{% endif %}"></i> <span class="socialaccount_provider {{provider}} {{account.get_brand.id}}">{{account.get_brand.name}}</span></label></td>
          <td>{{ account }}</td>
        </tr>
      {% endwith %}
      {% endfor %}
      </tbody>
    </table>
    <button class="btn btn-warning" type="submit">{% trans 'Remove' %}</button>
  </form>
{% else %}
  <p>{% trans 'You currently have no social network accounts connected to this account.' %}</p>
{% endif %}

<h2>{% trans 'Add a 3rd Party Account' %}</h2>
<ul class="list-inline">
  {% include "socialaccount/snippets/provider_list.html" with process="connect" %}
</ul>
{% endblock %}

{% block extra_js %}
{% include "socialaccount/snippets/login_extra.html" %}
{% endblock extra_js %}