{#
    STIMULUS - Comment connecter le HTML au JavaScript

    Les attributs data-* permettent de connecter le HTML aux contrôleurs Stimulus
#}

<nav
    class="sidebar{% if app.user.settings and app.user.settings.sidebarCollapsed %} sidebar--collapsed{% endif %}"
    data-controller="shared--sidebar"
    data-shared--sidebar-collapsed-class="sidebar--collapsed"
    aria-label="Navigation principale"
    role="navigation"
>
    <div class="sidebar__header">
        <button
            type="button"
            class="sidebar__toggle"
            data-action="click->shared--sidebar#toggle"
            aria-label="{% if app.user.settings and app.user.settings.sidebarCollapsed %}Ouvrir{% else %}Réduire{% endif %} le menu de navigation"
            aria-expanded="{% if app.user.settings and app.user.settings.sidebarCollapsed %}false{% else %}true{% endif %}"
        >
            <span class="sidebar__toggle-icon" aria-hidden="true"></span>
        </button>

        <div class="sidebar__logo">
            {% include "_components/logos/logo.html.twig" %}
        </div>
    </div>

    <ul class="sidebar__menu" role="list">
        <li class="sidebar__menu-item">
            <a
                href="{{ path('app_dashboard') }}"
                class="sidebar__menu-link{% if app.request.attributes.get('_route') == 'app_dashboard' %} active{% endif %}"
                {% if app.request.attributes.get('_route') == 'app_dashboard' %}aria-current="page"{% endif %}
            >
                <span class="sidebar__menu-icon" aria-hidden="true">
                    {% include "_components/icons/home.html.twig" %}
                </span>
                <span class="sidebar__menu-text">Dashboard</span>
            </a>
        </li>
        <li class="sidebar__menu-item">
            <a
                href="{{ path('app_moodia')}}"
                class="sidebar__menu-link{% if app.request.attributes.get('_route') == 'app_moodia' %} active{% endif %}"
                {% if app.request.attributes.get('_route') == 'app_moodia' %}aria-current="page"{% endif %}
            >
                <span class="sidebar__menu-icon" aria-hidden="true">
                    {% include "_components/icons/moodia.html.twig" %}
                </span>
                <span class="sidebar__menu-text">Moodia</span>
            </a>
        </li>
        <li class="sidebar__menu-item">
            <a
                href="{{ path('app_seren_ia')}}"
                class="sidebar__menu-link{% if app.request.attributes.get('_route') == 'app_seren_ia' %} active{% endif %}"
                {% if app.request.attributes.get('_route') == 'app_seren_ia' %}aria-current="page"{% endif %}
            >
                <span class="sidebar__menu-icon" aria-hidden="true">
                    {% include "_components/icons/seren_ia.html.twig" %}
                </span>
                <span class="sidebar__menu-text">Serenia</span>
            </a>
        </li>
        <li class="sidebar__menu-item">
            <a
                href="{{ path('app_slidia')}}"
                class="sidebar__menu-link{% if app.request.attributes.get('_route') == 'app_slidia' %} active{% endif %}"
                {% if app.request.attributes.get('_route') == 'app_slidia' %}aria-current="page"{% endif %}
            >
                <span class="sidebar__menu-icon" aria-hidden="true">
                    {% include "_components/icons/slidia.html.twig" %}
                </span>
                <span class="sidebar__menu-text">Slidia</span>
            </a>
        </li>

        {% if is_granted('ROLE_ADMIN') %}
        {# Séparateur avant la section test (admin only) #}
        <li class="sidebar__menu-separator" aria-hidden="true"></li>

        {# Catégorie Test #}
        <li class="sidebar__menu-category">
            <span class="sidebar__menu-text">Développement</span>
        </li>

        {# Lien vers la page de test #}
        <li class="sidebar__menu-item">
            <a
                href="{{ path('app_test') }}"
                class="sidebar__menu-link{% if app.request.attributes.get('_route') == 'app_test' %} active{% endif %}"
                {% if app.request.attributes.get('_route') == 'app_test' %}aria-current="page"{% endif %}
            >
                <span class="sidebar__menu-icon" aria-hidden="true">
                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                        <polyline points="14,2 14,8 20,8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                    </svg>
                </span>
                <span class="sidebar__menu-text">Test PDF</span>
            </a>
        </li>
        {% endif %}

        {% if is_granted('ROLE_ADMIN') %}
        {# Séparateur avant la section admin #}
        <li class="sidebar__menu-separator" aria-hidden="true"></li>

        {# Catégorie Administration #}
        <li class="sidebar__menu-category">
            <span class="sidebar__menu-text">Administration</span>
        </li>

        {# Lien vers la gestion des feedbacks #}
        <li class="sidebar__menu-item">
            <a
                href="{{ path('admin_feedback_list') }}"
                class="sidebar__menu-link{% if app.request.attributes.get('_route') starts with 'admin_feedback' %} active{% endif %}"
                {% if app.request.attributes.get('_route') starts with 'admin_feedback' %}aria-current="page"{% endif %}
            >
                <span class="sidebar__menu-icon" aria-hidden="true">
                    {% include "_components/icons/message.html.twig" %}
                </span>
                <span class="sidebar__menu-text">Feedbacks</span>
            </a>
        </li>

        {# Lien vers la gestion des beta testers #}
        <li class="sidebar__menu-item">
            <a
                href="{{ path('admin_beta_list') }}"
                class="sidebar__menu-link{% if app.request.attributes.get('_route') starts with 'admin_beta' %} active{% endif %}"
                {% if app.request.attributes.get('_route') starts with 'admin_beta' %}aria-current="page"{% endif %}
            >
                <span class="sidebar__menu-icon" aria-hidden="true">
                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z" fill="currentColor"/>
                    </svg>
                </span>
                <span class="sidebar__menu-text">Beta testers</span>
            </a>
        </li>
        {% endif %}

    </ul>

    <div class="sidebar__footer">
        <a
            href="{{ path('app_settings') }}"
            class="sidebar__menu-link{% if app.request.attributes.get('_route') == 'app_settings' %} active{% endif %}"
            {% if app.request.attributes.get('_route') == 'app_settings' %}aria-current="page"{% endif %}
        >
            <span class="sidebar__menu-icon" aria-hidden="true">
                {% include "_components/icons/settings.html.twig" %}
            </span>
            <span class="sidebar__menu-text">Paramètres</span>
        </a>
        <a href="{{ path('app_logout') }}" class="sidebar__menu-link" data-turbo="false">
            <span class="sidebar__menu-icon" aria-hidden="true">
                {% include "_components/icons/logout.html.twig" %}
            </span>
            <span class="sidebar__menu-text">Déconnexion</span>
        </a>
        <div class="sidebar__version" role="contentinfo" aria-label="Informations de version">
            <span class="sidebar__menu-text">Version {{ app_version }}</span>
        </div>
    </div>
</nav>