kindred/silo
1
1
Fork 0
Code Issues 29 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

UI/UX: Consolidate pagination into footer stats bar #19

New Issue
Closed
opened 2026-02-07 20:33:19 +00:00 by forbes · 0 comments
forbes commented 2026-02-07 20:33:19 +00:00
Owner
Copy Link

Problem

The ItemsPage (and AuditPage) have separate pagination controls and a footer stats bar, each consuming their own vertical space. The pagination bar is ~21px and the footer stats bar is 28px — two separate horizontal bars that could be one.

Current Layout (bottom of ItemsPage)

  1. Pagination bar (~21px): page number buttons, items-per-page selector
  2. FooterStats bar (28px fixed): total items count, connection info

These are stacked vertically, consuming ~49px at the bottom of the page.

Proposed Changes

  • Merge pagination controls into the FooterStats bar as a single compact bar
  • Left side: row count / total items info
  • Center or right side: page navigation (prev/next, page numbers)
  • Far right: items-per-page selector
  • Apply same pattern to AuditPage if it has separate pagination
  • Target: single bar at ~28-32px total

Impact

MEDIUM — Saves ~20px of vertical space. Cleaner visual hierarchy with one status bar instead of two.

Files

  • web/src/pages/ItemsPage.tsx (pagination + footer layout)
  • web/src/pages/AuditPage.tsx (if applicable)
  • May need a shared PaginatedFooter component
## Problem The ItemsPage (and AuditPage) have separate pagination controls and a footer stats bar, each consuming their own vertical space. The pagination bar is ~21px and the footer stats bar is 28px — two separate horizontal bars that could be one. ## Current Layout (bottom of ItemsPage) 1. **Pagination bar** (~21px): page number buttons, items-per-page selector 2. **FooterStats bar** (28px fixed): total items count, connection info These are stacked vertically, consuming ~49px at the bottom of the page. ## Proposed Changes - Merge pagination controls into the FooterStats bar as a single compact bar - Left side: row count / total items info - Center or right side: page navigation (prev/next, page numbers) - Far right: items-per-page selector - Apply same pattern to AuditPage if it has separate pagination - Target: single bar at ~28-32px total ## Impact MEDIUM — Saves ~20px of vertical space. Cleaner visual hierarchy with one status bar instead of two. ## Files - `web/src/pages/ItemsPage.tsx` (pagination + footer layout) - `web/src/pages/AuditPage.tsx` (if applicable) - May need a shared `PaginatedFooter` component
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
No items
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
forbes
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: kindred/silo#19
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?