{% extends "group/edit_base.html" %}

{% block subtitle %}{{ _('Members') }} {{ g.template_title_delimiter }} {{ group_dict.display_name }} {{ g.template_title_delimiter }} {{ h.humanize_entity_type('group', group_type, 'page title') or _('Groups') }}{% endblock %}

{% block breadcrumb_content_inner %}
  <li>{% link_for group.display_name|truncate(35), named_route=group_type+'.read', id=group.name, title=group.display_name %}</li>
  <li class="active">{% link_for _('Manage members'), named_route=group_type+'.manage_members', id=group.name %}</li>
{% endblock %}

{% block page_primary_action %}
  {% link_for _('Add Member'), named_route=group_type+'.member_new', id=group_dict.id, class_='btn btn-primary', icon='plus-square' %}
  {% link_for _('CSV'), named_route=group_type+'.member_dump', id=group_dict.id, class_='btn btn-primary', icon='download' %}
{% endblock %}

{% block primary_content_inner %}
  <h1 class="page-heading">{{ _('Members') }}</h1>
  <h2>{{ _('{0} members'.format(members|length)) }}</h2>
  <table class="table table-header table-hover table-bordered" id="member-table">
    <thead>
      <tr>
        <th>{{ _('User') }}</th>
        <th>{{ _('Role') }}</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      {% for user_id, user, role in members %}
      <tr>
        <td class="media">
          {{ h.linked_user(user_id, maxlength=20) }}
        </td>
        <td>{{ role }}</td>
        <td>
          <div class="btn-group pull-right">
            <a class="btn btn-secondary btn-sm" href="{{ h.url_for(group_type + '.member_new', id=group_dict.id, user=user_id) }}" aria-label="{{ _('Edit role') }}" aria-description="{{ _('Edit the role of the user within the group') }}" data-bs-title="{{ _('Edit role') }}" data-bs-toggle="tooltip">
              <i class="fa fa-wrench"></i>
            </a>
            <a class="btn btn-danger btn-sm" href="{{ h.url_for(group_type + '.member_delete', id=group_dict.id, user=user_id) }}" data-module="confirm-action" data-module-content="{{ _('Are you sure you want to delete this member?') }}" aria-label="{{ _('Delete member') }}" aria-description="{{ _('Delete this member from the group') }}" data-bs-title="{{ _('Delete member') }}" data-bs-toggle="tooltip">{% block delete_button_text %}<i class="fa fa-times"></i>{% endblock %}</a>
          </div>
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
{% endblock %}