Optimize SetTooltipEntrySettings to break infinite rendering loop#6616
Optimize SetTooltipEntrySettings to break infinite rendering loop#6616
Conversation
WalkthroughThis PR introduces a tooltip settings replacement mechanism to prevent infinite re-renders. The system now tracks previous tooltip configurations and replaces existing entries when settings change, rather than continuously adding new ones. A new test validates the fix prevents infinite loops. Changes
Sequence DiagramsequenceDiagram
participant Render as Component Render
participant Layout as Layout Effect
participant Store as Redux Store
participant Ref as prevSettingsRef
Note over Render,Ref: Previous Flow (Infinite Loop)
Render->>Layout: Re-render with new settings
Layout->>Store: Dispatch addTooltipEntrySettings
Store->>Render: Update state (re-render triggered)
Render->>Layout: Re-render with new settings
Layout->>Store: Dispatch addTooltipEntrySettings again
Note over Layout,Store: ⚠️ Infinite cycle
rect rgb(240, 250, 240)
Note over Render,Ref: New Flow (Fixed)
Render->>Layout: Re-render with new settings
Layout->>Ref: Read prevSettingsRef
alt First Render
Layout->>Store: Dispatch addTooltipEntrySettings
else Subsequent Render with Different Settings
Layout->>Store: Dispatch replaceTooltipEntrySettings {prev, next}
else Settings Unchanged
Note over Layout: No dispatch
end
Ref->>Ref: Update prevSettingsRef
Layout->>Store: Update succeeded ✓
Render->>Render: Prevent re-triggering
end
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Areas requiring extra attention:
Suggested labels
Suggested reviewers
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (4)
🧰 Additional context used📓 Path-based instructions (1)src/**/*.{js,jsx,ts,tsx}📄 CodeRabbit inference engine (AGENTS.md)
Files:
🧠 Learnings (4)📚 Learning: 2025-10-25T07:35:46.188ZApplied to files:
📚 Learning: 2025-10-25T07:35:46.188ZApplied to files:
📚 Learning: 2025-10-25T07:35:46.188ZApplied to files:
📚 Learning: 2025-10-25T07:36:02.229ZApplied to files:
🧬 Code graph analysis (3)src/cartesian/Line.tsx (1)
test/hooks/useActiveTooltipDataPoints.spec.tsx (5)
src/state/SetTooltipEntrySettings.tsx (1)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
🔇 Additional comments (5)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #6616 +/- ##
=======================================
Coverage 94.15% 94.16%
=======================================
Files 493 493
Lines 41081 41105 +24
Branches 4773 4780 +7
=======================================
+ Hits 38681 38705 +24
Misses 2395 2395
Partials 5 5 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
Bundle ReportChanges will increase total bundle size by 2.87kB (0.11%) ⬆️. This is within the configured threshold ✅ Detailed changes
Affected Assets, Files, and Routes:view changes for bundle: recharts/bundle-umdAssets Changed:
view changes for bundle: recharts/bundle-cjsAssets Changed:
view changes for bundle: recharts/bundle-es6Assets Changed:
|
## Description We had two visual diff tests fail: https://www.chromatic.com/build?appId=63da8268a0da9970db6992aa&number=3175 The first one was trivial: the default was declared after the explicit prop and was overwriting it. Second was more complicated. I made a mistake in #6616 in the comparator logic: it was looking up a tooltip settings by reference, which it could never find because it had created a new reference in the same reducer, so the original dispatch lost access to it. This means that the tooltip state stopped updating. Which means yes it fixed the infinite loop but it also broke initializing the tooltip position. I fixed it so that it's still memoized but updating properly. ## Related Issue #6613 ## Types of changes - [x] Bug fix (non-breaking change which fixes an issue) - [ ] New feature (non-breaking change which adds functionality) - [ ] Breaking change (fix or feature that would cause existing functionality to change) ## Checklist: - [ ] My change requires a change to the documentation. - [ ] I have updated the documentation accordingly. - [x] I have added tests to cover my changes. - [x] I have added a storybook story or VR test, or extended an existing story or VR test to show my changes <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Restructured tooltip configuration logic across chart components (Area, Bar, Funnel, Line, Scatter, Sankey, Sunburst, Treemap, Pie, Radar, and RadialBar). * Updated internal tooltip state handling for improved consistency. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
Description
Specifying
activeDotas a new object every render is not best practice but we can still do this little thing to break this particular render loop.Related Issue
Fixes #6613
Types of changes
Checklist:
Summary by CodeRabbit
Bug Fixes
Tests