Skip to content

feat(discovery): build key discovery leaderboard page for top performing keys (#1206) - #1252

Open
ibrahimmujidah1-stack wants to merge 1 commit into
accesslayerorg:devfrom
ibrahimmujidah1-stack:feat/1206-key-discovery-leaderboard
Open

ibrahimmujidah1-stack wants to merge 1 commit into
accesslayerorg:devfrom
ibrahimmujidah1-stack:feat/1206-key-discovery-leaderboard

Conversation

@ibrahimmujidah1-stack

Copy link
Copy Markdown

Summary

Resolves #1206.

Creates a platform-wide key discovery leaderboard page ranking all creator keys by Volume, Holder count, and Reputation Score, helping users discover top-performing keys on AccessLayer.

Scope & Implementation Details

  • Leaderboard Page (KeyDiscoveryLeaderboardPage):
    • Metric Tabs: Three interactive tabs: Volume, Holders, and Reputation Score. Switching tabs updates URL search parameter ?metric=X and refetches from the analytics API.
    • Top 50 Key Ranking: Renders top 50 creator keys with rank badges (Gold, Silver, and Bronze badges for ranks 1-3), key title and symbol, creator profile link, metric value, and 24h price momentum.
    • 24h Change Formatting: Clear visual indicators displaying positive (+X.X% in green with upward trend), negative (-X.X% in red with downward trend), and neutral changes.
    • Connected Wallet Key Highlighting: Connected creator's keys are highlighted in the leaderboard with a distinctive card accent and "Your Key" badge when their wallet address matches the key creator.
    • Search Bar: Real-time filter filtering visible leaderboard results by key title, symbol, creator name, or creator wallet address, complete with a count indicator and clear button.
  • API & Data Service:
    • Added getKeyDiscoveryLeaderboard(metric) to analyticsService calling GET /analytics/keys/leaderboard?metric=X.
    • Added normalizeKeyLeaderboardEntry for robust response normalization supporting multiple payload formats.
    • Added getMockKeyDiscoveryLeaderboard fallback generator providing 50 ranked keys when the backend is offline.
    • Created useKeyDiscoveryLeaderboard React Query hook with cache key factory queryKeys.keyLeaderboard.byMetric(metric).
  • Routing & Discovery Navigation:
    • Added /discovery/leaderboard route wrapped with RouteErrorBoundary.
    • Added a "Leaderboard" navigation button with trophy icon in the DiscoveryPage header.
  • Tests:
    • Unit tests in keyLeaderboard.service.test.ts verifying API parameter passing, normalization, and error fallbacks.
    • Integration tests in KeyDiscoveryLeaderboardPage.test.tsx covering all acceptance criteria: rank rendering, 24h change formatting, connected wallet creator highlighting, search filtering, and metric tab refetching.

Closes #1206

…rorg#1206)

- Add LeaderboardMetric, KeyLeaderboardEntry types and normalizer
- Add getKeyDiscoveryLeaderboard to analyticsService with fallback mock data
- Add keyLeaderboardService and useKeyDiscoveryLeaderboard React Query hook
- Create KeyDiscoveryLeaderboardPage with Volume, Holders, Reputation Score metric tabs
- Add real-time search filtering by key name and creator
- Add rank badges, metric value formatting, and 24h change indicators with positive/negative styling
- Add connected wallet creator key highlighting
- Register /discovery/leaderboard route and link from DiscoveryPage
- Add comprehensive integration and service tests
@drips-wave

drips-wave Bot commented Oct 20, 2026

Copy link
Copy Markdown

@ibrahimmujidah1-stack Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

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.

Build key discovery leaderboard page for top performing keys

1 participant