diff --git a/wwwroot/js/ui.js b/wwwroot/js/ui.js index ed60f86..06e7abd 100644 --- a/wwwroot/js/ui.js +++ b/wwwroot/js/ui.js @@ -5,6 +5,11 @@ import { $, toast } from "./dom.js"; import { setupCardVisualHover, triggerCelebration } from "./effects.js"; import { adminApi } from "./api.js"; +const sortByName = (items) => + (items ?? []) + .slice() + .sort((a, b) => a.name.localeCompare(b.name, undefined, { sensitivity: "base" })); + export function setAuthUI(isAuthed) { const main = document.querySelector("main"); const statusBar = document.querySelector(".status-bar"); @@ -108,7 +113,7 @@ export function renderMySuggestions() { const allowEdit = true; // own suggestions can always adjust optional data const lockTitle = state.phase !== "Suggest" && !state.me?.isAdmin; const allowDelete = state.phase === "Suggest" || state.me?.isAdmin; - state.mySuggestions.forEach((s) => + sortByName(state.mySuggestions).forEach((s) => wrap.appendChild( buildCard(s, { showAuthor: false, allowDelete, allowEdit, lockTitle }), ), @@ -122,7 +127,7 @@ export function renderAllSuggestions() { list.innerHTML = ""; const allowEdit = true; // allow own edits (optional fields) in vote const allowDelete = !!state.me?.isAdmin; - state.allSuggestions.forEach((s) => + sortByName(state.allSuggestions).forEach((s) => list.appendChild( buildCard(s, { showAuthor: true, allowEdit, allowDelete }), ), @@ -137,7 +142,7 @@ export function renderVotes() { const votesMap = Object.fromEntries( state.myVotes.map((v) => [v.suggestionId, v.score]), ); - state.allSuggestions.forEach((s) => { + sortByName(state.allSuggestions).forEach((s) => { const canEdit = !!state.me?.isAdmin || s.playerId === state.me?.id; const lockTitle = state.phase !== "Suggest" && !state.me?.isAdmin; const li = buildCard(s, {