{% set globalActions = datatable.actions|filter(action => action.global) %}
{% set rowActions = datatable.actions|filter(action => not action.global) %}

<div class="datatable" data-controller="datatable">
    {% if globalActions|length %}
        <div class="crud-heading text-right mb-3">
            {% for action in  globalActions %}
                <twig:link_button icon="{{ action.icon }}" label="{{ action.label }}"
                                  path="{{ path(action.routeName, action.routeParameters) }}"
                                  attr="{{ action.attr|json_encode }}"/>
            {% endfor %}
        </div>
    {% endif %}

    <div class="data-turbo-presentation">
        <div class="card">
            <div class="card-body">
                {% if datatable.rows|length %}
                    <table class="table">
                        <twig:tableHead columnNames="{{ datatable.columnNames|json_encode }}"
                                        showActionColumn="{{ rowActions|length }}"
                                        translationDomain="{{ datatable.translationDomain }}"/>
                        <tbody>
                        {% if datatable.filteringEnabled %}
                            <twig:tableSimpleFilters columnNames="{{ datatable.columnRealNames|json_encode }}"
                                                     simpleFilters="{{ datatable.simpleFilters|json_encode }}"
                                                     showActionColumn="{{ rowActions|length }}"
                                                     translationDomain="{{ datatable.translationDomain }}"/>
                        {% endif %}
                        {% if datatable.rows|length %}
                            {% for row in datatable.rows %}
                                {% set rowData = row[0].data %}
                                <twig:tableRow row="{{ row }}" translationDomain="{{ datatable.translationDomain }}"
                                               actions="{{ rowActions }}" rowData="{{ rowData }}"/>
                            {% endfor %}
                        {% endif %}
                        </tbody>
                    </table>
                {% else %}
                    <div class="no-data-found text-center m-3 p-5">
                        {{ 'no_records_found'|trans({}, datatable.translationDomain) }}
                        {% if app.request.get('filter') %}
                            <br><br>
                            <a href="{{ path(app.current_route) }}" class="btn btn-primary">
                                {{ 'button_cancel_filters'|trans({}, datatable.translationDomain) }}
                            </a>
                        {% endif %}
                    </div>
                {% endif %}

                <nav class="mt-3">
                    <div class="navigation text-end">
                        {{ knp_pagination_render(datatable.pagination) }}
                    </div>
                </nav>
            </div>
        </div>
    </div>
</div>