Lock suggestions after reveal and move per-phase navigation

wwwroot/app.js

@@ -16,6 +16,8 @@ import {
   renderResults,
   renderPhaseTitles,
   openNewSuggestionModal,
+  updatePhaseNav,
+  openConfirmModal,
 } from "./js/ui.js";
 import {
   loadState,
@@ -63,6 +65,7 @@ function setupHandlers() {
     if (state.phase === "Results") {
       renderResults();
     }
+    updatePhaseNav();
   });
 
   const loginForm = $("login-form");
@@ -122,39 +125,7 @@ function setupHandlers() {
     });
   }
 
-  const prevPhaseBtn = $("prev-phase");
-  if (prevPhaseBtn) {
-    prevPhaseBtn.addEventListener("click", async () => {
-      try {
-        const resp = await api.prevPhase();
-        state.prevPhase = state.phase;
-        state.phase = resp.currentPhase;
-        state.resultsOpen = resp.resultsOpen ?? state.resultsOpen;
-        state.votesRendered = false;
-        renderPhasePill();
-        await refreshPhaseData();
-      } catch (err) {
-        toast(err.message, true);
-      }
-    });
-  }
-
-  const nextPhaseBtn = $("next-phase");
-  if (nextPhaseBtn) {
-    nextPhaseBtn.addEventListener("click", async () => {
-      try {
-        const resp = await api.nextPhase();
-        state.prevPhase = state.phase;
-        state.phase = resp.currentPhase;
-        state.resultsOpen = resp.resultsOpen ?? state.resultsOpen;
-        state.votesRendered = false;
-        renderPhasePill();
-        await refreshPhaseData();
-      } catch (err) {
-        toast(err.message, true);
-      }
-    });
-  }
+  bindNavButtons();
 
   $("reset").addEventListener("click", () => adminAction(adminApi.reset, t("admin.resetDone")));
   $("factory-reset").addEventListener("click", () => adminAction(adminApi.factoryReset, t("admin.factoryResetDone")));
@@ -272,3 +243,64 @@ function setupLanguageSwitchers() {
 
   updateLanguageButtons();
 }
+
+function bindNavButtons() {
+  const makeForward = (id, before) => {
+    const btn = $(id);
+    if (!btn) return;
+    btn.addEventListener("click", async () => {
+      try {
+        if (before) {
+          const proceed = await before();
+          if (!proceed) return;
+        }
+        const resp = await api.nextPhase();
+        state.prevPhase = state.phase;
+        state.phase = resp.currentPhase;
+        state.resultsOpen = resp.resultsOpen ?? state.resultsOpen;
+        state.votesRendered = false;
+        renderPhasePill();
+        await refreshPhaseData();
+      } catch (err) {
+        toast(err.message, true);
+      }
+    });
+  };
+
+  const makeBack = (id) => {
+    const btn = $(id);
+    if (!btn) return;
+    btn.addEventListener("click", async () => {
+      try {
+        const resp = await api.prevPhase();
+        state.prevPhase = state.phase;
+        state.phase = resp.currentPhase;
+        state.resultsOpen = resp.resultsOpen ?? state.resultsOpen;
+        state.votesRendered = false;
+        renderPhasePill();
+        await refreshPhaseData();
+      } catch (err) {
+        toast(err.message, true);
+      }
+    });
+  };
+
+  makeForward("nav-suggest-next", async () => {
+    return await new Promise((resolve) => {
+      openConfirmModal({
+        title: t("nav.freezeModalTitle"),
+        body: t("nav.freezeModalBody"),
+        confirmLabel: t("nav.next"),
+        onConfirm: (close) => {
+          close();
+          resolve(true);
+        },
+      });
+    });
+  });
+  makeForward("nav-reveal-next");
+  makeForward("nav-vote-next");
+
+  makeBack("nav-reveal-prev");
+  makeBack("nav-vote-prev");
+}