Skip to content

feat: highlight active page in dashboard sidebar#74

Merged
DIodide merged 1 commit into
stagingfrom
feat/dashboard-sidebar-active-state
Mar 21, 2026
Merged

feat: highlight active page in dashboard sidebar#74
DIodide merged 1 commit into
stagingfrom
feat/dashboard-sidebar-active-state

Conversation

@DIodide

@DIodide DIodide commented Mar 21, 2026

Copy link
Copy Markdown
Member

Summary

  • Adds active state detection to the dashboard sidebar using usePathname() from Next.js
  • Active nav item gets a Princeton Orange left accent bar and tinted background so users can instantly see which page they're on
  • Exact match for /dashboard (Overview), prefix match for all sub-routes (e.g. /dashboard/matches/123 highlights Matches)

Test plan

  • Navigate to each dashboard page and verify the corresponding sidebar item is highlighted
  • Verify sub-routes (e.g. /dashboard/matches/[id]) highlight their parent nav item
  • Verify the Overview item is only highlighted on exactly /dashboard, not on sub-pages
  • Verify disabled items (pre-setup) are unaffected

🤖 Generated with Claude Code

Use usePathname() to detect the current route and apply a Princeton
Orange accent bar + tinted background to the active nav item, so users
can immediately see which page they're on.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@DIodide DIodide merged commit b51a19f into staging Mar 21, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant