{% extends "base.html" %}
{% load i18n %}
{% load static %}
{% load bootstrap_icons %}
{% block title %}{% trans "Users" %}{% endblock %}
{% block content %}
<div class="row">
    <div class="col-lg-12">
        <a href="{% url 'admin:group_create' %}" class="btn btn-success btn-header float-end">
            {% bs_icon 'plus-circle-fill' %}
        </a>
        {% include 'search_block.html' %}
        <h1 class="page-header">{% trans "Groups" %}</h1>
    </div>
</div>
<div class="row">
    {% if not groups %}
        <div class="col-lg-12">
            <div class="alert alert-warning shadow-sm">
                {% bs_icon 'exclamation-triangle '%} <strong>{% trans "Warning" %}:</strong> {% trans "You don't have any groups" %}
            </div>
        </div>
    {% else %}
        <div class="col-lg-12">
            <table class="table table-striped table-hover">
                <thead>
                    <tr>
                        <th span="col">{% trans "Group Name" %}</th>
                        <th span="col">{% trans "Actions" %}</th>
                    </tr>
                </thead>
                <tbody class="searchable">
                {% for group in groups %}
                    <tr>
                        <td>
                            <a href=""><strong>{{ group.name }}</strong></a>
                        </td>
                        <td>
                            <div class="float-end btn-group">
                                <a class="btn btn-primary" href="{% url 'admin:group_update' group.id %}" title="{%trans "Edit" %}">
                                    {% bs_icon 'pencil' %}
                                </a>
                                <a class="btn btn-danger" href="{% url 'admin:group_delete' group.id %}" title="{%trans "Delete" %}">
                                    {% bs_icon 'x' %}
                                </a>
                            </div>
                        </td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
    {% endif %}
</div>
{% endblock content %}

{% block script %}
<script src="{% static 'js/filter-table.js' %}"></script>
{% endblock script %}
