Nirali hours report individual group

[Nirali164]

Description

Implements # Add ability to run hours reports for individual or groups of people, projects, and teams (Priority High)
This PR introduces a new Volunteer Hours Reporting feature under:
Admin/Owner Login → Reports → Reports
The goal of this feature is to allow admins/owners to generate volunteer hours reports for:
Individual people or groups of people
Teams
Projects
The report supports selecting a custom date range and displays the total logged volunteer hours for the selected period. This functionality is required for nonprofit reporting and volunteer hour tracking requirements.
The implementation includes:
Dynamic report generation by Person, Team, and Project
Date range filtering
Logged hours calculation based on time entries
Sorting and summary totals
Updated report layouts and improved UI structure
Pagination improvements for report detail tables
Dark mode compatibility

Fixes # Priority High - Hours Reporting Enhancement

Main changes explained:

• Create a new Volunteer Hours Report page under the Reports section
• Add support for generating reports by:
  • Person
  • Team
  • Project
• Add custom date range filtering functionality
• Fetch logged volunteer hours using time-entry-based APIs
• Calculate total logged hours dynamically for reports
• Create a new backend API for fetching committed hours by team
• Create a new backend API for fetching committed hours by project
• Integrate committed/logged hours data into reporting workflows
• Modify and improve the existing Reports UI structure
• Fix multiple screen scratching/layout-breaking issues across report pages
• Improve table responsiveness and page layout handling
• Add pagination support for detail tables to prevent UI overflow
• Update report table styling and fixed-width layouts
• Improve dark mode styling compatibility
• Refactor report rendering logic for better maintainability
• Add loading states and refresh functionality for reports
• Improve report page responsiveness and overall user experience
  …

Related PR:
This Frontend PR is related to this Backend PR
OneCommunityGlobal/HGNRest#2199

How to test:
Check out the current branch
Run:
npm install
npm start
Clear browser cache/site data
Log in as an Admin/Owner user
Navigate to:
Dashboard → Reports → Reports
Verify the following:
Show the Volunteers report
and check the report for

Screenshots or videos of changes:

Screen.Recording.2026-05-06.at.9.15.46.PM.mov

[netlify]

✅ Deploy Preview for highestgoodnetwork-dev ready!

Name	Link
🔨 Latest commit	d5e5bcd
🔍 Latest deploy log	https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/6a597714338dbd0009f9daa9
😎 Deploy Preview	https://deploy-preview-5230--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

---

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

[sonarqubecloud]

Quality Gate passed

Issues
1 New issue
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[HemanthNidamanuru]

Hi Nirali,

I tested this PR locally.

The Volunteers report is loading, but I noticed that By Person, By Team, and By Project are showing different hours. Could you please confirm if this is expected?

Also, the table header is not aligned properly in dark mode.

[DeepighaJ]

The dark mode needs improvement including table header,calendars.
The report filters based on By Team , By Person and By Project for filtered dates however couldnt cross check with backend api endpoints.

[kzou55]

Hi Nirali,

I ran and tested the PR and its associated backend locally.

Verified

• Volunteer Reports can be shown or hidden
• Can change the report by report type(project, person, team) and filter by from and to date
• Functionality works in dark mode

Testing

Issues

1. Dark mode needs improvement. The Table Header text is barely visible.

2. Sometimes, the filter by "Report Type" doesn't include results with 0 total hours. Yet in some it does. Is that expected?

   

3. Any reason why the endpoints are using "post" rather than "get". Aren't these just get requests?

   

[sonarqubecloud]

Quality Gate passed

Issues
1 New issue
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[HemanthNidamanuru]

Hi,

I tested this PR locally by navigating to Dashboard → Reports → Reports and opening the Volunteers report.

The report is loading correctly overall. However, the hover behavior on the table headers needs improvement, and the calendar UI could also be improved for better usability in dark mode.