@php
    $permissionFilterState = $permissionFilterState ?? [];
    $permissaoModo = request()->input('permissao_modo', 'any');
    $modalId = 'modalFiltroPermissoes';
@endphp

<button
    type="button"
    class="btn btn-outline-primary"
    data-bs-toggle="modal"
    data-bs-target="#{{ $modalId }}"
>
    <i class="fa-solid fa-shield-halved me-1"></i>
    {{ __('Permissões') }}
    @if(count($permissionFilterState) > 0)
        <span class="badge bg-primary ms-1">{{ count($permissionFilterState) }}</span>
    @endif
</button>

<div class="modal fade" id="{{ $modalId }}" tabindex="-1" aria-labelledby="{{ $modalId }}Label" aria-hidden="true">
    <div class="modal-dialog modal-xl modal-dialog-scrollable">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="{{ $modalId }}Label">
                    <i class="fa-solid fa-shield-halved me-2"></i>
                    {{ __('Filtrar por permissões') }}
                </h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{{ __('Fechar') }}"></button>
            </div>

            <div class="modal-body">
                <p class="text-muted small mb-3">
                    {{ __('Ações desmarcadas não restringem a busca, exceto no modo Exatamente essas, em que o perfil deve coincidir integralmente.') }}
                </p>

                <fieldset class="mb-4">
                    <legend class="form-label fw-semibold mb-3">{{ __('Modo de correspondência') }}</legend>
                    <div class="d-flex flex-wrap gap-3">
                        @foreach([
                            'any' => __('Ao menos uma dessas'),
                            'all' => __('Todas essas'),
                            'exact' => __('Exatamente essas'),
                        ] as $value => $label)
                            <div class="form-check">
                                <input
                                    class="form-check-input"
                                    type="radio"
                                    name="permissao_modo"
                                    id="permissao_modo_{{ $value }}"
                                    value="{{ $value }}"
                                    @checked($permissaoModo === $value)
                                >
                                <label class="form-check-label" for="permissao_modo_{{ $value }}">
                                    {{ $label }}
                                </label>
                            </div>
                        @endforeach
                    </div>
                </fieldset>

                <div class="list-group mb-0">
                    <div class="list-group-item list-group-item-action active" aria-current="true">
                        <h6 class="mb-1">{{ __('Permissões') }}</h6>
                        <small
                            class="text-warning js-select-all-permissions"
                            data-permissions-wrapper="permissions-filter-wrapper"
                            role="button"
                            tabindex="0"
                        >{{ __('* selecionar todas as categorias') }}</small>
                    </div>
                    <div class="list-group-item list-group-item-action">
                        @include('components.contas._permissionsMatrix', [
                            'mode' => 'filter',
                            'permissoesDisponiveis' => $permissoesDisponiveis,
                            'selectedPermissions' => $permissionFilterState,
                            'searchInputId' => 'permissions-filter-search',
                            'wrapperId' => 'permissions-filter-wrapper',
                        ])
                    </div>
                </div>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">
                    {{ __('Cancelar') }}
                </button>
                <button type="button" class="btn btn-outline-warning" id="btnLimparPermissoesFiltro">
                    {{ __('Limpar seleção') }}
                </button>
                <button type="submit" class="btn btn-primary" id="btnAplicarPermissoesFiltro">
                    {{ __('Aplicar filtro') }}
                </button>
            </div>
        </div>
    </div>
</div>