BanGUI/Docs/Tasks.md

BanGUI — Task List

This document breaks the entire BanGUI project into development stages, ordered so that each stage builds on the previous one. Every task is described in prose with enough detail for a developer to begin work. References point to the relevant documentation.

Reference: Docs/Refactoring.md for full analysis of each issue.

---

Open Issues

Worldmap list pagination (new)

• Status: done

• Goal: Add paging controls to the WorldMap companion bans table (map page) so it matches Dashboard ban-list behavior and supports country drilldown without rendering / scrolling huge result sets.

• Implement in frontend/src/pages/MapPage.tsx using the dashboard pattern from frontend/src/components/BanTable.tsx:

  1. Add local state: page (start 1), pageSize (e.g., 100).
  2. Derive visibleBans from useMemo + selectedCountry, then compute pageBans using slice((page-1)*pageSize, page*pageSize).
  3. Compute totalPages = Math.max(1, Math.ceil(visibleBans.length / pageSize)), hasPrev, hasNext.
  4. Render a footer row below Table with total, page, prev/next buttons (use icons ChevronLeftRegular, ChevronRightRegular, or existing style).
  5. Wire buttons to setPage(page - 1) / setPage(page + 1), disabled by bounds.
  6. Reset page to 1 whenever visibleBans filter changes: on range, originFilter, selectedCountry, or when data refreshes.

• UX details:

  • Keep existing “no bans found” row behavior.
  • Keep summary info bar and total line consistent; show current slice counts in message as needed.
  • Ensure paged data is used for TableBody mapping.

• Optional follow-ups:

  • Allow page-size selector if needed (25/50/100), updating totalPages and reset to page 1 on change.
  • Add tests in frontend/src/pages/__tests__/MapPage.test.tsx for paging behavior (initial page, next/prev, filtering reset).
  • Add documentation in Docs/Web-Design.md if there is a worldmap data table UI guideline.