Context
Part of epic #6504's visual/ui-kit track. apps/loopover-miner-ui/src/routes/portfolio.tsx:39-56 hand-duplicates the same 4-branch loading/error/empty/data JSX pattern with plain-text loading ("Loading local portfolio queue…"), bare-number metrics (lines 64-66), and static full-dump tables (lines 71-92, 129-158) with no sort/filter/pagination.
Requirements
- Adopt
Skeleton/chart.tsx for the status cards' loading state, matching the real layout.
- Adopt
pagination.tsx for the per-repo table and the queue-actions table.
- Adopt the shared async-state primitives from the ui-kit-port child issue of this same epic instead of the hand-rolled 4-branch JSX.
- Leave the underlying fetchers (
apps/loopover-miner-ui/src/lib/portfolio-queue.ts, portfolio-queue-actions.ts) and existing release/requeue action buttons untouched — this is restyle-only, per the epic's explicit boundary.
Deliverables
Test Coverage Requirements
99%+ Codecov patch coverage on every changed line and branch, plus a regression test for the new/changed behavior (note: apps/** UI code may fall outside the strict Codecov patch gate — check coverage.include — but a before/after screenshot table per this repo's UI-PR convention is still required for any visual change).
Expected Outcome
The portfolio route has content-shaped loading states and paginated, sortable tables instead of static full dumps.
Links & Resources
Epic: #6504. apps/loopover-miner-ui/src/routes/portfolio.tsx:39-56,64-66,71-92,97-162,129-158.
Context
Part of epic #6504's visual/ui-kit track.
apps/loopover-miner-ui/src/routes/portfolio.tsx:39-56hand-duplicates the same 4-branch loading/error/empty/data JSX pattern with plain-text loading ("Loading local portfolio queue…"), bare-number metrics (lines 64-66), and static full-dump tables (lines 71-92, 129-158) with no sort/filter/pagination.Requirements
Skeleton/chart.tsxfor the status cards' loading state, matching the real layout.pagination.tsxfor the per-repo table and the queue-actions table.apps/loopover-miner-ui/src/lib/portfolio-queue.ts,portfolio-queue-actions.ts) and existing release/requeue action buttons untouched — this is restyle-only, per the epic's explicit boundary.Deliverables
portfolio.tsxrestyled with skeleton/chart/pagination across status cards and both tablesTest Coverage Requirements
99%+ Codecov patch coverage on every changed line and branch, plus a regression test for the new/changed behavior (note: apps/** UI code may fall outside the strict Codecov patch gate — check coverage.include — but a before/after screenshot table per this repo's UI-PR convention is still required for any visual change).
Expected Outcome
The portfolio route has content-shaped loading states and paginated, sortable tables instead of static full dumps.
Links & Resources
Epic: #6504.
apps/loopover-miner-ui/src/routes/portfolio.tsx:39-56,64-66,71-92,97-162,129-158.