MotirBuilding in public
MOTIR · moooon
onMotir
You’re viewing a public project. Anyone can view it — no account needed. Sign in to submit, upvote, or comment on requests.View-only — you can’t edit work items
MOTIR-121

2.5.10 Design — List view pagination (server-paged navigator)

Done
Description

Estimate: 30m

Finding #57: the List loads EVERY project issue with no paging — a scale gap a real Jira alternative can't have. This designs the paged List affordance, mirroring Jira's issue navigator (rung 1): a footer pagination bar — "Showing 1–50 of N" + prev/next + page jumps — over a fixed page size. The List is already flat + server-sorted + filterable, so paging is LIMIT/OFFSET + a count; the bar drives a URL ?page= param that composes with the existing ?view/?sort/ filter params. Design the loading state (skeleton while a page streams), the page-out-of-range and empty-result states, and the count's relationship to the active filter (count of the FILTERED set). Output: extend design/work-items/list.mock.html (a pagination panel) + design-notes.md. Colour via --el-*, AA-safe; reuse shipped primitives (Button / SectionLabel) — no new visual primitive.

(PR #109 merged 2026-06-05, merge commit b70d15a — design APPROVED. Added panel 5 to list.mock.html: the server-paged footer bar inside the table box (Jira-navigator shape) — "Showing 1–50 of N" + Prev/Next chevrons + numbered pages with ellipsis truncation; current page = accent chip + aria-current="page"; Prev/Next disable at the ends. Two states (page 1 + a middle page); chevron-left/right icon defs added. design-notes.md section: page size 50, LIMIT/OFFSET + count, ?page= composes with sort+filter (count tracks the FILTERED set), out-of-range clamps to last page, 0 rows → empty state with no pager; Tree explicitly excluded (it scales via lazy-load/virtual, 2.5.11). Render-checklist applied (icon viewBox, no nested buttons, prettier, both panels, light+dark). Gates 2.5.12.)

Acceptance criteria

  • The List mockup gains a pagination bar (range "1–50 of N" + prev/next + page controls), with loading / empty / out-of-range states; design-notes.md names the page size, the ?page= URL param, and that the count honours the active filter.
  • Mirrors Jira's navigator paging; reuses shipped primitives; --el-* only; AA-safe.

Context refs

  • design/work-items/list.mock.html + design-notes.md (2.5.7) — the surface to extend
  • components/ui/Button + the /tokens tokens; Jira issue-navigator pagination as the mirror
Status
Done
Type
Sub-task