{% extends 'base.html' %}
{% load ui_extras %}

{% block content %}
<ol class="breadcrumb">
  <li class="breadcrumb-item"><a href="/">Home</a></li>
  <li class="breadcrumb-item"><a href="{% url 'accounts:users' %}">Users</a></li>
  <li class="breadcrumb-item active">{{ object.get_type_display|title }} {{ object }}</li>
</ol>

<div class="object-details">
    <div class="d-flex align-items-center mb-1">
        <h3 class="m-0">{{ object.get_type_display|title }} {{ object }}</h3>
        <div class="ms-auto">
            {% if perms.accounts.change_user and object.editable %}
                {% url 'accounts:update_user' object.pk as url %}
                {% button 'UPDATE' url "Edit User" %}
            {% endif %}
            {% if perms.accounts.delete_user and object.deletable %}
                {% url 'accounts:delete_user' object.pk as url %}
                {% button 'DELETE' url "Delete User" %}
            {% endif %}
        </div>
    </div>
    <table class="table-object-properties">
    <tbody>
        {% if object.is_service_account %}
        <tr>
        <th style="width:15%">name</th>
        <td>{{ object.username }}</td>
        </tr>
        <tr>
        <th>Description</th>
        <td>{{ object.description|default:"-"|linebreaks }}</td>
        </tr>
        {% else %}
        <tr>
        <th style="width:15%">Username</th>
        <td>{{ object.username }}</td>
        </tr>
        <tr>
        <th>Email</th>
        <td>{{ object.email }}</td>
        </tr>
        <tr>
        <th>Superuser?</th>
        <td>{{ object.is_superuser|yesno }}</td>
        </tr>
        <tr>
        <th>Remote?</th>
        <td>{{ object.is_remote|yesno }}</td>
        </tr>
        {% if not object.is_remote %}
        <tr>
        <th>Verification device{{ verification_devices|length|pluralize }}</th>
        <td>
            {% if verification_devices %}
            <dl class="row">
            {% for verification_device in verification_devices %}
            <dt class="col-sm-3 text-md-end">{{ verification_device.get_type_for_display }}</dt>
            <dd class="col-sm-9">{{ verification_device.name }}</dd>
            {% endfor %}
            </dl>
            {% else %}
            -
            {% endif %}
        </td>
        {% endif %}
        {% endif %}
        {% if object == request.user or perms.accounts.view_apitoken %}
        <tr>
        <th>API Token?</th>
        <td>
            {% if object.api_token %}
            yes
            {% if can_delete_token %}
                {% url 'accounts:delete_user_api_token' object.pk as url %}
                {% button 'DELETE' url "Delete API Token" %}
            {% endif %}
            {% else %}
            <form method="post" action="{% url 'accounts:create_user_api_token' object.pk %}">{% csrf_token %}
            no
            {% if can_add_token %}
                <button class="btn btn-link" type="submit"
                    data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-title="Add Token">
                    <span class="bi bi-plus-circle" aria-hidden="true"></span>
                </button>
            {% endif %}
            </form>
            {% endif %}
        </td>
        </tr>
        {% endif %}
        {% if perms.auth.view_group %}
        <tr>
        <th>Role{{ group_count|pluralize }}</th>
        <td>
            {% if group_count %}
            <ul class="list-inline">
            {% for group in groups %}
            <li><a href="{% url 'accounts:group' group.pk %}">{{ group }}</a></li>
            {% endfor %}
            </ul>
            {% else %}
            -
            {% endif %}
        </td>
        </tr>
        {% endif %}
        <tr>
            <th>Global items per page</th>
            <td>{{ object.items_per_page }}</td>
        </tr>
    </tbody>
    </table>
</div>
{% endblock %}