{% load i18n %}
{% load utilities %}
{% load humanize %}
{% load bookwyrm_tags %}
<!-- TODO: do we need this? -->
{% if request.GET.updated %}
<div class="notification is-primary">
    {% trans "You successfully added a user to this group!" %}
</div>
{% endif %}

<h2 class="heading">Group Members</h2>
<p class="subtitle is-6">{% trans "Members can add and remove books on your group's book lists" %}</p>

{% block panel %}
<div class="block">
    <form class="field has-addons" method="get" action="{% url 'group-find-users' group.id %}">
        <div class="control">
            <input type="text" name="query" value="{{ request.GET.query }}" class="input" placeholder="{% trans 'Search to add a user' %}" aria-label="{% trans 'Search to add a user' %}">
        </div>
        <div class="control">
            <button class="button" type="submit">
                <span class="icon icon-search" title="{% trans 'Search' %}">
                    <span class="is-sr-only">{% trans "Search" %}</span>
                </span>
            </button>
        </div>
    </form>
    {% include 'snippets/suggested_users.html' with suggested_users=suggested_users %}
</div>
{% endblock %}

<div class="column is-flex is-flex-grow-0">
  {% for member in group.members.all %}
  <div class="box has-text-centered is-shadowless has-background-white-bis my-0 mx-2">
      <a href="{{ member.local_path }}" class="has-text-black">
          {% include 'snippets/avatar.html' with user=member large=True %}
          <span title="{{ member.display_name }}" class="is-block is-6 has-text-weight-bold">{{ member.display_name|truncatechars:10 }}</span>
          <span title="@{{ member|username }}" class="is-block pb-3">@{{ member|username|truncatechars:8 }}</span>
      </a>
      {% if group.user == member %}
      <span class="icon icon-star-full" title="Manager">
        <span class="is-sr-only">Manager</span>
      </span>
      {% endif %}
      {% include 'snippets/add_to_group_button.html' with user=member minimal=True %}
      {% if member.mutuals %}
      <p class="help">
          {% blocktrans trimmed with mutuals=member.mutuals|intcomma count counter=member.mutuals %}
          {{ mutuals }} follower you follow
          {% plural %}
          {{ mutuals }} followers you follow{% endblocktrans %}
      </p>
      {% elif member.shared_books %}
      <p class="help">
          {% blocktrans trimmed with shared_books=member.shared_books|intcomma count counter=member.shared_books %}
          {{ shared_books }} book on your shelves
          {% plural %}
          {{ shared_books }} books on your shelves
          {% endblocktrans %}
      </p>
      {% elif request.user in member.following.all %}
      <p class="help">
          {% trans "Follows you" %}
      </p>
      {% endif %}
    </div>
    {% endfor %}
  </div>