[FEAT] Add reusable empty states to dashboard widgets #2646

[desireddymohithreddy0925]

Problem Statement

Several dashboard widgets previously displayed blank sections, empty tables, or minimal placeholder text when no data was available. This created an inconsistent user experience and offered no clear next steps.

Proposed Solution

This PR addresses issue #2646 by enhancing the shared EmptyState component and implementing it across all relevant dashboard widgets to provide consistent, actionable guidance when data is unavailable.

Changes Made

• Enhanced EmptyState Component: Modified src/components/EmptyState.tsx to support interactive buttons via an actionOnClick prop and React.ReactNode icons.
• Goals Widget (GoalTracker.tsx): Updated the existing empty state to match the new standard ("No goals created yet" -> "Create Goal" action).
• Repositories Widget (TopRepos.tsx): Replaced the manual placeholder UI with the new EmptyState component ("No repositories found" -> "Refresh Data" action via fetchRepos).
• PR Analytics Widget (PRBreakdownChart.tsx): Replaced simple paragraph text with the EmptyState component ("No pull requests available" -> "View GitHub Profile" action).
• Leaderboard (src/app/leaderboard/page.tsx): Implemented a fallback empty state ("No leaderboard data available" -> "Sync Dashboard" action) when data fails to load.

Impact

These changes ensure a premium and consistent design language across the dashboard, reducing user confusion and providing clear, actionable next steps when encountering empty data states.

[github-actions]

GSSoC Label Checklist 🏷️

@Umbrella-io — please apply the appropriate labels before merging:

Difficulty (pick one):

• level:beginner — 20 pts
• level:intermediate — 35 pts
• level:advanced — 55 pts
• level:critical — 80 pts

Quality (optional):

• quality:clean — ×1.2 multiplier
• quality:exceptional — ×1.5 multiplier

Validation (required to score):

• gssoc:approved — counts for points
• gssoc:invalid / gssoc:spam / gssoc:ai-slop — does not score

Type labels (type:*) are auto-detected from files and title. Review and adjust if needed.
Points formula: (difficulty × quality_multiplier) + type_bonus

[Priyanshu-byte-coder]

Thanks for contributing! We are currently in a code cleanup sprint and not accepting new features. Please see: #2651

This PR will be revisited once the sprint ends. In the meantime, tests, refactors, bug fixes, and documentation are welcome.

[Priyanshu-byte-coder]

New UI/feature PRs are on hold during the code quality sprint — see discussion #2651. PRs for tests, refactoring, bug fixes, docs, and performance are welcome.

[Priyanshu-byte-coder]

On hold — new features are not being merged during the code quality sprint. See discussion #2651.

[Priyanshu-byte-coder]

New feature/UI PRs are on hold during the code-quality sprint — see discussion #2651. We'll revisit after the sprint; tests, refactors, and bug-fix PRs are the priority right now.

[Priyanshu-byte-coder]

Two problems: EmptyState (py-20 + 6xl icon ≈ 400px tall) is placed inside the PR chart's h-[200px] container, so it overflows its card; and TopRepos' CTA changed from 'Create Repository' (useful for zero-repo users) to 'Refresh Data' (refreshing won't help them). Please add a compact variant of EmptyState for tight containers and keep the create-repo action.

[Priyanshu-byte-coder]

This is the version of the empty-state work I want to keep — it actually extends the shared EmptyState component (adds actionOnClick + ReactNode icon) and uses the new capability for a real refresh action (actionOnClick={fetchRepos}), which is the point of issue #2646. It just needs a rebase: the branch now conflicts against main (PRMetrics/GoalTracker moved underneath it after recent merges). Please rebase on latest main, resolve, and confirm the widgets still render their empty states, then I'll merge. (Your #3156 covers the same ground with less — I've closed it in favor of this one.)

[desireddymohithreddy0925]

@Umbrella-io team I've already starred the repo but still showing require star to contribute
kindly resolve the problem with the bot