Skip to content

feat: introduce RowLink primitive and migrate leaderboard (#266)#269

Merged
anderdc merged 2 commits intoentrius:testfrom
edwin-rivera-dev:feat/row-link-primitive-and-leaderboard
Apr 15, 2026
Merged

feat: introduce RowLink primitive and migrate leaderboard (#266)#269
anderdc merged 2 commits intoentrius:testfrom
edwin-rivera-dev:feat/row-link-primitive-and-leaderboard

Conversation

@edwin-rivera-dev
Copy link
Copy Markdown
Contributor

@edwin-rivera-dev edwin-rivera-dev commented Apr 14, 2026

Summary

Introduces a shared RowLink primitive that renders clickable list rows as real <a href> elements, and migrates the Leaderboard surface (TopMinersTable rows + MinerCard) to use it. Middle-click, Cmd/Ctrl-click, and right-click "Open link in new tab" now all work on the Top Miners and Discoveries pages.

What changed

New primitive — src/components/common/RowLink.tsx

A thin <a href> wrapper that:

  • On plain left-click: calls preventDefault() and navigate(href, { state }) so React Router handles the transition (no full page reload, back-stack preserved, same UX as today)
  • On modifier-click / middle-click / right-click: lets the browser handle it — native "new tab", native context menu, native drag-to-bookmark, etc.
  • Respects defaultPrevented so nested clickable elements (copy buttons, inline links) keep working when they e.stopPropagation()

Migrations

  • MinerCard: replaced onClick: () => void prop with href + linkState. Wraps the card body in <RowLink>.
  • TopMinersTable: replaced onSelectMiner with a getHref(miner) prop and optional linkState. Every row (desktop + mobile card) is now a RowLink.
  • TopMinersPage and DiscoveriesPage: drop their handleSelectMiner callbacks; pass a URL builder and backLabel in linkState instead.

Unchanged

  • Plain left-click behavior on every migrated row — same target URL, same React Router transition, same back-button state. No visual changes, no animation changes.

Motivation (from #266)

Rows built with onClick + useNavigate() silently break every browser-native navigation idiom users expect from a list of links: middle-click, Cmd-click, right-click "Open in new tab", drag-to-bookmark. Fixing this with custom onAuxClick + modifier handlers only covers middle- and Cmd-click — the right-click context menu only surfaces "Open link in new tab" when the element is a real <a>. So the primitive is the right abstraction.

Scope

Intentionally limited to the Leaderboard surface for this PR. The other ~14 surfaces called out in #266 (Dashboard, Repositories page, Repository detail tabs, Miner detail tabs, PR detail header, Bounties, Search) will follow as individual PRs using the same primitive — each small and independently reviewable.

Type of Change

  • Feature / enhancement

Testing

  • npm run build
  • npm run lint:fix
  • Manual on /top-miners:
    • Plain click on a miner row → navigates to detail page, back label is Back to Leaderboard
    • Middle-click on a row → opens detail page in new tab ✓
    • Cmd-click / Ctrl-click on a row → opens in new tab ✓
    • Right-click → context menu shows "Open link in new tab" ✓
    • Hover shows the destination URL in the browser's status bar ✓
  • Manual on /top-miners?mode=discovery and /discoveries — same four behaviors; detail page opens with mode=issues, back label is Back to Discoveries.
  • Any internal clickable element inside a row (e.g. hotkey copy, sort chip) still works and does not navigate to the row's detail URL (guarded by e.stopPropagation()).
  • Keyboard: Tab focuses the row; Enter activates the link.

Checklist

  • No behavior change for plain left-click
  • No new dependencies
  • New primitive is framework-generic — reusable in follow-up PRs
  • URL construction moved into leaf components (closes the getMinerHref / linkState part of the issue)

Follow-ups (out of scope)

One PR per surface:

  • Dashboard — Live Activity + Repositories table
  • Repositories page — trending, most collateral, recent PRs, main table
  • Repository detail — PRs, bounties, GitHub issues, contributors
  • Miner detail — PRs, repositories, score breakdown
  • PR detail header — repo avatar / name / author
  • Bounties — available, pending, history, issue submissions
  • Search — miners, repositories, PRs, issues
  • LeaderboardSidebar (discoveries sidebar on XL viewports)

Media to upload

14.04.2026_22.33.02_REC_266.mp4

Fixes #266

@edwin-rivera-dev
Copy link
Copy Markdown
Contributor Author

@anderdc Please review my PR asap. I appreciate.
Thanks.

anderdc
anderdc previously approved these changes Apr 15, 2026
Copy link
Copy Markdown
Collaborator

@anderdc anderdc left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good fix — proper link semantics for miner cards. Needs CI to pass (no checks have run yet). Push or retrigger to get build/format results.

@anderdc
Copy link
Copy Markdown
Collaborator

anderdc commented Apr 15, 2026

fix ci

@edwin-rivera-dev
Copy link
Copy Markdown
Contributor Author

Hi @anderdc I have just fixed CI error.
Could you review again please?

@anderdc anderdc merged commit 7d6e8d2 into entrius:test Apr 15, 2026
2 checks passed
@anderdc anderdc added feature Net-new functionality refactor Code restructuring without behavior change and removed feature Net-new functionality labels Apr 16, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

refactor Code restructuring without behavior change

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Support opening list items in a new browser tab

2 participants