{% extends 'base.jinja' %}

{% block title %}Formula 10 - Users{% endblock title %}

{% set active_page = "/users" %}

{% block body %}

    <div class="card shadow-sm mb-2">
        <div class="card-header">
            Add user
        </div>

        <div class="card-body">
            <form action="/user-add" method="post">
                <div class="input-group">
                    <div class="form-floating">
                        <input type="text" class="form-control" id="select-add-user" name="select-add-user"
                               placeholder="Username:">
                        <label for="select-add-user">Username:</label>
                    </div>

                    <input type="submit" class="form-control btn btn-danger" value="Add" style="max-width: 200px;">
                </div>
            </form>
        </div>
    </div>

    {% if model.all_users() | length > 0 %}
        <div class="card shadow-sm mb-2">
            <div class="card-header">
                Registered users
            </div>

            <div class="card-body">
                <ul class="list-group list-group-flush">
                    {% for user in model.all_users() %}
                        <li class="list-group-item">{{ user.name }}</li>
                    {% endfor %}
                </ul>
            </div>
        </div>

        <div class="card shadow-sm mb-2">
            <div class="card-header">
                Delete user
            </div>

            <div class="card-body">
                <form action="/user-delete" method="post">
                    <div class="input-group">
                        <select class="form-control form-select" aria-label="select-delete-user"
                                name="select-delete-user">
                            <option selected="selected" disabled="disabled" hidden="hidden">Select User</option>
                            {% for user in model.all_users() %}
                                <option value="{{ user.name }}">{{ user.name }}</option>
                            {% endfor %}
                        </select>

                        <input type="submit" class="form-control btn btn-danger" value="Delete"
                               style="max-width: 200px;">
                    </div>

                    <div class="form-text">
                        "Deleting" a user just hides it from the user interface without deleting any inputs, your
                        "pERsoNaL DaTa" is not yours anyway.<br>
                        Re-adding a user with the same name will "restore" it. That doesn't mean you're allowed to
                        remove everyone though.
                    </div>
                </form>
            </div>
        </div>
    {% endif %}

{% endblock body %}