save toggling smoother & expand click on accordion

src/main/resources/templates/job_offer/view_many.html

@@ -88,7 +88,6 @@
                                 <div class="flex justify-end">
                                     <button
                                         class="fa-solid fa-chevron-down"
-                                        th:aria-expanded="${expanded}"
                                         th:aria-controls="|edition-${edition.id}|"></button>
                                 </div>
                             </td>
@@ -97,8 +96,7 @@
 
                     <tbody
                         class="accordion__content"
-                        th:id="|edition-${edition.id}|"
-                        th:aria-expanded="${expanded}">
+                        th:id="|edition-${edition.id}|">
                         <tr
                             th:each="offer : ${edition.offers}"
                             th:if="${!offer.hidden}"
@@ -236,22 +234,19 @@
 
             <script th:inline="text">
                 $(document).ready(function () {
-                    $('button').on('click', function () {
-                        let accordionId = $(this).attr('aria-controls');
-                        let isExpanded = $(this).attr('aria-expanded');
-                        console.log("(click) change state of "+accordionId+" to " + isExpanded);
-                        localStorage.setItem(accordionId, isExpanded);
-                    });
-
                     $('[class="accordion__content"]').each(function () {
                         let accordionId = $(this).attr('id');
-                        let isExpanded = localStorage.getItem(accordionId);
-                        if (isExpanded !== null) {
-                            console.log("update state of "+accordionId+" to " + isExpanded);
-                            $('tbody[id="' + accordionId + '"]').attr('aria-expanded', isExpanded);
-                            $('button[aria-controls="' + accordionId + '"]').attr('aria-expanded', isExpanded);
+                        let isExpanded = localStorage.getItem(accordionId) ?? /*[[${expanded}]]*/ true;
+                        if (localStorage.getItem(accordionId) != null) {
+                            $('tbody[id="' + accordionId + '"], button[aria-controls="' + accordionId + '"]').attr('aria-expanded', isExpanded);
                         }
                     });
+
+                    $('button, tbody.accordion__header').on('click', function () {
+                        let accordionId = $(this).closest('tbody.accordion__header').find('button').attr('aria-controls');
+                        let isExpanded = $(this).closest('tbody.accordion__header').find('button').attr('aria-expanded');
+                        localStorage.setItem(accordionId, isExpanded);
+                    });
                 });
 
                 $(() => {