fix continuous scroll next page logic error

This commit is contained in:
Christoph Kluge 2025-06-12 17:20:22 +02:00
parent f471214ef7
commit ad108b285f
3 changed files with 9 additions and 9 deletions

View File

@ -850,7 +850,7 @@ func (ccms *CCMetricStore) LoadNodeListData(
if len(nodes) > page.ItemsPerPage { if len(nodes) > page.ItemsPerPage {
start := (page.Page - 1) * page.ItemsPerPage start := (page.Page - 1) * page.ItemsPerPage
end := start + page.ItemsPerPage end := start + page.ItemsPerPage
if end > len(nodes) { if end >= len(nodes) {
end = len(nodes) end = len(nodes)
hasNextPage = false hasNextPage = false
} else { } else {

View File

@ -539,7 +539,7 @@ func (pdb *PrometheusDataRepository) LoadNodeListData(
if len(nodes) > page.ItemsPerPage { if len(nodes) > page.ItemsPerPage {
start := (page.Page - 1) * page.ItemsPerPage start := (page.Page - 1) * page.ItemsPerPage
end := start + page.ItemsPerPage end := start + page.ItemsPerPage
if end > len(nodes) { if end >= len(nodes) {
end = len(nodes) end = len(nodes)
hasNextPage = false hasNextPage = false
} else { } else {

View File

@ -86,11 +86,10 @@
let page = $state(1); let page = $state(1);
let itemsPerPage = $state(usePaging ? (ccconfig?.plot_list_nodesPerPage || 10) : 10); let itemsPerPage = $state(usePaging ? (ccconfig?.plot_list_nodesPerPage || 10) : 10);
let headerPaddingTop = $state(0); let headerPaddingTop = $state(0);
let matchedNodes = $state(0);
/* Derived */ /* Derived */
const paging = $derived({ itemsPerPage, page }); const paging = $derived({ itemsPerPage, page });
const matchedNodes = $derived($nodesQuery?.data?.nodeMetricsList?.totalNodes || 0);
const nodesQuery = $derived(queryStore({ const nodesQuery = $derived(queryStore({
client: client, client: client,
query: nodeListQuery, query: nodeListQuery,
@ -119,7 +118,7 @@
} = document.documentElement; } = document.documentElement;
// Add 100 px offset to trigger load earlier // Add 100 px offset to trigger load earlier
if (scrollTop + clientHeight >= scrollHeight - 100 && $nodesQuery?.data != null && $nodesQuery.data?.nodeMetricsList.hasNextPage) { if (scrollTop + clientHeight >= scrollHeight - 100 && $nodesQuery?.data?.nodeMetricsList?.hasNextPage) {
page += 1 page += 1
}; };
}); });
@ -127,7 +126,7 @@
}); });
$effect(() => { $effect(() => {
handleNodes($nodesQuery?.data?.nodeMetricsList?.items); handleNodes($nodesQuery?.data?.nodeMetricsList);
}); });
$effect(() => { $effect(() => {
@ -145,14 +144,15 @@
/* Functions */ /* Functions */
function handleNodes(data) { function handleNodes(data) {
if (data) { if (data) {
matchedNodes = data.totalNodes;
if (usePaging || nodes.length == 0) { if (usePaging || nodes.length == 0) {
nodes = [...data].sort((a, b) => a.host.localeCompare(b.host)); nodes = [...data.items].sort((a, b) => a.host.localeCompare(b.host));
} else { } else {
// Workaround to ignore secondary store triggers (reason tbd) // Workaround to ignore secondary store triggers (reason tbd)
const oldNodes = $state.snapshot(nodes) const oldNodes = $state.snapshot(nodes)
const newNodes = [...data].map((d) => d.host) const newNodes = [...data.items].map((d) => d.host)
if (!oldNodes.some((n) => newNodes.includes(n.host))) { if (!oldNodes.some((n) => newNodes.includes(n.host))) {
nodes = nodes.concat([...data].sort((a, b) => a.host.localeCompare(b.host))) nodes = nodes.concat([...data.items].sort((a, b) => a.host.localeCompare(b.host)))
}; };
}; };
}; };