Mani shashank; fix/BM Dashboard Financials Tracking, Cost-prediction by shashankm9 · Pull Request #4193 · OneCommunityGlobal/HighestGoodNetworkApp

shashankm9 · 2025-10-10T03:46:48Z

Description

This PR restores the missing Financials Tracking functionality in the BM Dashboard that was showing "Failed to load projects" error. The expenditure pie charts and cost prediction features are now fully functional with proper authentication and CSS modules implementation.

Related PRS (if any):

This frontend PR is related to the #1797 backend PR.

Main changes explained:

Restore FinancialsTrackingCard component: Fixed missing expenditure project loading with proper httpService authentication
Update ExpenditureChart component: Replaced direct axios calls with httpService for authenticated requests to /api/bm/expenditure/:projectId/pie
Convert CostPredictionPage.css to module.css: Migrated from global CSS to CSS modules following team standards, renamed classes to camelCase
Update WeeklyProjectSummary: Integrated FinancialsTrackingCard component in the Financials Tracking section

How to test:

check into current branch
do npm install and ... to run this PR locally
Clear site data/cache
log as admin user
Navigate to BM Dashboard → Weekly Project Summary(http://localhost:5173/bmdashboard/totalconstructionsummary) → Financials Tracking section → Actual expenditure/Planned expenditure(Pie charts only)
Verify that:

Project dropdown loads without "Failed to load projects" error
Actual Expenditure pie chart displays with Labor/Equipment/Materials breakdown
Planned Expenditure pie chart displays with proper percentages
Cost prediction charts render correctly

Test the standalone cost prediction page at http://localhost:5173/bmdashboard/cost-prediction
Verify functionality works in [dark mode]

Screenshots or videos of changes:

Recording.2025-10-09.215401.mp4

Note:

… charts, and tidy code

netlify · 2025-10-10T03:47:05Z

✅ Deploy Preview for highestgoodnetwork-dev ready!

Name	Link
🔨 Latest commit	`9d6eb93`
🔍 Latest deploy log	https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/699e9f78082431000889311b
😎 Deploy Preview	https://deploy-preview-4193--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

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

Sriamshreddy000 · 2025-11-12T02:11:33Z

Hi Mani Shashank,
Tested this PR along with the related backend PR. The app fails to load due to a duplicate import declaration in routes.jsx, showing the error “Identifier 'RentalChart' has already been declared.”

I’m attaching a screenshot below for reference.

Anusha-Gali

Hi Mani Shashank,

I have reviewed your PR locally and have identified many issues. I have mentioned them here as well as attached screenshots for each.

Duplicate imports is causing the code to not run. Upon commenting them myself i was able to test the code but i suppose this should not be the case
In the light mode and dark mode - In Labor and Time Tracking - In Distribution of Labor Hours pie chart, upon selection any item and clicking on submit, the page reloads and all steps are lost.
In the light mode and dark mode - In Financial Tracking - The pie chart fail to load.
The UI of the titles and subtitles is not visible in Dark Mode.

Issue 1. Duplicate imports is causing the code to not run. Upon commenting them myself i was able to test the code but i suppose this should not be the case

Issue 2: In the light mode and dark mode - In Labor and Time Tracking - In Distribution of Labor Hours pie chart, upon selection any item and clicking on submit, the page reloads and all steps are lost.

4194.mp4

Issue 3: In the light mode and dark mode - In Financial Tracking - The pie chart fail to load.

** Issue 2,3,4: The UI of the titles and subtitles is not visible in Dark Mode.**

Positive Scenario

bhanuanishakkineni

Hello Shashank,
I have reviewed the PR and tested it. While running the frontend app, I encountered errors due to redundant import statements in router.jsx.

After I commented out those import statements in router.jsx and tried to re-run the app, it worked.
In the totalconstructionsummary page, the pie charts - Actual expenditure and Planned Expenditure were displayed and the projects drop down is working fine. Cost prediction charts rendered correctly.
First issue with this is the page is not responsive. In the smaller screens (mobile screen) only pie charts are visible and rest of the charts are going out of the screen and are not visible at all. Second issue is that some text is not visible or readable in dark mode. Change the text color so that it will be visible during dark mode.
In cost-prediction, the planned vs actual costs tracking plot is working fine and is responsive in both light and dark mode.

PR.4193+.1797.testing-1.mp4

SwathiAngadi · 2025-12-11T03:51:00Z

Hi Mani Shashank ,

I reviewed your PR.
There were many duplication error in the route.js file after commenting the necessary lines UI loaded. But couldn't see Pie charts under Financial Tracking section. Got 'Failed to load projects' error. In Dark mode UI is breaking like couldn't see body and title were still black color.
Cost-prediction page is working fine. Able to see all the data in the graph upon selection. And UI is responsive too.

Shravan-neelamsetty

Hi Mani Shashank, I tested this PR locally after fixing the duplicate imports in src/routes.jsx by commenting out lines 149-167. I navigated to /bmdashboard/totalconstructionsummary and tested both the "Labor and Time Tracking" and "Financials Tracking" sections. The Labor and Time Tracking section works properly in light mode with the Distribution of Labor Hours pie chart and Paid Labor Cost bar chart displaying correctly with all filters functioning. The Planned vs Actual Costs Tracking line chart in the Financials Tracking section also renders correctly with Labor Cost and Materials Cost filters working as expected. However, I noticed a dark mode visibility issue: the section titles "Distribution of Labor Hours" and "Paid Labor Cost" are not clearly visible in dark mode, making it difficult to read the headers. The pie charts in the left side of Financials Tracking still show "Failed to load projects" error.

Vikas-8055

Hi Mani Shashank, Tested this PR locally. Labor and Time Tracking section works as expected. Planned vs Actual Costs chart renders correctly. Issues,Financials Tracking pie charts show "Failed to load projects" error.

abhinav-TB · 2026-01-16T19:34:32Z

Hi Mani, I have tested this PR locally and have got the following error

Ganesh112001

I attempted to test PR #4193, which restores the Financials Tracking functionality in the BM Dashboard by fixing the "Failed to load projects" error and implementing expenditure pie charts. After checking out both the frontend branch (fix/bm-expenditure-charts) and backend branch (fix/bm-expenditure-api), I encountered build errors that prevented the frontend dev server from starting. The build fails with "Transform failed with 13 errors" due to duplicate identifier declarations in src/routes.jsx, where symbols RentalChart, CreateNewTeam, CPProtectedRoute, CPLogin, CPDashboard, and EventParticipation are imported or declared multiple times on lines 149, 150, 152, 155, 156, and 165. These duplicate declarations cause compilation errors that block the application from running. The code issues need to be resolved before testing can proceed.

maithili20 · 2026-02-06T23:16:28Z

Hi @shashankm9
Reviewed your PR and tested it in both light and dark modes.
There is an issue of duplicate imports. fixed that locally and reviewed.

Cost Prediction: Working correctly in both modes (video review attached).

Untitled.mp4

Total Construction Summary: Not working—shows “Failed to load projects” (screenshots attached).
Dark mode UI: Some headings/text are not visible due to contrast issues.

- Created FinancialsTrackingCard component with project dropdown - Created ExpenditureChart component with Actual/Planned pie charts - Added mock data from MongoDB expenditurePie collection - Implemented dark mode support and responsive design - Fixed legend overflow and dropdown visibility issues - Fixed Cost Prediction chart line connectivity with connectNulls prop

…ed WeeklyProjectSummaryContent function

Anusha-Gali

Hi Mani Shashank,

I have re-reviewed your PR locally and it works as per requirement and both the charts load.

…ture-charts

sonarqubecloud · 2026-02-25T07:07:35Z

Quality Gate passed

Issues
15 New issues
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

BM Dashboard: restore Financials Tracking (auth via httpService), fix…

9a9a33c

… charts, and tidy code

shashankm9 changed the title ~~Mani shashank; BM Dashboard: fix Financials Tracking, Cost-prediction~~ Mani shashank; fix/BM Dashboard Financials Tracking, Cost-prediction Oct 10, 2025

shashankm9 mentioned this pull request Oct 10, 2025

Mani shashank : add BM expenditure API routes for dashboard charts OneCommunityGlobal/HGNRest#1797

Open

Merge branch 'development' into fix/bm-expenditure-charts

4bbf2a5

one-community added the High Priority - Please Review First This is an important PR we'd like to get merged as soon as possible label Nov 5, 2025

Anusha-Gali requested changes Nov 14, 2025

View reviewed changes

bhanuanishakkineni requested changes Dec 3, 2025

View reviewed changes

Shravan-neelamsetty reviewed Jan 13, 2026

View reviewed changes

Vikas-8055 reviewed Jan 16, 2026

View reviewed changes

Ganesh112001 requested changes Jan 24, 2026

View reviewed changes

shashankm9 added 2 commits February 8, 2026 23:17

Remove duplicate imports in routes

9bca7ea

shashankm9 force-pushed the fix/bm-expenditure-charts branch from 4dcb691 to 9bca7ea Compare February 9, 2026 07:32

shashankm9 added 3 commits February 9, 2026 22:35

fix: resolve merge conflicts in WeeklyProjectSummary - remove misplac…

63b282e

…ed WeeklyProjectSummaryContent function

Fix prettier formatting - add trailing newline

6908806

Fix dark mode text visibility and increase font sizes in cost charts

828a62c

OneCommunityGlobal deleted a comment from sonarqubecloud bot Feb 12, 2026

Deduplicate chart styles and markers

9ac68ec

Anusha-Gali previously approved these changes Feb 13, 2026

View reviewed changes

Merge remote-tracking branch 'origin/development' into fix/bm-expendi…

9d6eb93

…ture-charts

shashankm9 dismissed Anusha-Gali’s stale review via 9d6eb93 February 25, 2026 07:06

Uh oh!

Comments

Conversation

shashankm9 commented Oct 10, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Related PRS (if any):

Main changes explained:

How to test:

Screenshots or videos of changes:

Uh oh!

netlify bot commented Oct 10, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for highestgoodnetwork-dev ready!

Uh oh!

Sriamshreddy000 commented Nov 12, 2025

Uh oh!

Anusha-Gali left a comment

Choose a reason for hiding this comment

Uh oh!

bhanuanishakkineni left a comment

Choose a reason for hiding this comment

Uh oh!

SwathiAngadi commented Dec 11, 2025

Uh oh!

Shravan-neelamsetty left a comment

Choose a reason for hiding this comment

Uh oh!

Vikas-8055 left a comment

Choose a reason for hiding this comment

Uh oh!

abhinav-TB commented Jan 16, 2026

Uh oh!

Ganesh112001 left a comment

Choose a reason for hiding this comment

Uh oh!

maithili20 commented Feb 6, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Anusha-Gali left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

sonarqubecloud bot commented Feb 25, 2026

Quality Gate passed

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

11 participants

shashankm9 commented Oct 10, 2025 •

edited

Loading

netlify bot commented Oct 10, 2025 •

edited

Loading

maithili20 commented Feb 6, 2026 •

edited

Loading

Anusha-Gali left a comment •

edited

Loading