Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Rishitha phase3 visualizations for no show rate reports #3156

Open
wants to merge 5 commits into
base: development
Choose a base branch
from

Conversation

RishithaMamidala
Copy link
Contributor

@RishithaMamidala RishithaMamidala commented Feb 12, 2025

Description

(PRIORITY MEDIUM) Yash :Phase 3 - Develop Front-End Visualizations for No-Show Rate Reports (WIP Rishitha Mamidala)
URL : /communityportal/reports/participation
Details:
Design demographic breakdown charts for no-show rates.
Create comparison visuals to identify trends across event types and locations.

image

Related PRS (if any):

This frontend PR is related to the https://github.com/OneCommunityGlobal/HGNRest/pull/1227 backend PR.
To test this frontend PR you need to checkout the https://github.com/OneCommunityGlobal/HGNRest/pull/1227 backendPR.

Main changes explained:

  • Create src/actions/communityPortal/NoShowVizActions.js for no show visual actions
  • Create src/components/CommunityPortal/Attendence/NoshowViz.css for styling
  • Create src/components/CommunityPortal/Attendence/NoshowViz.jsx for no show visual rendering

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 admin user
  5. Go to http://localhost:3000/communityportal/reports/participation
  6. verify all the charts are rendered correctly

Note:

Be sure to checkout backend PR 1227
Run " npm run build " in backend PR [Orelse the PR will not work]

The database is not yet setup for this, So, charts are rendered based on mock data in the backend file mockattendencedata.jsx

Screenshots or videos of changes:

video1692588005.mp4

Copy link

netlify bot commented Feb 12, 2025

Deploy Preview for highestgoodnetwork-dev ready!

Name Link
🔨 Latest commit 9de82c0
🔍 Latest deploy log https://app.netlify.com/sites/highestgoodnetwork-dev/deploys/67afca9425f78000088f2b35
😎 Deploy Preview https://deploy-preview-3156--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 site configuration.

@one-community 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 Feb 13, 2025
Copy link

@AurHubertMax AurHubertMax left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Followed instructions, graphs function as expected, animations are smooth as well. However, dark mode is not reflected in the page.
Summary of conditions tested:

  • Checked graph UI, animation, and hovers in light mode
  • Checked graph UI, animation, and hovers in dark mode
  • Checked animations and displays in different screen sizes
2-Click.Screen.Recorder-20250214-210424.891.mp4
2-Click.Screen.Recorder-20250214-210828.822.mp4

Copy link

@Akshay-Jayaram Akshay-Jayaram left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This PR works correctly and is responsive. Graphs function as expected, animations are smooth, and the UI adapts well to different screen sizes.

Screen.Recording.2025-02-15.at.12.52.17.PM.mov

Copy link

@SunilKotte SunilKotte left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

PR #3156 is working as expected
check into current branch
do npm install and ... to run this PR locally
Clear site data/cache
log as admin user
Go to http://localhost:3000/communityportal/reports/participation
verify all the charts are rendered correctly

PR#3156+#1227

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
High Priority - Please Review First This is an important PR we'd like to get merged as soon as possible
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants