<div class="d-flex justify-content-end">

    <div class="dropdown my-4">
        <a class="btn btn-primary dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
            aria-expanded="false">
            Ajouter
        </a>
        <ul class="dropdown-menu">
            <li>
                <a href={{ path("app_article_new") }} type="button" class="">Ajouter un article</a>
            </li>
            <li>
                <a href={{ path("app_categorie_new") }} type="button" class="">Ajouter une catégorie</a>
            </li>
            <li>
                <a href={{ path("app_tag_new") }} type="button" class="">Ajouter un tag</a>
            </li>
            <li>
                <a href={{ path("app_article_index") }} type="button" class="">Liste des articles </a>
            </li>
            <li>
                <a href={{ path("app_categorie_index") }} type="button" class="">Liste des categories </a>
            </li>
            <li>
                <a href={{ path("app_tag_index") }} type="button" class="">Liste des tag</a>
            </li>
        </ul>
    </div>
</div>

<script>
    // Réinitialise ce dropdown spécifiquement
    if (typeof bootstrap !== 'undefined') {
        const dropdownElement = document.querySelector('#dropdownMenuButton');
        if (dropdownElement && !dropdownElement._bootstrap) {
            new bootstrap.Dropdown(dropdownElement);
        }
    }
</script>