{% extends 'administration/base.html.twig' %}

{% block title %}{{ 'admin.role_management'|trans }}{% endblock %}

{% block body %}
    {% set canRoleCreate = has_permission('ALLOW_ROLE_CREATE', app.user) %}
    {% set canRoleEdit = has_permission('ALLOW_ROLE_EDIT', app.user) %}
    {% set canRoleDelete = has_permission('ALLOW_ROLE_DELETE', app.user) %}
    <div class="container-fluid">
        <div class="row mb-3">
            <div class="col-12">
                <div class="admin-card p-4">
                    <div class="d-flex flex-column flex-lg-row justify-content-between align-items-start gap-3">
                        <div>
                            <h2 class="gradient-text fw-bold mb-2">
                                <i class="bi bi-shield-check me-2"></i>
                                {{ 'admin.role_management'|trans }}
                            </h2>
                            <p class="text-muted mb-0">{{ 'admin.roles_list_hint'|trans }}</p>
                        </div>
                        {% if canRoleCreate %}
                        <a href="{{ path('admin_roles_new') }}" class="btn btn-success">
                            <i class="bi bi-plus-circle me-1"></i>
                            {{ 'admin.role.new_role'|trans }}
                        </a>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>

        <div class="row mb-3">
            <div class="col-12">
                <div class="admin-card p-3">
                    <form class="row g-2 g-lg-3 align-items-end" method="get" action="{{ path('admin_roles') }}">
                        <div class="col-12 col-md-8 col-xl-6">
                            <label for="searchInput" class="form-label small text-muted mb-1">{{ 'admin.search'|trans }}</label>
                            <div class="input-group">
                                <span class="input-group-text"><i class="bi bi-search"></i></span>
                                <input type="text" id="searchInput" name="search" class="form-control"
                                       placeholder="{{ 'admin.search_roles_placeholder'|trans }}" value="{{ search }}">
                            </div>
                        </div>
                        <div class="col-12 col-md-4 col-xl-3 d-flex gap-2">
                            <button type="submit" class="btn btn-primary flex-grow-1">
                                <i class="bi bi-funnel me-1"></i>{{ 'admin.search_button'|trans }}
                            </button>
                            <a href="{{ path('admin_roles') }}" class="btn btn-outline-secondary" title="{{ 'admin.roles_reset_filters'|trans }}">
                                <i class="bi bi-x-lg"></i>
                            </a>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        {% if roles|length > 0 %}
            <div class="row">
                <div class="col-12">
                    <div class="admin-card p-0 overflow-hidden">
                        <div class="table-responsive">
                            <table class="table table-hover table-striped align-middle mb-0">
                                <thead class="table-light">
                                    <tr>
                                        <th scope="col" class="ps-4">{{ 'admin.roles_table_name'|trans }}</th>
                                        <th scope="col" class="d-none d-md-table-cell">{{ 'admin.roles_table_description'|trans }}</th>
                                        <th scope="col" class="d-none d-lg-table-cell">{{ 'admin.roles_table_permissions'|trans }}</th>
                                        <th scope="col" class="text-center">{{ 'admin.roles_table_type'|trans }}</th>
                                        <th scope="col" class="text-end pe-4" style="width: 1%;">{{ 'admin.actions'|trans }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    {% for role in roles %}
                                        {% set countsByGroup = {} %}
                                        {% for perm in role.permissions %}
                                            {% set split = perm.name|split('_') %}
                                            {% set group = split|length > 1 ? split[1]|lower : 'other' %}
                                            {% set prev = countsByGroup[group] is defined ? countsByGroup[group] : 0 %}
                                            {% set countsByGroup = countsByGroup|merge({(group): prev + 1}) %}
                                        {% endfor %}
                                        <tr>
                                            <td class="ps-4">
                                                <div class="fw-semibold">{{ role.name }}</div>
                                                <div class="d-md-none small text-muted mt-1">{{ role.description ?: '-' }}</div>
                                            </td>
                                            <td class="d-none d-md-table-cell small text-muted">
                                                {{ role.description ?: '-' }}
                                            </td>
                                            <td class="d-none d-lg-table-cell">
                                                {% if role.permissions|length > 0 %}
                                                    <div class="d-flex gap-1 flex-wrap">
                                                        {% for group, count in countsByGroup %}
                                                            <span class="badge bg-light text-dark border">{{ ('admin.permission_groups.' ~ group)|trans }}: {{ count }}</span>
                                                        {% endfor %}
                                                    </div>
                                                {% else %}
                                                    <span class="text-muted small">{{ 'admin.role.no_permissions'|trans }}</span>
                                                {% endif %}
                                            </td>
                                            <td class="text-center">
                                                {% if role.isSystem %}
                                                    <span class="badge bg-secondary">{{ 'admin.system'|trans }}</span>
                                                {% else %}
                                                    <span class="badge bg-light text-dark border">{{ 'admin.roles_custom'|trans }}</span>
                                                {% endif %}
                                            </td>
                                            <td class="text-end pe-4">
                                                <div class="btn-group btn-group-sm">
                                                    {% if canRoleEdit %}
                                                    <a href="{{ path('admin_roles_edit', {id: role.id}) }}" class="btn btn-outline-primary" title="{{ 'admin.edit'|trans }}">
                                                        <i class="bi bi-pencil"></i>
                                                    </a>
                                                    {% endif %}
                                                    {% if canRoleDelete and not role.isSystem %}
                                                        <form method="post" action="{{ path('admin_roles_delete', {id: role.id}) }}" class="d-inline" onsubmit="return confirm('{{ 'admin.role.confirm_delete'|trans }}');">
                                                            <input type="hidden" name="_token" value="{{ csrf_token('delete' ~ role.id) }}">
                                                            <button type="submit" class="btn btn-outline-danger" title="{{ 'admin.delete'|trans }}">
                                                                <i class="bi bi-trash"></i>
                                                            </button>
                                                        </form>
                                                    {% elseif not role.isSystem %}
                                                        <span class="btn btn-outline-danger disabled" tabindex="-1" title="{{ 'error.no_permission'|trans }}">
                                                            <i class="bi bi-trash"></i>
                                                        </span>
                                                    {% else %}
                                                        <span class="btn btn-outline-danger disabled" tabindex="-1" title="{{ 'admin.roles_system_not_deletable'|trans }}">
                                                            <i class="bi bi-trash"></i>
                                                        </span>
                                                    {% endif %}
                        </div>
                                            </td>
                                        </tr>
                                    {% endfor %}
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row mt-3">
                <div class="col-12">
                    {% include 'administration/pagination.html.twig' with {
                        'paginationPath': 'admin_roles',
                        'totalPages': totalPages,
                        'currentPage': currentPage,
                        'search': search
                    } %}
                </div>
            </div>
        {% else %}
            <div class="row">
                <div class="col-12">
                    <div class="empty-state admin-card py-5">
                        <div class="empty-state-icon"><i class="bi bi-shield-check"></i></div>
                        <h4 class="text-muted mb-2">{{ 'admin.no_roles_found'|trans }}</h4>
                        <p class="text-muted mb-4">{{ 'admin.roles_empty_filtered'|trans }}</p>
                        <div class="d-flex flex-wrap gap-2 justify-content-center">
                            <a href="{{ path('admin_roles') }}" class="btn btn-outline-primary">{{ 'admin.roles_reset_filters'|trans }}</a>
                            {% if canRoleCreate %}
                            <a href="{{ path('admin_roles_new') }}" class="btn btn-primary">
                                <i class="bi bi-plus-circle me-1"></i>{{ 'admin.role.new_role'|trans }}
                            </a>
                            {% endif %}
                        </div>
                    </div>
                </div>
            </div>
        {% endif %}
    </div>
{% endblock %}