fix: show pagination for dynamic recent matches

This commit is contained in:
devRaGonSa
2026-06-02 14:55:33 +02:00
parent cf46f9b58a
commit 60bcfc27c3

View File

@@ -10,6 +10,7 @@
serverSlug: "all-servers", serverSlug: "all-servers",
page: 1, page: 1,
pageSize: DEFAULT_RECENT_MATCHES_PAGE_SIZE, pageSize: DEFAULT_RECENT_MATCHES_PAGE_SIZE,
activeRequestId: 0,
}; };
document.addEventListener("DOMContentLoaded", () => { document.addEventListener("DOMContentLoaded", () => {
@@ -42,20 +43,29 @@
const backendBaseUrl = document.body.dataset.backendBaseUrl || "http://127.0.0.1:8000"; const backendBaseUrl = document.body.dataset.backendBaseUrl || "http://127.0.0.1:8000";
const serverSlug = normalizeDynamicServerSlug(forcedServerSlug || readServerFromUrl()); const serverSlug = normalizeDynamicServerSlug(forcedServerSlug || readServerFromUrl());
const shouldResetPage = serverSlug !== recentMatchesState.serverSlug;
const requestId = recentMatchesState.activeRequestId + 1;
recentMatchesState.activeRequestId = requestId;
recentMatchesState.serverSlug = serverSlug;
try { try {
const response = await fetch(`${backendBaseUrl}${RECENT_MATCHES_ENDPOINT}?server=${encodeURIComponent(serverSlug)}&limit=${RECENT_MATCHES_LIMIT}`, { cache: "no-store" }); const response = await fetch(`${backendBaseUrl}${RECENT_MATCHES_ENDPOINT}?server=${encodeURIComponent(serverSlug)}&limit=${RECENT_MATCHES_LIMIT}`, { cache: "no-store" });
if (!response.ok) throw new Error(`HTTP ${response.status}`); if (!response.ok) throw new Error(`HTTP ${response.status}`);
const payload = await response.json(); const payload = await response.json();
if (requestId !== recentMatchesState.activeRequestId || serverSlug !== recentMatchesState.serverSlug) {
return;
}
const data = payload?.data || {}; const data = payload?.data || {};
const items = Array.isArray(data.items) ? data.items : []; const items = Array.isArray(data.items) ? data.items : [];
recentMatchesState.items = items; recentMatchesState.items = items;
recentMatchesState.serverSlug = serverSlug; if (shouldResetPage) {
recentMatchesState.page = 1; recentMatchesState.page = 1;
}
if (!items.length) { if (!items.length) {
recentMatchesState.page = 1;
setDynamicState(stateNode, "No hay partidas recientes disponibles para este alcance."); setDynamicState(stateNode, "No hay partidas recientes disponibles para este alcance.");
listNode.innerHTML = ""; listNode.innerHTML = "";
metaNode.textContent = "Datos recientes sin partidas disponibles."; metaNode.textContent = "Datos recientes sin partidas disponibles.";
@@ -68,6 +78,9 @@
metaNode.textContent = buildDynamicRecentMeta(items); metaNode.textContent = buildDynamicRecentMeta(items);
renderDynamicRecentMatchesPage(); renderDynamicRecentMatchesPage();
} catch (error) { } catch (error) {
if (requestId !== recentMatchesState.activeRequestId || serverSlug !== recentMatchesState.serverSlug) {
return;
}
recentMatchesState.items = []; recentMatchesState.items = [];
recentMatchesState.page = 1; recentMatchesState.page = 1;
setDynamicState(stateNode, "No se pudieron cargar las partidas recientes dinámicas.", true); setDynamicState(stateNode, "No se pudieron cargar las partidas recientes dinámicas.", true);
@@ -176,7 +189,7 @@
const totalItems = recentMatchesState.items.length; const totalItems = recentMatchesState.items.length;
const totalPages = getDynamicTotalPages(); const totalPages = getDynamicTotalPages();
recentMatchesState.page = clampDynamicPage(recentMatchesState.page, totalPages); recentMatchesState.page = clampDynamicPage(recentMatchesState.page, totalPages);
paginationNode.hidden = totalItems <= 0; paginationNode.hidden = totalItems <= recentMatchesState.pageSize;
pageSizeSelect.value = String(recentMatchesState.pageSize); pageSizeSelect.value = String(recentMatchesState.pageSize);
prevButton.disabled = recentMatchesState.page <= 1; prevButton.disabled = recentMatchesState.page <= 1;
nextButton.disabled = recentMatchesState.page >= totalPages; nextButton.disabled = recentMatchesState.page >= totalPages;