{% extends "generic/base.html" %}
{% load crispy_forms_tags %}

{% block content %}
    <div class="d-flex justify-content-between align-items-center mb-3 flex-wrap gap-2">
        <h2>Users</h2>
        <div class="d-flex gap-2">
            <a href="{% url 'create_user' %}" class="btn btn-primary">
                <i class="bi bi-person-plus me-1"></i>Create single user
            </a>
            <a href="{% url 'accounts_bulk_create' %}" class="btn btn-outline-primary">
                <i class="bi bi-people me-1"></i>Bulk create users
            </a>
        </div>
    </div>

    <details class="filter card mb-3">
        <summary class="card-header cursor-pointer fw-bold">
            Filter users list
        </summary>
        <div class="card-body">
            <form method="get" class="row row-cols-lg-auto g-3 align-items-center">
                {{ filter.form|crispy }}
                <div class="col-12 mt-3 mt-lg-0">
                    <button type="submit" class="btn btn-primary">Filter</button>
                    <a href="{% url 'accounts_list' %}" class="btn btn-outline-secondary ms-1">Reset</a>
                </div>
            </form>
        </div>
    </details>

    <div class="mb-2 text-muted fw-semibold">
        {{ object_list|length }} Users shown.
    </div>

    <ul id="user-list" class="list-group mb-3">
        {% for list_user in object_list %}
            <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2">
                <div>
                    <span class="username fw-bold">@<a href="{% url 'account_profile' list_user.username %}">{{ list_user.username }}</a></span>
                    <span class="name ms-3 text-muted">Name: {{ list_user.first_name }} {{ list_user.last_name }}</span>
                    {% if list_user.userprofile.grade %}
                        <span class="badge bg-secondary ms-2">Grade: {{ list_user.userprofile.grade }}</span>
                    {% endif %}
                    <span class="ms-2 small text-muted">Supervisor: {{ list_user.userprofile.supervisor|default:"None" }}</span>
                    <div class="text-muted small mt-1">Registration number: {{ list_user.userprofile.registration_number|default:"N/A" }}</div>
                </div>
                <div class="btn-group btn-group-sm" role="group">
                    <a class="btn btn-outline-secondary" href="{% url 'account_update' list_user.username %}">Edit user</a>
                    <a class="btn btn-outline-secondary" href="{% url 'account_profile_update' list_user.username %}">Edit profile</a>
                    {% if user.is_superuser %}
                        <a class="btn btn-outline-info" href="{% url 'admin:auth_user_change' list_user.id %}">Admin edit</a>
                        <a class="btn btn-outline-danger" href="{% url 'admin:auth_user_delete' list_user.id %}">Delete</a>
                    {% endif %}
                </div>
            </li>
        {% endfor %}
    </ul>
{% endblock %}