Brush as controlled component never updates on change of startIndex or endIndex props

[brendan-limpide]

• I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

Steps to reproduce

1. Add Brush component to default LineChart
2. Add state for startIndex and endIndex
3. Pass startIndex and endIndex as props to Brush (making it a controlled component)
4. Add event handler to update state on change
5. Create number inputs to update startIndex and endIndex in state as well

What is expected?

It is expected that when changing the number input values, that both brush and chart will update to display according values.

What is actually happening?

While changing the brush correctly updates state and controlled number inputs, changing number inputs does not update Brush even though it correctly updates state.

Environment	Info
Recharts	v2.0.3
React	16.10.2
System	macOS Catalina 10.15.7
Browser	Firefox Developer Edition 85.0b8

---

There is a closed but never truly solved issue here, I have tried all solutions mentioned in the comments with no luck on latest version.

[jchen463]

I am on v2.0.6 and also seeing the same issue. After the initial set of the startIndex/endIndex, the brush does not update on any changes after.

[brendan-limpide]

A workaround for this is to force the chart to re-render on change of whatever inputs or controller is being used. To do this you can pass a random number value to the Chart component (LineChart in my case) as a key prop.

 <LineChart
   key={chartKey} // change this value when you want the chart to change
   data={prices}
   onClick={handleClick}
 >

[jchen463]

Thanks, I was making a new copy of the data, but seems like a better idea

[huy23121994]

A workaround for this is to force the chart to re-render on change of whatever inputs or controller is being used. To do this you can pass a random number value to the Chart component (LineChart in my case) as a key prop.

 <LineChart
   key={chartKey} // change this value when you want the chart to change
   data={prices}
   onClick={handleClick}
 >

Wow, thanks. It work for me

[00xSam]

Hi guys, any update for this enhancement without re-rendering the graph?

[ckifer]

No, though it's probably relatively easy to do if someone wants to contribute the fix

[ckifer]

Added reproduction to the storybook in #4032

Should make it easier to solve. Once that story works correctly we'll be good

[ckifer]

found the fix, will take a bit to get out

[ckifer]

#4034

[ckifer]

Fixed in above PR, will be out in next minor