{% extends "pages/challenge_settings_base.html" %}
{% load url %}
{% load profiles %}
{% load static %}

{% block content %}

    {% block content_title %}
        <h2>Users</h2>
    {% endblock %}

    <div class="table-responsive">
        <table class="table table-hover table-borderless table-sm" id="usersTable">
            <thead class="thead-light">
            <tr>
                <th>Username</th>
                <th>Name</th>
                <th>Institution</th>
                <th>Department</th>
                <th>Location</th>
                <th>Website</th>
                {% block tableExtraHeaders %}
                {% endblock tableExtraHeaders %}
            </tr>
            </thead>
            <tbody>

            {% for user in object_list %}

                <tr>
                    <td>
                        {{ user|user_profile_link }}
                    </td>
                    <td>
                        {{ user.get_full_name }}
                    </td>
                    <td>
                        {{ user.user_profile.institution }}
                    </td>
                    <td>
                        {{ user.user_profile.department }}
                    </td>
                    <td>
                        {{ user.user_profile.country.name }}
                    </td>
                    <td>
                        <a href="{{ user.user_profile.website }}">
                            {{ user.user_profile.website }}
                        </a>
                    </td>
                    {% block tableExtraBody %}
                    {% endblock tableExtraBody %}
                </tr>

            {% endfor %}

            </tbody>

        </table>
    </div>
{% endblock %}

{% block script %}
    {{ block.super }}

    <script type="module" src="{% static 'participants/js/user_list.mjs' %}"></script>

{% endblock %}