Skip to content

Roshini/volunteer hours distribution chart visualization fix#4913

Open
roshini1212 wants to merge 3 commits intodevelopmentfrom
roshini/volunteer-hours-distribution-chart-visualization-fix
Open

Roshini/volunteer hours distribution chart visualization fix#4913
roshini1212 wants to merge 3 commits intodevelopmentfrom
roshini/volunteer-hours-distribution-chart-visualization-fix

Conversation

@roshini1212
Copy link

Description

Fixes Yagna PRIORITY HIGH: Volunteer Hours Distribution Chart Shows Incorrect Totals and Misleading Visualization

Summary: Redesigned pie chart to show volunteer counts per hour range (not misleading hour values). Fixed center total, 40+/50+ buckets, tooltips, and percentage labels.

Main changes explained:

  • VolunteerHoursDistribution.jsx: formatRangeLabel(), HoursWorkList w/ counts, userData w/ percentages
  • HoursWorkedPieChart.jsx: Center = totalHoursData.current (Leaderboard), tooltipType="hoursDistribution"
  • NumbersVolunteerWorked.jsx: "X volunteers (Y%) logged Z+ hours..."
  • CustomTooltip.jsx: Volunteers + % display
  • Tests: Full coverage + PropTypes

How to test:

  1. git checkout roshini/volunteer-hours-distribution-chart-visualization-fix in frontend
  2. Run npm run start:local
  3. Owner login → Reports → Total Org Summary
  4. Verify: volunteer counts, Leaderboard total, 40-49→50+, hover tooltip
  5. 6pm test

Screenshots:

BEFORE:
Before

Screen.Recording.2026-02-26.at.15.12.04.mov

AFTER:
After

After.mov

RoshiniSeelamsetty added 2 commits February 26, 2026 14:02
Changes:
- Volunteer counts + % slices/legend
- Center: Leaderboard total hours ✅
- Tooltips: 'Volunteers X, % Y'
- Buckets: 40-49 → 50+
- Tests: 100% coverage + PropTypes
- UX: formatRangeLabel(), guards
@netlify
Copy link

netlify bot commented Feb 27, 2026

Deploy Preview for highestgoodnetwork-dev ready!

Name Link
🔨 Latest commit 1490935
🔍 Latest deploy log https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/69a222fcb9ac1600082be05f
😎 Deploy Preview https://deploy-preview-4913--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@sonarqubecloud
Copy link

Quality Gate Failed Quality Gate failed

Failed conditions
6.7% Duplication on New Code (required ≤ 3%)

See analysis details on SonarQube Cloud

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.

1 participant