Redesign repo list rows with activity sparklines#4
Merged
Conversation
Rows go from a dense single line to a taller two-line layout (name +
pills, full-width description) with a per-repo commit-activity sparkline
in a new column, GitHub-style.
- Sparkline: dependency-free SVG micro bar chart of weekly commit counts
(12 weeks); past weeks in a de-emphasis tone, current week in the warm
accent. Values carried by an aria-label; counts at the node's
30-commit API cap are reported as a floor ("30+").
- useRepoActivity: IntersectionObserver-gated lazy load per row, session
cache, and a 2-slot concurrency pool since the node limits concurrent
connections. Hover-prefetched repos (repoCache) resolve without a
fetch via the new RepoCommit.dateRaw field.
- RepoList header and RepoRowSkeleton updated to the new grid.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Redesigns the repository list rows and adds a GitHub-style commit-activity graph.
Rows go from a dense single line (~44px) to a taller two-line layout (~95px):
repo name + pills on line one, full-width description on line two, updated time
and stars stacked in a right-aligned meta column. The squeezed description/branch
grid columns are removed (branch was already shown as a pill).
Each row gains an activity sparkline (md+ viewports): a dependency-free
110×28 SVG bar chart of weekly commit counts over the last 12 weeks — past weeks
in a de-emphasis tone, the current week in the warm accent. The value is exposed
via
aria-label; sums at the node's 30-commit API cap read as a floor ("30+ commits").Loading is node-friendly:
useRepoActivityfetches/commitsonly once a rowscrolls near the viewport (IntersectionObserver, 200px margin), through a 2-slot
concurrency pool (the node limits concurrent connections), with a session cache.
Hover-prefetched repos (
repoCache) resolve without any fetch via the newRepoCommit.dateRawfield.Known limitation: the node returns at most 30 commits, so hyperactive repos
collapse into a single current-week bar. The real fix is server-side weekly
buckets on the list endpoint — a good candidate to bundle with the pending
q=/sort=node deploy.Type of change
How was this tested?
src/lib/activity.test.ts);full suite: 68 tests passing.
/commitsrequests observed: 2 (concurrency cap holds).page 2 — not one per row.
md(0 visible at 390px); rows stack cleanly on mobile.themepersistence.Screenshots
Checklist
npm run lintpassesnpm testpassesnpm run buildpasses (includes typecheck)src/lib/has colocated unit tests