Merge branch '121-save-toggling-on-job-offers-page-for-students' into 'dev'

Resolve "Save toggling on Job Offers Page for Students"

Closes #121

See merge request !341

CHANGELOG.md

@@ -5,15 +5,22 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [2.1.6]
+## [Unreleased]
 
 ### Added
-- Add pagination to raise requests, all declarations, and all applications. @toberhuber
 - Job offers are now created as draft (hidden) by default and can be published later @dsavvidi
-- Ability to select multiple applications to reject/offer. @dsavvidi 
 - Ability for coordinators to search for students in the system. @dsavvidi
 - Alert if rejecting people with empty/not edited rejection messsage. @dsavvidi
 
+### Fixed
+- Toggling state now saved on Job Offers Page for Students @dsavvidi
+
+## [2.1.6]
+
+### Added
+- Add pagination to raise requests, all declarations, and all applications. @toberhuber
+- Ability to select multiple applications to reject/offer. @dsavvidi
+
 ### Changed
 - Applications will now be removed from the 'My applications' page after the edition has ended. @rwbackx
 - Raise request PDFs are now embedded so do not need to be downloaded anymore. @rwbackx

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

@@ -88,17 +88,13 @@
                                 <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>
                         </tr>
                     </tbody>
 
-                    <tbody
-                        class="accordion__content"
-                        th:id="|edition-${edition.id}|"
-                        th:aria-expanded="${expanded}">
+                    <tbody class="accordion__content" th:id="|edition-${edition.id}|">
                         <tr
                             th:each="offer : ${edition.offers}"
                             th:if="${!offer.hidden}"
@@ -235,6 +231,37 @@
             </div>
 
             <script th:inline="text">
+                if (localStorage.getItem("expandedItems") == null) {
+                    localStorage.setItem("expandedItems", "{}");
+                }
+                $(() => {
+                    let expandedItems = JSON.parse(localStorage.getItem("expandedItems"));
+                    $('[class="accordion__content"]').each(function () {
+                        let accordionId = $(this).attr("id");
+                        if (expandedItems.hasOwnProperty(accordionId)) {
+                            let isExpanded = expandedItems[accordionId];
+                            $(
+                                'tbody[id="' +
+                                    accordionId +
+                                    '"], button[aria-controls="' +
+                                    accordionId +
+                                    '"]',
+                            ).attr("aria-expanded", isExpanded);
+                        }
+                    });
+
+                    $("button, tbody.accordion__header").on("click", function () {
+                        let button = $(this).closest("tbody.accordion__header").find("button");
+                        let accordionId = button.attr("aria-controls");
+                        let isExpanded = button.attr("aria-expanded");
+                        if (isExpanded) {
+                            let expandedItems = JSON.parse(localStorage.getItem("expandedItems"));
+                            expandedItems[accordionId] = isExpanded;
+                            localStorage.setItem("expandedItems", JSON.stringify(expandedItems));
+                        }
+                    });
+                });
+
                 $(() => {
                     $("#program-select").change(function () {
                         let url = new URL(window.location);