EasyAdmin: Active entity menu items

menu.html.twig

{% macro render_menu_item(item, translation_domain) %}
    {% if item.type == 'divider' %}
        {{ item.label|trans(domain = translation_domain) }}
    {% else %}
        {% set menu_params = { menuIndex: item.menu_index, submenuIndex: item.submenu_index } %}
        {% set path =
            item.type == 'link' ? item.url :
            item.type == 'route' ? path(item.route, item.params) :
            item.type == 'entity' ? path('easyadmin', { entity: item.entity, action: 'list' }|merge(menu_params)|merge(item.params)) :
            item.type == 'empty' ? '#' : ''
        %}

        {# if the URL generated for the route belongs to the backend, regenerate
           the URL to include the menu_params to display the selected menu item
           (this is checked comparing the beginning of the route URL with the backend homepage URL)
        #}
        {% if item.type == 'route' and (path starts with path('easyadmin')) %}
            {% set path = path(item.route, menu_params|merge(item.params)) %}
        {% endif %}

        <a href="{{ path }}" {% if item.target|default(false) %}target="{{ item.target }}"{% endif %} class="{{ item.css_class|default('') }}">
            {% if item.icon is not empty %}<i class="fa {{ item.icon }}"></i>{% endif %}
            <span>{{ item.label|trans(domain = translation_domain) }}</span>
            {% if item.children|default([]) is not empty %}<span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span>{% endif %}
        </a>
    {% endif %}
{% endmacro %}

{% macro menu_item_active_class(item, loop) %}
    {% set active = false %}

    {% if app.request.query.get('entity') and item.entity is defined %}
        {% if app.request.query.get('entity')|default(-1) == item.entity %}
            {% set active = true %}
        {% endif %}
    {% else %}
        {% if app.request.query.get('menuIndex')|default(-1) == loop.index0 %}
            {% set active = true %}
        {% endif %}
    {% endif %}

    {% if item.children is defined %}
        {% for subitem in item.children %}
            {% if app.request.query.get('entity') and subitem.entity is defined %}
                {% if app.request.query.get('entity')|default(-1) ==subitem.entity %}
                    {% set active = true %}
                {% endif %}
            {% else %}
                {% if app.request.query.get('menuIndex')|default(-1) == loop.parent.loop.index0 and app.request.query.get('submenuIndex')|default(-1) == loop.index0 %}
                    {% set active = true %}
                {% endif %}
            {% endif %}
        {% endfor %}
    {% endif %}

    {{ active == true ? "active" }}
{% endmacro %}


{% import _self as helper %}

{% block main_menu_before %}{% endblock %}

{% set _translation_domain = (_entity_config.translation_domain)|default(easyadmin_config('translation_domain'))|default('messages') %}

<ul class="sidebar-menu" data-widget="tree" data-animation-speed="250">
    {% set _menu_items = easyadmin_config('design.menu') %}

    {% block main_menu %}
        {% for item in _menu_items %}

            {% block menu_item %}
                <li class="{{ item.type == 'divider' ? 'header' }} {{ item.children is not empty ? 'treeview' }} {{ helper.menu_item_active_class(item, loop) }} {{ app.request.query.get('submenuIndex')|default(-1) != -1 ? 'submenu-active' }}">
                    {{ helper.render_menu_item(item, _translation_domain) }}

                    {% if item.children|default([]) is not empty %}
                        <ul class="treeview-menu">
                            {% for subitem in item.children %}
                                {% block menu_subitem %}
                                    <li class="{{ subitem.type == 'divider' ? 'header' }} {{ helper.menu_item_active_class(subitem, loop) }}">
                                        {{ helper.render_menu_item(subitem, _translation_domain) }}
                                    </li>
                                {% endblock menu_subitem %}
                            {% endfor %}
                        </ul>
                    {% endif %}
                </li>
            {% endblock menu_item %}
        {% endfor %}
    {% endblock main_menu %}

</ul>
{% block main_menu_after %}{% endblock %}

Thank you for starting point :) You version not work correctly on v2.x for me. And the base template of v2.x have some style changes. Improvements:

1. less code duplication and better BC: extending base template and override only "main_menu" block
2. move hard logic of defining active item to twig filter (by the way v3.x implemnts similiar approach)

@brizzz good point! I think it makes sense to keep both approaches, while recommending your approach for EasyAdmin v2 and up.