Neeraj_Frontend_for_Event_Participation_Analysis

[Neeraj-Kondaveeti]

Description

Updated header (new title; “My Cases” → “Upcoming Events”), (new title; " HGN Management System" to "Social and Recreational Management") , added Save as PDF export button, and implemented More to show 30 items with a scrollbar.

---

Related PRS (if any):

No related PRs
It builds on earlier work from PR #3052

---

Main changes explained:

-EventParticipation.jsx – Added lazy html2pdf.js integration; toggles data-exporting on during export.
-Participation.css – Printed rules to show this page, keep colors, avoid page breaks; layout tweaks for tidy PDFs.
-MyCases.jsx / MyCases.css – Renamed section to “Upcoming Events”; implemented More expansion (10 → +30 with scroll); export-safe rendering.
-DropOffTracking.jsx / NoShowInsights.jsx / mockData.jsx / routes.jsx – Made minor adjustments for stable export and routing.

---

How to test:

1. check into current branch
2. do npm install and ... to run this PR locally
3. Clear site data/cache
4. log as any user
5. go to the URL http://localhost:5173/communityportal/reports/participation
6. Verify header text updates and “Upcoming Events” section.
7. Click More → list expands from 10 to +30 with a scrollbar.
8. Click Save as PDF (top right) and verify if it is working properly or not.

Screenshots or videos of changes:

Note:

The mockData is being used to verify the UI as the backend is not yet implemented.

[netlify]

✅ Deploy Preview for highestgoodnetwork-dev ready!

Name	Link
🔨 Latest commit	fe51570
🔍 Latest deploy log	https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/68fc3e5826b0c90008a0e61c
😎 Deploy Preview	https://deploy-preview-4122--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.

[Prem203]

Checked the PR with an admin account. The list renders correctly, more button and save a pdf button works as expected.

Although, in dark mode the UI seems to be stretched out right to the page margin. In dark mode the upcoming events title is not visible due to the background remaining the same and not changing to dark mode.

[aryanrachala54]

I have tested the PR, and everything else is working as expected. The list expands correctly, the PDF export works as expected, and the UI updates appear to be working as intended.

Just one issue in dark mode:

• Some text (like the "Upcoming Events" header) isn’t visible due to contrast issues.

[abhirambj]

Tried out the event participation page. The PDF export and cards work well and the main features are solid. In dark mode, the Upcoming Events heading is hard to read and everything’s a bit packed together. Please update the header color and add a little more spacing to make the UI cleaner. Once those tweaks are in, I’m happy to approve!

[Neeraj-Kondaveeti]

Checked the PR with an admin account. The list renders correctly, more button and save a pdf button works as expected.

Although, in dark mode the UI seems to be stretched out right to the page margin. In dark mode the upcoming events title is not visible due to the background remaining the same and not changing to dark mode.

Hi Prem , Thank You for the review , I will make the suggested changes and get back to you .

[Neeraj-Kondaveeti]

I have tested the PR, and everything else is working as expected. The list expands correctly, the PDF export works as expected, and the UI updates appear to be working as intended.

Just one issue in dark mode:

• Some text (like the "Upcoming Events" header) isn’t visible due to contrast issues.

Hi Aryan, Thank You for the review , I will get back to you after making the requested changes.

[Neeraj-Kondaveeti]

Tried out the event participation page. The PDF export and cards work well and the main features are solid. In dark mode, the Upcoming Events heading is hard to read and everything’s a bit packed together. Please update the header color and add a little more spacing to make the UI cleaner. Once those tweaks are in, I’m happy to approve!

Hi , Thank You for the review. I will get back to you after I make the suggested changes.

[Neeraj-Kondaveeti]

Hi @Prem203 , I have addressed the text color issue in dark mode and for the component stretching in dark mode I made the conscious decision of stretching it so that the entire page is affected in dark mode else only a part of the page goes into dark mode and the rest of the page stays white / normal so to avoid inconsistency in how the page looks I made the page stretch in dark mode. Can you test again and check if the text is now visible in dark mode or not.

Thank You for your time and effort.

[Neeraj-Kondaveeti]

Hi @aryanrachala54 , I have addressed the contrast issues in dark mode . Can you test again and check the changes made.

Thank You for your time and effort.

[Neeraj-Kondaveeti]

Hi @abhirambj , I have addressed the issue of buttons being packed too close and the header color issue as well. Can you please test again and check the changes made.

Thank You for your time and effort.

[akshith312]

Tested PR locally. Logged in as Admin User.
Page loads as expected, More button loads more cards, displays multiple with scroll on the side.
Dark Mode has clear text as well. Able to download it as a pdf file.

[Aswin20010]

Tested the updated participation reports page at /communityportal/reports/participation. Verified that the header text changes are correctly reflected — “My Cases” is now “Upcoming Events”, and “HGN Management System” has been updated to “Social and Recreational Management.”
Confirmed that the “More” button expands the list from 10 to 30 items with a functional scrollbar, and the “Save as PDF” button successfully exports the view.
All features are working as described. Approving this PR.

[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

[one-community]

Thank you all, merging!