fix(chart): use range tuples for cumulative spend area shading#33
Merged
ItsThompson merged 2 commits intoJun 10, 2026
Merged
Conversation
- Change surplus/deficit data from single values to [lower, upper] tuples so Recharts renders fill only between actual and ideal lines, not to y=0 - Convert XAxis to type=number with explicit integer ticks to eliminate phantom tick slots from fractional crossover day values - Add custom Tooltip content that filters out non-integer day points and excludes array-valued (range area) entries from display
- Extract tooltipFormatter and tooltipLabelFormatter as named exports so branch logic is directly testable without triggering Recharts events - Add tests covering array-value filtering, currency formatting, integer-day labels, and fractional crossover suppression - Raises global branch coverage above the 85% threshold
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
The cumulative spending chart's red/green area shading fills from the budget-relevant line all the way down to £0 (the x-axis). The shading should only fill the region between the actual spending line and the budget pace line.
Fix
surplusTop/deficitTop) to range tuples (surplus/deficitas[lower, upper]). Recharts detects array values and renders fill only between the two bounds.type="number"with explicit integer ticks to eliminate phantom tick slots from fractional crossover points.formatter/labelFormatterguards on Tooltip to handle array values and fractional-day labels.Verification