Correction collapser

assets/controllers/collapser-controller.js

@@ -4,10 +4,10 @@ export default class extends Controller {
     static targets = ['collapse', 'button']
     connect() {
         this.collapseTarget.addEventListener ('hide.bs.collapse', () => {
-            this.buttonTarget.innerHTML = '<i class="fa fa-chevron-circle-right fa-lg"></i>';
+            this.buttonTarget.classList.remove("fa-rotate-90");
         });
         this.collapseTarget.addEventListener ('show.bs.collapse', () => {
-            this.buttonTarget.innerHTML = '<i class="fa fa-chevron-circle-down fa-lg"></i>';
+            this.buttonTarget.classList.add("fa-rotate-90");
         })
     }
 }

templates/videotheque/liste_vignettes.html.twig

@@ -84,7 +84,7 @@
 						</div>
 					{% endif %}
 					<div class="">
-						<button class="btn text-primary" data-collapser-target="button" data-bs-toggle="collapse" data-bs-target="#collapse-id-{{ film.id }}"><i class="fa fa-chevron-circle-right fa-lg"></i></button>
+						<button class="btn text-primary" data-bs-toggle="collapse" data-bs-target="#collapse-id-{{ film.id }}"><i data-collapser-target="button" class="fa fa-chevron-circle-right fa-lg"></i></button>
 					</div>
 				</div>
 			</div>

templates/videotheque/voirfilm.html.twig

@@ -148,12 +148,12 @@
                 <div class="card-header">
                     <h5>Commentaires</h5>
                 </div>
-                <div class="card-body">
+                <div class="card-body" data-controller="collapser">
                     {% if is_granted('IS_AUTHENTICATED_REMEMBERED') %}
                             <p>
-                                <a data-bs-toggle="collapse" role="button" href="#collapseCommentaire" aria-expanded="false" aria-controls="collapseCommentaire">Commenter <i class="fa fa-chevron-down"></i></a>
+                                <a data-bs-toggle="collapse" role="button" href="#collapseCommentaire" aria-expanded="false" aria-controls="collapseCommentaire">Commenter <i data-collapser-target="button" class="fa fa-chevron-right"></i></a>
                             </p>
-                            <div class="collapse" id="collapseCommentaire">
+                            <div class="collapse" id="collapseCommentaire" data-collapser-target="collapse">
                             {{ include('videotheque/form_commentaire.html.twig') }}
                             </div>
                     {% endif %}