Skip to content

SaiSandeep Fixing x-axis position and tick increments - #5451

Open
saisandeepkoritala wants to merge 1 commit into
developmentfrom
saisandeep_fix_x_axis_position
Open

SaiSandeep Fixing x-axis position and tick increments#5451
saisandeepkoritala wants to merge 1 commit into
developmentfrom
saisandeep_fix_x_axis_position

Conversation

@saisandeepkoritala

@saisandeepkoritala saisandeepkoritala commented Aug 18, 2026

Copy link
Copy Markdown
Contributor

Description

Fixed rendering issues on the x-axis of the Volunteer Trends line chart where ticks were overlapping, out of order, or cluttered when displaying weekly data. Configured the x-axis to render numeric indices cleanly in fixed increments (e.g., 0, 2, 4, 6, 8, ... 32) and ensured type safety between numeric week indexes and Recharts data expectations.
Screenshot 2026-08-18 023212
Screenshot 2026-08-18 011303

Fixes # (x-axis overlapping and tick spacing in Volunteer Trends chart)

Main changes explained:

  • Updated <XAxis> in VolunteerTrendsLineChart to use type="number", fixed domain, and clean step ticks.
  • Updated formatChartData to ensure numeric week values are safely passed as numbers rather than conflicting strings.
  • Added array guard clauses and non-zero chartSize initial state fallbacks to prevent empty/null render crashes.

How to test:

  1. Check into branch saisandeep_fix_x_axis_position
  2. Run npm install and npm start to run this PR locally
  3. Clear site data/cache
  4. Log in as an admin or volunteer user
  5. Navigate to http://localhost:5173/totalorgsummary
  6. Verify that the x-axis displays week labels cleanly in step increments (0, 2, 4, 6, 8...) without overlapping
  7. Toggle dark mode and verify that axis tick labels remain readable

Screenshots or videos of changes:

Screenshot 2026-08-18 020251

@netlify

netlify Bot commented Aug 18, 2026

Copy link
Copy Markdown

Deploy Preview for highestgoodnetwork-dev ready!

Name Link
🔨 Latest commit 6a0d64d
🔍 Latest deploy log https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/6a84085947a4050008dc51a7
😎 Deploy Preview https://deploy-preview-5451--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile
Toggle QR Code...

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

Copy link
Copy Markdown

@saisandeepkoritala saisandeepkoritala changed the title Fix x-axis position and tick increments SaiSandeep Fix x-axis position and tick increments Aug 18, 2026
@saisandeepkoritala saisandeepkoritala changed the title SaiSandeep Fix x-axis position and tick increments SaiSandeep Fixing x-axis position and tick increments Aug 18, 2026
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