[FEATURE] Dynamic Top Contributors Podium from Live API Data

[Aditya948351]

Resolves #73. Fetches live contributors and renders Gold, Silver, and Bronze podium dynamically with actual GitHub avatars.

[Copilot]

Pull request overview

Replaces the hardcoded top-3 podium on the /contributors page with a client-side fetch from the GitHub contributors API, mapping the top 3 by contributions to Gold/Silver/Bronze cards using real avatar URLs. Adds a loading state and a hardcoded fallback list for API failures.

Changes:

• Adds useState/useEffect client fetch of api.github.com/repos/devpathindcommunity-india/DevPath-Web/contributors, sorted and sliced to top 3.
• Introduces Contributor / TopContributor TypeScript interfaces and a FALLBACK_TOP list used on fetch error.
• Renders a loading spinner, an arrangePodium helper to reorder as [2nd, 1st, 3rd], and uses <img> for avatar_url with initials as a null fallback.

Comments suppressed due to low confidence (1)

src/app/contributors/page.tsx:62

• When the GitHub API responds successfully but with fewer than 3 contributors (e.g., a 200 with an empty array, or only 1–2 entries), topContributors will be set to that short list and the fallback is never used. arrangePodium returns the list unchanged in that case, so the podium will render incomplete (or empty) with no indication to the user. Consider falling back to FALLBACK_TOP (or padding) whenever mappedTop.length < 3, not only in the catch branch.

                const mappedTop = sorted.slice(0, 3).map((c: any, index: number) => ({
                    name: c.login,
                    handle: `@${c.login}`,
                    contributions: c.contributions,
                    rank: index + 1,
                    avatar: c.avatar_url,
                }));

                setTopContributors(mappedTop);

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.