Is there an existing issue for this?
What happened?
馃搶 Issue Overview
Currently, the user dashboard displays blank whitespace, dashed borders, or flat-line charts when no data is available (e.g., for a new user). This creates a "broken" or unfinished appearance and fails to guide the user on how to populate these sections.
This issue proposes adding dedicated "Empty State" components with illustrations and call-to-action buttons to improve the user onboarding experience.
馃攳 Steps to Reproduce
- Log in to the application with a new account (or an account with zero data).
- Navigate to the main Dashboard.
- Observe the "Deliverable Status" and "Campaign Status" cards.
- Observe the "Platform Distribution" section.
- Observe the "Earnings" and "Engagement" trend charts.
馃幆 Expected Behavior
When data is missing, the dashboard should display a friendly, context-aware illustration (e.g., a wallet for earnings), show a clear message explaining why the data is missing, provide a "Call to Action" button (e.g., "Create Campaign") to guide the user to the next step.
馃毃 Actual Behavior
Deliverable/Campaign Cards: Show empty white space.
Platform Distribution: Shows a placeholder dashed border.
Trend Charts: Render a flat line at 0 on the X-axis, which takes up vertical space without providing value.
馃摲 Screenshot
馃挕 Suggested Improvements
I have already fixed this on my end by adding related SVG's and headings.
Record
Is there an existing issue for this?
What happened?
馃搶 Issue Overview
Currently, the user dashboard displays blank whitespace, dashed borders, or flat-line charts when no data is available (e.g., for a new user). This creates a "broken" or unfinished appearance and fails to guide the user on how to populate these sections.
This issue proposes adding dedicated "Empty State" components with illustrations and call-to-action buttons to improve the user onboarding experience.
馃攳 Steps to Reproduce
馃幆 Expected Behavior
When data is missing, the dashboard should display a friendly, context-aware illustration (e.g., a wallet for earnings), show a clear message explaining why the data is missing, provide a "Call to Action" button (e.g., "Create Campaign") to guide the user to the next step.
馃毃 Actual Behavior
Deliverable/Campaign Cards: Show empty white space.
Platform Distribution: Shows a placeholder dashed border.
Trend Charts: Render a flat line at 0 on the X-axis, which takes up vertical space without providing value.
馃摲 Screenshot
馃挕 Suggested Improvements
I have already fixed this on my end by adding related SVG's and headings.
Record