{% import "macro/table.html" as table %}
<table class="ui bottom attached table users">
    <thead>
        <tr>
            {% if user.can_read("photo") %}
                <th></th>
            {% endif %}
            {% if user.can_read("user_name") %}
                <th>{% trans %}Login{% endtrans %}</th>
            {% endif %}
            {% if user.can_read("family_name") or user.can_read("given_name") %}
                <th>{% trans %}Name{% endtrans %}</th>
            {% endif %}
            {% if user.can_manage_groups %}
                <th>{% trans %}Groups{% endtrans %}</th>
                <th>{% trans %}Actions{% endtrans %}</th>
            {% endif %}
        </tr>
    </thead>
    <tbody>
        {% for watched_user in table_form.items_slice %}
            <tr>
                {% if user.can_read("photo") %}
                    <td class="collapsing">
                        <a href="{{ url_for('core.account.profile_edition', edited_user=watched_user) }}">
                            {% if user.can_manage_users and watched_user.locked %}
                                <i class="lock circle big black icon" title="{% trans %}This account is locked{% endtrans %}"></i>
                            {% elif watched_user.photo and watched_user.photo %}
                                <img class="ui avatar image" src="{{ url_for("core.account.photo", user=watched_user, field="photo") }}" alt="User photo">
                            {% else %}
                                <i class="user circle big black icon"></i>
                            {% endif %}
                        </a>
                    </td>
                {% endif %}
                {% if user.can_read("user_name") %}
                    <td>
                        <a href="{{ url_for('core.account.profile_edition', edited_user=watched_user) }}">
                            {% if watched_user.user_name %}
                                {{ watched_user.user_name }}
                            {% else %}
                                {{ watched_user.identifier }}
                            {% endif %}
                        </a>
                    </td>
                {% endif %}
                {% if user.can_read("family_name") or user.can_read("given_name") %}
                    <td>{{ watched_user.formatted_name }}</td>
                {% endif %}
                {% if user.can_manage_groups %}
                    <td>
                        {% for group in watched_user.groups %}
                            <a class="ui label" href="{{ url_for('core.groups.group', group=group) }}"{% if group.description %} title="{{ group.description }}"{% endif %}>
                                {{ group.display_name }}
                            </a>
                        {% endfor %}
                    </td>
                    <td>
                        {% if edited_group.members|len > 1 %}
                            <form id="deletegroupmemberform-{{ watched_user.id }}" action="{{ url_for(request.url_rule.endpoint, **request.view_args) }}" method="POST">
                                {{ form.hidden_tag() if form.hidden_tag }}
                                <input type="hidden" name="member" value="{{ watched_user.id }}">
                                <button class="basic negative ui button" name="action" value="confirm-remove-member">
                                    {% trans %}Remove{% endtrans %}
                                </button>
                            </form>
                        {% else %}
                            <button class="basic negative ui button" title="{% trans %}Groups must have at least one member{% endtrans %}" disabled>
                                {% trans %}Remove{% endtrans %}
                            </button>
                        {% endif %}
                    </td>
                {% endif %}
            </tr>
        {% else %}
            <tr>
                <td colspan="5">
                    <div class="ui icon message">
                        <i class="exclamation icon"></i>
                        <div class="content">
                            {% if request.headers.get("Hx-Request") %}
                                <div class="header">
                                    {% trans %}No item matches your request{% endtrans %}
                                </div>
                                <p>{% trans %}Maybe try with different criterias?{% endtrans %}</p>
                            {% else %}
                                <div class="header">
                                    {% trans %}There is nothing here{% endtrans %}
                                </div>
                            {% endif %}
                        </div>
                    </div>
                </td>
            </tr>
        {% endfor %}
    </tbody>
    <tfoot>
        <tr>
            <th colspan="5">
                {{ table.pagination(table_form) }}
            </th>
        </tr>
    </tfoot>
</table>
