refactor: simplify quick win settings and mobile dialog

app/static/js/app.js

@@ -18,7 +18,10 @@
   const currentUserName = document.body.dataset.currentUserName;
   const quickWinSortList = document.querySelector("[data-quick-win-sort-list]");
   const quickWinSortToken = document.getElementById("quickWinSortToken");
+  const quickWinSortSave = document.getElementById("quickWinSortSave");
+  const quickWinToggleButtons = document.querySelectorAll("[data-quick-win-toggle]");
   let draggedQuickWin = null;
+  let quickWinSortDirty = false;
 
   function buildCompletionOptions(button) {
     const options = [];
@@ -138,7 +141,16 @@
     });
   }
 
+  function setQuickWinSortDirty(isDirty) {
+    quickWinSortDirty = isDirty;
+    if (quickWinSortSave) {
+      quickWinSortSave.disabled = !isDirty;
+    }
+  }
+
   if (quickWinSortList) {
+    setQuickWinSortDirty(false);
+
     quickWinSortList.querySelectorAll("[data-quick-win-sort-item]").forEach((item) => {
       item.addEventListener("dragstart", () => {
         draggedQuickWin = item;
@@ -168,16 +180,55 @@
         } else {
           item.before(draggedQuickWin);
         }
-
-        try {
-          await persistQuickWinSort();
-        } catch (error) {
-          console.error("Quick-Win-Sortierung konnte nicht gespeichert werden", error);
-        }
+        setQuickWinSortDirty(true);
       });
     });
   }
 
+  if (quickWinSortSave) {
+    quickWinSortSave.addEventListener("click", async () => {
+      if (!quickWinSortDirty) {
+        return;
+      }
+      try {
+        await persistQuickWinSort();
+        setQuickWinSortDirty(false);
+      } catch (error) {
+        console.error("Quick-Win-Sortierung konnte nicht gespeichert werden", error);
+      }
+    });
+  }
+
+  quickWinToggleButtons.forEach((button) => {
+    button.addEventListener("click", () => {
+      const targetId = button.dataset.target;
+      if (!targetId) {
+        return;
+      }
+
+      const target = document.getElementById(targetId);
+      if (!target) {
+        return;
+      }
+
+      const willOpen = target.hidden;
+
+      document.querySelectorAll("[data-quick-win-edit]").forEach((editForm) => {
+        editForm.hidden = true;
+      });
+      quickWinToggleButtons.forEach((toggle) => {
+        toggle.setAttribute("aria-expanded", "false");
+        toggle.textContent = "Bearbeiten";
+      });
+
+      if (willOpen) {
+        target.hidden = false;
+        button.setAttribute("aria-expanded", "true");
+        button.textContent = "Schließen";
+      }
+    });
+  });
+
   const pushButton = document.getElementById("pushToggle");
   const pushHint = document.getElementById("pushHint");
   const vapidKey = document.body.dataset.pushKey;