Skip to content

Commit

Permalink
fix(area-bump): Return a new serie reference when color or styles change
Browse files Browse the repository at this point in the history
Consumers of the series object, like the AreaBump chart component itself, might rely on memoization and shallow equality comparisons of incoming props.
Mutating the serie object led to a stuck state e.g. on hover, as described in #1301.

Mind that we cannot just
```
return { ...serie, color: getColor(serie), style: getSerieStyle(serie) };
```
as `getSerieStyle` can depend on on the results of `getColor`. The functions therefore need to be applied sequentially and in this order.

Fixes #1301
  • Loading branch information
LFDM authored and plouc committed Dec 4, 2020
1 parent 98be804 commit 844c311
Showing 1 changed file with 4 additions and 4 deletions.
8 changes: 4 additions & 4 deletions packages/bump/src/area-bump/hooks.js
Original file line number Diff line number Diff line change
Expand Up @@ -160,10 +160,10 @@ export const useAreaBump = ({
const series = useMemo(
() =>
rawSeries.map(serie => {
serie.color = getColor(serie)
serie.style = getSerieStyle(serie)

return serie
const nextSerie = { ...serie }
nextSerie.color = getColor(nextSerie)
nextSerie.style = getSerieStyle(nextSerie)
return nextSerie
}),
[rawSeries, getColor, getSerieStyle]
)
Expand Down

0 comments on commit 844c311

Please sign in to comment.