Reduce frontend polling load and clean stale UI hooks

This commit is contained in:
2026-02-08 21:57:47 +01:00
parent 726ba79fdf
commit d375b942ff
13 changed files with 447 additions and 281 deletions

View File

@@ -5,77 +5,107 @@ const basePath = normalizeBase(rawBase);
const withBase = (path) => `${basePath}${path}`;
function normalizeBase(value) {
if (!value) return "";
if (!value.startsWith("/")) return `/${value}`;
return value.endsWith("/") ? value.slice(0, -1) : value;
if (!value) return "";
if (!value.startsWith("/")) return `/${value}`;
return value.endsWith("/") ? value.slice(0, -1) : value;
}
async function request(path, { method = "GET", body } = {}) {
const res = await fetch(withBase(path), {
method,
credentials: "same-origin",
headers: defaultHeaders,
body: body ? JSON.stringify(body) : undefined,
});
const res = await fetch(withBase(path), {
method,
credentials: "same-origin",
headers: defaultHeaders,
body: body ? JSON.stringify(body) : undefined,
});
if (!res.ok) {
let msg = `${res.status}`;
try {
const data = await res.json();
msg = data.error || data.detail || data.title || JSON.stringify(data);
} catch { /* ignore */ }
const err = new Error(msg);
err.status = res.status;
throw err;
}
return res.status === 204 ? null : res.json();
if (!res.ok) {
let msg = `${res.status}`;
try {
const data = await res.json();
msg =
data.error || data.detail || data.title || JSON.stringify(data);
} catch {
/* ignore */
}
const err = new Error(msg);
err.status = res.status;
throw err;
}
return res.status === 204 ? null : res.json();
}
export const api = {
state: () => request("/api/state"),
me: () => request("/api/me"),
authOptions: () => request("/api/auth/options"),
register: (payload) => request("/api/auth/register", { method: "POST", body: payload }),
login: (payload) => request("/api/auth/login", { method: "POST", body: payload }),
logout: () => request("/api/auth/logout", { method: "POST" }),
state: () => request("/api/state"),
me: () => request("/api/me"),
authOptions: () => request("/api/auth/options"),
register: (payload) =>
request("/api/auth/register", { method: "POST", body: payload }),
login: (payload) =>
request("/api/auth/login", { method: "POST", body: payload }),
logout: () => request("/api/auth/logout", { method: "POST" }),
mySuggestions: () => request("/api/suggestions/mine"),
createSuggestion: (payload) => request("/api/suggestions", { method: "POST", body: payload }),
deleteSuggestion: (id) => request(`/api/suggestions/${id}`, { method: "DELETE" }),
updateSuggestion: (id, payload) => request(`/api/suggestions/${id}`, { method: "PUT", body: payload }),
allSuggestions: () => request("/api/suggestions/all"),
mySuggestions: () => request("/api/suggestions/mine"),
createSuggestion: (payload) =>
request("/api/suggestions", { method: "POST", body: payload }),
deleteSuggestion: (id) =>
request(`/api/suggestions/${id}`, { method: "DELETE" }),
updateSuggestion: (id, payload) =>
request(`/api/suggestions/${id}`, { method: "PUT", body: payload }),
allSuggestions: () => request("/api/suggestions/all"),
myVotes: () => request("/api/votes/mine"),
vote: (suggestionId, score) => request("/api/votes", { method: "POST", body: { suggestionId, score } }),
finalizeVotes: (final) => request("/api/votes/finalize", { method: "POST", body: { final } }),
myVotes: () => request("/api/votes/mine"),
vote: (suggestionId, score) =>
request("/api/votes", {
method: "POST",
body: { suggestionId, score },
}),
finalizeVotes: (final) =>
request("/api/votes/finalize", { method: "POST", body: { final } }),
results: () => request("/api/results"),
nextPhase: () => request("/api/me/phase/next", { method: "POST" }),
prevPhase: () => request("/api/me/phase/prev", { method: "POST" }),
results: () => request("/api/results"),
nextPhase: () => request("/api/me/phase/next", { method: "POST" }),
prevPhase: () => request("/api/me/phase/prev", { method: "POST" }),
};
export const adminApi = {
setResultsOpen: (resultsOpen) => request("/api/admin/results", { method: "POST", body: { resultsOpen } }),
voteStatus: () => request("/api/admin/vote-status"),
reset: (password) =>
request("/api/admin/reset", { method: "POST", body: { password } }),
factoryReset: (password) =>
request("/api/admin/factory-reset", { method: "POST", body: { password } }),
grantJoker: (playerId) => request("/api/admin/joker", { method: "POST", body: { playerId } }),
setPlayerAdmin: (playerId, isAdmin) =>
request("/api/admin/player-admin", {
method: "POST",
body: { playerId, isAdmin },
}),
setPlayerPhase: (playerId, phase) =>
request("/api/admin/player-phase", { method: "POST", body: { playerId, phase } }),
deletePlayer: (playerId, password) =>
request(`/api/admin/players/${playerId}`, {
method: "DELETE",
body: { password },
}),
linkSuggestions: (sourceSuggestionId, targetSuggestionId) =>
request("/api/admin/link-suggestions", { method: "POST", body: { sourceSuggestionId, targetSuggestionId } }),
unlinkSuggestions: (suggestionId) =>
request("/api/admin/unlink-suggestions", { method: "POST", body: { suggestionId } }),
setResultsOpen: (resultsOpen) =>
request("/api/admin/results", {
method: "POST",
body: { resultsOpen },
}),
voteStatus: () => request("/api/admin/vote-status"),
reset: (password) =>
request("/api/admin/reset", { method: "POST", body: { password } }),
factoryReset: (password) =>
request("/api/admin/factory-reset", {
method: "POST",
body: { password },
}),
grantJoker: (playerId) =>
request("/api/admin/joker", { method: "POST", body: { playerId } }),
setPlayerAdmin: (playerId, isAdmin) =>
request("/api/admin/player-admin", {
method: "POST",
body: { playerId, isAdmin },
}),
setPlayerPhase: (playerId, phase) =>
request("/api/admin/player-phase", {
method: "POST",
body: { playerId, phase },
}),
deletePlayer: (playerId, password) =>
request(`/api/admin/players/${playerId}`, {
method: "DELETE",
body: { password },
}),
linkSuggestions: (sourceSuggestionId, targetSuggestionId) =>
request("/api/admin/link-suggestions", {
method: "POST",
body: { sourceSuggestionId, targetSuggestionId },
}),
unlinkSuggestions: (suggestionId) =>
request("/api/admin/unlink-suggestions", {
method: "POST",
body: { suggestionId },
}),
};

View File

@@ -114,6 +114,7 @@ function setupLoginFormHandlers({
if (err?.status === 401)
return toast(t("auth.invalidCredentials"), true);
if (handleAuthError(err, clearUserState)) return;
toast(err?.message || t("toast.unexpected"), true);
}
});
}

View File

@@ -1,5 +1,20 @@
import { api, adminApi } from "./api.js";
import { handleAuthError, renderAllSuggestions, renderCounts, renderMySuggestions, renderPhasePill, renderPhaseTitles, renderResults, renderVotes, renderWelcome, setAuthUI, syncVoteScores, updatePhaseNav, openResultsRelockModal, openSuggestionsChangedModal } from "./ui.js";
import {
handleAuthError,
renderAllSuggestions,
renderCounts,
renderMySuggestions,
renderPhasePill,
renderPhaseTitles,
renderResults,
renderVotes,
renderWelcome,
setAuthUI,
syncVoteScores,
updatePhaseNav,
openResultsRelockModal,
openSuggestionsChangedModal,
} from "./ui.js";
import { state, clearUserState } from "./state.js";
export async function loadState() {
@@ -86,18 +101,26 @@ export async function loadResults() {
}
export async function refreshPhaseData() {
const before = buildRefreshSnapshot();
try {
const prevPhase = state.phase;
const prevResultsOpen = state.resultsOpen;
await loadState();
await Promise.all([loadSuggestData(), loadSuggestionsData(), loadResults()]);
await Promise.all([
loadSuggestData(),
loadSuggestionsData(),
loadResults(),
]);
if (state.phase === "Vote") {
if (!state.votesRendered) await loadVoteData();
} else {
state.votesRendered = false;
await loadVoteData();
}
if (state.me?.isAdmin) {
const adminCard = document.getElementById("admin-card");
const adminPanelVisible =
!!adminCard && !adminCard.classList.contains("hidden");
if (state.me?.isAdmin && adminPanelVisible) {
state.adminVoteStatus = await adminApi.voteStatus();
}
if (
@@ -109,12 +132,34 @@ export async function refreshPhaseData() {
openResultsRelockModal();
}
updatePhaseNav();
const after = buildRefreshSnapshot();
return before !== after;
} catch (err) {
if (handleAuthError(err, clearUserState)) return;
throw err;
}
}
function buildRefreshSnapshot() {
return JSON.stringify({
phase: state.phase,
resultsOpen: state.resultsOpen,
votesFinal: state.votesFinal,
hasJoker: state.hasJoker,
counts: state.counts
? [
state.counts.players,
state.counts.suggestions,
state.counts.votes,
]
: null,
mineCount: state.mySuggestions?.length ?? 0,
allSig: state.allSuggestionsSig ?? "",
voteCount: state.myVotes?.length ?? 0,
resultsCount: state.results?.length ?? 0,
});
}
export function signatureSuggestions(list) {
return JSON.stringify(
list.map((s) => [

View File

@@ -1,6 +1,7 @@
export const $ = (id) => document.getElementById(id);
const toastEl = typeof document !== "undefined" ? document.getElementById("toast") : null;
const toastEl =
typeof document !== "undefined" ? document.getElementById("toast") : null;
export function toast(msg, isError = false) {
if (!toastEl) return;

View File

@@ -49,16 +49,6 @@ export function renderMySuggestions() {
export function renderAllSuggestions() {
renderAdminLinker();
const list = $("all-suggestions");
if (!list) return;
list.innerHTML = "";
const allowEdit = true;
const allowDelete = !!state.me?.isAdmin;
sortByName(state.allSuggestions).forEach((s) =>
list.appendChild(
buildCard(s, { showAuthor: true, allowEdit, allowDelete }),
),
);
renderPhaseTitles();
}

View File

@@ -261,15 +261,6 @@ export function updatePhaseNav() {
}
}
const voteNext = $("nav-vote-next");
if (voteNext) {
const locked = !state.resultsOpen && !isAdmin;
voteNext.disabled = locked;
voteNext.textContent = locked
? t("nav.waitingForResults")
: t("nav.next");
}
const adminResultsToggle = $("results-open");
if (adminResultsToggle) {
adminResultsToggle.textContent = state.resultsOpen