feat(miner-ui): adopt chart and pagination on the ledgers route (#6832)

[thomasalvaedison7777-lgtm]

Summary

Restyles the miner-ui Ledgers route (#6832) to finish the visual/ui-kit track on top of the #6512 StateBoundary/Skeleton work: claims cards get a ui-kit ChartContainer bar chart, and both event count-tables plus the recent-events feed paginate client-side via Pagination once they exceed 20 rows — matching the run-history restyle (#6510).

Behavior

• Claims → status cards unchanged for exact counts; a horizontal bar chart (ChartContainer + recharts) shows the Active / Released / Expired breakdown. Loading skeleton includes a chart-shaped block.
• Event tables → governor-events CountTable, events-by-type CountTable, and recent-events feed each paginate client-side above 20 rows; full table below that. No new API route/param.
• Async chrome → shared StateBoundary (already from Redesign: Ledgers route — StateBoundary + skeletons + governor section restyle #6512) kept for both independent ledger-summary and governor-control flows.
• Untouched: lib/ledgers.ts, lib/governor.ts, both fetch loops, and pause/resume Button wiring — presentation-only.

Scope

• The PR title follows type(scope): short summary Conventional Commit format
• This PR is focused and does not mix unrelated backend, UI, MCP, docs, dependency, and deploy changes
• This follows CONTRIBUTING.md and does not reintroduce GitHub Pages, VitePress, site/, or CNAME
• I linked a currently open issue this PR resolves — Closes Miner dashboard: ledgers route skeleton/chart/pagination adoption #6832

Validation

• git diff --check
• npm run actionlint (not run — no workflow changes)
• npm run typecheck (root; miner-ui typecheck has a pre-existing vite-chat-api.ts cast issue unrelated to this diff)
• npm run test:coverage (N/A — apps/** is outside Codecov coverage.include)
• npm run test:workers / MCP / ui:* (N/A — miner-ui-only change)
• New or changed behavior has unit tests for chart mount, pagination absent ≤20 / present >20, Previous/Next, and null column fallbacks
• npm --workspace @loopover/ui-miner run test green (coverage floors met)

If any required check was skipped, explain why:
Miner-ui-only restyle under apps/loopover-miner-ui/** (outside Codecov src/**). Local verification is the workspace vitest suite + UI screenshots below.

Safety

• No secrets, wallet details, hotkeys, coldkeys, user PATs, private keys, raw trust scores, private rankings, or private maintainer evidence are exposed
• Public GitHub text stays sanitized
• Auth/CORS unchanged
• API/OpenAPI/MCP unchanged
• UI uses live local API data / real empty/error/loading states
• Visible UI changes include a UI Evidence section — fill with hosted JPG/PNG before opening
• No changelog / site/ / CNAME edits

UI Evidence

Notes

Closes #6832. Epic #6504.

[superagent-security]

Superagent didn't find any vulnerabilities or security issues in this PR.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 93.70%. Comparing base (b1a2bbd) to head (5659f59).
⚠️ Report is 5 commits behind head on main.

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #6920   +/-   ##
=======================================
  Coverage   93.70%   93.70%           
=======================================
  Files         685      685           
  Lines       68331    68331           
  Branches    18723    18723           
=======================================
  Hits        64032    64032           
  Misses       3302     3302           
  Partials      997      997           

Flag	Coverage Δ
shard-1	43.65% <ø> (ø)
shard-2	36.80% <ø> (ø)
shard-3	32.68% <ø> (ø)
shard-4	34.82% <ø> (+<0.01%)	⬆️
shard-5	31.91% <ø> (ø)
shard-6	45.46% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

[loopover-orb]

Tip

✅ LoopOver review result - approve/merge recommended

_{Review updated: 2026-07-17 13:35:11 UTC}

6 files · 1 AI reviewer · no blockers · readiness 80/100 · CI green · clean

✅ Suggested Action - Approve/Merge

• safe to merge

Review summary
This PR restyles the ledgers route with a recharts-backed ChartContainer bar chart for claim status counts and client-side Pagination for governor/event-type/recent-events tables once they exceed 20 rows, while leaving lib/ledgers.ts, lib/governor.ts, and the two fetch loops untouched as claimed. The pagination logic (safePage clamping, isPaginated threshold, independent per-table page state) is correct and well covered by tests exercising both the ≤20 unpaginated path and the >20 paginated path across all three tables, including Previous/Next click arms and null-column fallbacks. The PR closes #6832 as required and matches the prior run-history restyle pattern (#6510).

Nits — 5 non-blocking

• apps/loopover-miner-ui/package.json adds recharts (~120KB gzip, 8 transitive deps) for a single chart usage in ledgers.tsx:3 — worth confirming the bundle-size tradeoff is acceptable for one route.
• apps/loopover-miner-ui/src/routes/ledgers.tsx:204-215 has several unnamed magic numbers (margin values 4/12/4/4, width 72) for the chart layout — a short named constant or comment would help future tweaks.
• No test exercises clicking Next at the last page or Previous at page 0 to confirm the aria-disabled no-op path is truly inert (currently only mid-range Previous/Next clicks are covered).
• The Cell fill `var(--color-${entry.status})` in ClaimsStatusChart (ledgers.tsx) depends on ChartContainer generating those custom properties from CLAIMS_CHART_CONFIG — worth a quick visual check that colors actually render, since jsdom tests can't catch a wrong CSS variable name.
• Consider extracting the repeated CountTable/RecentEventsTable pagination-state boilerplate (page state, pageCount, safePage, visible slice) into a shared hook, since it's now duplicated three ways (ledgers.tsx CountTable and RecentEventsTable).

Decision drivers

• ✅ Code review — No blockers (1 reviewer)
• ✅ Gate result — Passing (No configured blocker found.)

Context & advisory signals — never blocks the verdict

Signal	Result	Evidence
Linked issue	✅ Linked	#6832
Related work	⚠️ 3 scoped overlaps	Top overlaps are listed below; lower-confidence bulk is hidden.
Change scope	❌ 8/20	High review scope from cached public metadata (1 linked issue).
Validation posture	✅ 25/25	PR body includes validation/test evidence.
Contributor workload	✅ 10/10	Author activity: 21 registered-repo PR(s), 13 merged, 1 issue(s).
Contributor context	✅ Confirmed Gittensor contributor	thomasalvaedison7777-lgtm; Gittensor profile; 21 PR(s), 1 issue(s).
Improvement	✅ Minor	risk: clean · value: minor · LLM: moderate

Linked issue satisfaction

Addressed
The diff adds Skeleton/ChartContainer for the claims section, adopts Pagination for both the event count-tables and the recent-events feed, keeps the shared StateBoundary async primitive, and leaves lib/ledgers.ts, lib/governor.ts, and the pause/resume Button wiring untouched, matching all stated requirements. Tests cover chart mount, pagination presence/absence at the 20-row threshold, prev/next

Review context

• Author: thomasalvaedison7777-lgtm
• Role context: outside_contributor
• Public audience mode: oss maintainer
• Lane context: Repository is configured for direct PR review.
• Public profile languages: JavaScript, TypeScript
• Official Gittensor activity: 21 PR(s), 1 issue(s).
• Related work: Titles/paths share 10 meaningful terms. (issue #6830, issue #6832)
• Related work: Titles/paths share 10 meaningful terms. (issue #6829, issue #6832)
• Related work: Titles/paths share 6 meaningful terms. (issue #6832, issue #6839)

Contributor next steps

• Start here: Review top overlaps.
• Then work through the remaining 2 steps in the Signals table above.

Signal definitions

• Related work = same linked issue, overlapping active PRs, or title/path similarity.
• Change scope = cached public metadata such as size labels, draft state, and review-burden hints.
• Validation posture = whether the PR provides enough public validation/test evidence for maintainer review.
• Contributor workload = public contributor activity and cleanup pressure, not a repo-wide quality failure.
• Contributor context = public GitHub/Gittensor identity context; non-Gittensor status is not a blocker.

🧪 Chat with LoopOver

Ask LoopOver a question about this PR directly in a comment — grounded only in the same cached, public-safe facts shown above, never a new claim.

• @loopover ask <question> answers contribution-quality Q&A with source citations and freshness.
• @loopover chat <question> answers in natural prose from cached decision-pack facts via local inference (maintainer/collaborator; read-only).
• A plain-language @loopover mention with a real question is routed to the closest matching read-only command automatically — no exact syntax required.

Full command reference: https://loopover.ai/docs/loopover-commands

🧪 Experimental — new and may change.

Visual preview

Route	Viewport	Before (production)	After (this PR's preview)	Diff
/ledgers	desktop	before /ledgers	after /ledgers	—
/ledgers	mobile	before /ledgers (mobile)	after /ledgers (mobile)	—

Click any thumbnail to open the full-size screenshot. Before = production · After = this PR's preview deploy.

_{🟩 Safe / merged · 🟦 Advisory · 🟨 Held for review · 🟥 Blocked / closed}

---

💰 Earn for open-source contributions like this. Gittensor lets GitHub contributors earn for the work they already do — register to start earning →.

Checked by LoopOver, a quiet PR intelligence layer for OSS maintainers.

• Re-run LoopOver review

[loopover-orb]

LoopOver approves — the gate is satisfied and CI is green.