{% extends '/layout/admin_layout.html.twig' %}
{% import "macro/listing.html.twig" as listingMacro %}

{% block title %}Auth Actions{% endblock %}

{% block content %}

    <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pb-3">
        <div>

        </div>
        <div class="btn-toolbar mb-2 mb-md-0">
            <div class="btn-group ms-2 ms-lg-3">
                {{ listingMacro.filtersBtn( path('app_auth_log_filters', app.request.query|merge({'target': target.value})) ) }}
                <button type="button"
                        class="btn btn-sm btn-outline-gray-600"
                        data-bs-toggle="popover"
                        data-bs-content="This feature is under development."
                >
                    Export
                </button>
            </div>

            <div class="ms-2 ms-lg-3">
                {% include('components/page_size_choice.html.twig') %}
            </div>
        </div>
    </div>

    <div class="card border-0 shadow mb-3">
        <div class="card-body p-2">
            <div class="table-wrapper table-responsive">
                <table class="table table-hover">
                    <thead class="thead-light">
                    <tr>
                        <th>#</th>
                        <th>User</th>
                        <th>Action</th>
                        <th>{{ listingMacro.sortItem(sort, 'timestamp', 'Date') }}</th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for action in actions %}
                        <tr>
                            <td>{{ pagination.rowIndex(loop.index) }}</td>
                            <td>
                                {{ action.username }}
                                {% if action.isUnauthenticatedUser %}
                                    <span data-bs-toggle="popover" data-bs-trigger="hover focus"
                                          data-bs-content="This is just the username entered during the failed login attempt. Filtering by this value is not supported."
                                    >
                                    <svg class="icon icon-xs ms-2" data-slot="icon" fill="currentColor"
                                         viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
                                        <path clip-rule="evenodd" fill-rule="evenodd"
                                              d="M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-7-4a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM9 9a.75.75 0 0 0 0 1.5h.253a.25.25 0 0 1 .244.304l-.459 2.066A1.75 1.75 0 0 0 10.747 15H11a.75.75 0 0 0 0-1.5h-.253a.25.25 0 0 1-.244-.304l.459-2.066A1.75 1.75 0 0 0 9.253 9H9Z"></path>
                                    </svg>
                                </span>
                                {% endif %}
                            </td>
                            <td>{{ action.action.label }}</td>
                            <td>{{ action.timestamp ? action.timestamp|dtz : '-' }}</td>
                        </tr>
                    {% else %}
                        <tr>
                            <td colspan="100%">no records found</td>
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
        <div class="card-footer">{%- include 'components/pagination.html.twig' with { 'pagination': pagination } -%}</div>
    </div>

    {{ listingMacro.filtersModal( path('app_auth_log_index', {'target': target.value}), false ) }}

{% endblock %}