fix: Stop MapPage pagination resetting on every data refresh

Remove 'bans' from the useEffect dependency array that resets pagination.
Since 'bans' changes with every background data refresh (new array reference),
the page was being reset to 1 every 30 seconds, making the table unusable for
pagination beyond the first page.

Add a separate effect that clamps the current page to totalPages when the
data shrinks below the current page offset (edge case when filtered results
are fewer than displayed page).

Fixes TASK-BUG-03.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
2026-04-22 21:24:05 +02:00
parent 0bfa975222
commit d1674add90

View File

@@ -151,7 +151,7 @@ export function MapPage(): React.JSX.Element {
useEffect(() => { useEffect(() => {
setPage(1); setPage(1);
}, [range, originFilter, selectedCountry, bans, pageSize]); }, [range, originFilter, selectedCountry, pageSize]);
/** Bans visible in the companion table (filtered by selected country). */ /** Bans visible in the companion table (filtered by selected country). */
const visibleBans = useMemo(() => { const visibleBans = useMemo(() => {
@@ -164,6 +164,14 @@ export function MapPage(): React.JSX.Element {
: null; : null;
const totalPages = Math.max(1, Math.ceil(visibleBans.length / pageSize)); const totalPages = Math.max(1, Math.ceil(visibleBans.length / pageSize));
// Clamp page to totalPages when data shrinks below current page offset
useEffect(() => {
if (page > totalPages) {
setPage(totalPages);
}
}, [totalPages, page]);
const hasPrev = page > 1; const hasPrev = page > 1;
const hasNext = page < totalPages; const hasNext = page < totalPages;