feat: implement premium leaderboard component and data layer (Closes #259)

[AdityaM-IITH]

Summary

This pull request introduces the Public Leaderboard Page component, designed with a premium, high-performance bento grid layout to showcase top contributors. The rankings are dynamically calculated based on active contribution streaks and total commit counts.

Closes #259

Type of Change

• Bug fix
• New feature
• Documentation update
• Refactor / code cleanup

Changes Made

• Premium UI Component: Created a responsive, dark-mode bento grid layout in src/components/LeaderboardPage.tsx using glassmorphism styling, a dedicated top-3 developer podium, and subtle ambient gradients.
• Asymmetric Desktop Podium Grid: Arranged the Top 3 podium items on desktop using custom grid sorting to display in the precise spatial balance order: [ Rank 2 ] [ Rank 1 ] [ Rank 3 ] with visual elevation and distinct scaling for the MVP.
• Hook & Data Layer: Implemented useLeaderboard to query the contributors table, order results by active streaks and total commits, and handle loading, error, and empty database states gracefully.
• Graceful Mock Fallback: Integrated a robust, zero-configuration local mock data fallback in the fetch hook. If Supabase environment variables are missing or unconfigured on the host machine, the page seamlessly boots with realistic developer records so reviewers can preview the entire UI layout instantly.
• Supabase Browser Instance: Exported a standard client-side supabase client in src/lib/supabase.ts utilizing the public anon key for secure browser operations.
• Dependency Integration: Installed lucide-react to support premium, highly visible graphical icons across the leaderboard views.

How to Test

Steps for the reviewer to verify this works:

1. Zero-Configuration Preview: Run npm run dev with .env unconfigured or empty. Navigate to /leaderboard and verify that the page gracefully falls back to displaying a beautiful, fully-populated mock contributor board showing both the asymmetrical podium and the index list.
2. Supabase Dynamic Queries: Add active NEXT_PUBLIC_SUPABASE_URL and NEXT_PUBLIC_SUPABASE_ANON_KEY variables to your environment. The page will instantly transition to query real-time data from your Supabase backend.
3. Verify there are no type check errors (npm run type-check) or styling warnings (npm run lint).

Screenshots (if UI change)

Asymmetric Desktop Podium Layout

Displays Rank 2, Rank 1 (elevated), and Rank 3 card spatial ordering:

Checklist

• Linked issue in summary
• npm run lint passes locally
• No TypeScript errors (npm run type-check)
• Self-reviewed the diff
• Added/updated tests if applicable

[vercel]

@AdityaM-IITH is attempting to deploy a commit to the PRIYANSHU DOSHI's projects Team on Vercel.

A member of the Team first needs to authorize it.

[github-actions]

Thanks for your first PR on DevTrack! 🎉

A maintainer will review it within 48 hours. While you wait:

• Make sure CI is passing (type-check + lint)
• Double-check the PR description is filled out and the issue is linked
• Feel free to ask questions in Discussions if you need help

[Priyanshu-byte-coder]

Two TypeScript errors blocking CI:

1. src/app/api/goals/route.ts(47,30): error TS7006: Parameter 'goal' implicitly has an 'any' type.
2. src/app/api/user/github-accounts/route.ts(39,37): error TS7006: Parameter 'account' implicitly has an 'any' type.

Add explicit types to both parameters. For context:

• The goal param is being mapped/filtered — add the Goal type that's already defined in that file
• The account param in github-accounts route — type it as the LinkedAccount interface

Fix these type errors and CI will pass.

[Priyanshu-byte-coder]

The leaderboard UI concept is good, but this PR has significant issues:

1. Mock data — fetchLeaderboard() populates with hardcoded mock contributors (AdityaM-IITH, alex_dev, sofia_codes) instead of real API data. This can't be merged as-is — it would show fake data in production.

2. New dependency — lucide-react is added for icons. Use inline SVGs instead to avoid a new dependency.

3. Supabase anon client — the component calls supabase (anon key) directly. With RLS now enabled (PR #313, merged), anon clients have no table access. Use the API route pattern instead.

4. leaderboard/page.tsx conflict — PR #336 also adds a leaderboard page that's going through review.

Please implement the real API integration (there's already an /api/leaderboard endpoint being added in PR #336) and drop the mock data before this can be merged.

[Priyanshu-byte-coder]

The leaderboard feature was already merged via PR #336. This PR conflicts with main because leaderboard/page.tsx and the leaderboard API now exist there.

Before resubmitting:

1. Check what's already in main after rebasing (the full leaderboard with Supabase opt-in, GitHub stats, rate limiting, and TTL cache is already shipped)
2. If your LeaderboardPage.tsx adds something genuinely new that's not in the merged version, keep only that delta
3. Revert the goals/route.ts and github-accounts/route.ts changes if they're unrelated to leaderboard

Closing this PR. If there are improvements to the existing leaderboard, please open a new focused PR.