Skip to content

Chart Clarity Review: PRMergeSuccessRateChart #229

@hcaballero2

Description

@hcaballero2

[UI/UX] Chart Clarity Review: PRMergeSuccessRateChart

Context
The PRMergeSuccessRateChart compares lifetime versus sprint data using a percentage-based Y-axis. The chart includes a custom hover implementation for its "info" icon. We need a developer to review the chart's visual hierarchy, verify the percentage calculations render cleanly, and ensure the custom hover state behaves nicely across different screen sizes.

Acceptance Criteria

  • Review PRMergeSuccessRateChart.jsx.
  • Test the custom onMouseEnter/onMouseLeave info tooltip implementation. Does it clip off the edge of the screen on smaller monitors? Consider if this needs to be refactored into a standard CSS hover class or a reusable Tooltip component to maintain project coding standards.
  • Verify that the Y-axis and chart tooltips format the percentages correctly (e.g., ensuring no long decimal trails like 33.333333%).
  • Check the color contrast between the "Lifetime" (#4F46E5) and "Sprint" (#22C55E) bars.
  • Submit a PR to refactor any confusing UI elements, tooltip behavior, or styling.

Files to Check:

  • src/components/charts/PRMergeSuccessRateChart.jsx

Metadata

Metadata

Assignees

Labels

frontendworking on the react frontend

Type

No fields configured for Task.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions