Quiero crear un nodo que obtenga una vista previa de los valores anteriores usando react, rete.js y Chart JS.

Pero el cambio de accesorios o la llamada al método de update no actualizan el componente.

¿Cómo puedo arreglar eso?

Código relevante a continuación o enlace de codesandbox con repetitivo

 class ChartController extends Rete.Control { static component = ({ data }) => { console.log("Rerender") return <Line data={data} ></Line> } addValue(value) { this.props.data.datasets[0].data.push({ y: value, x: new Date().getTime() }) this.update() } constructor(key) { super(key) this.render = 'react'; this.component = ChartController.component this.props = { data: { "datasets": [ { "fill": true, "data": [{ "y": 0, "x": 1646927922557 }, { "y": 0, "x": 1646927926815 }, { "y": 1, "x": 1646927927804 }, { "y": 2, "x": 1646927927983 }, { "y": 3, "x": 1646927928133 }, { "y": 4, "x": 1646927928287 }, { "y": 5, "x": 1646927928429 }, { "y": 6, "x": 1646927928580 }, { "y": 7, "x": 1646927928726 }, { "y": 8, "x": 1646927928855 }, { "y": 9, "x": 1646927929022 }, { "y": 10, "x": 1646927929142 }], "backgroundColor": "rgba(255, 99, 132, 0.2)", "borderColor": "rgba(255, 99, 132, 1)", "borderWidth": 1 }], } } } } export class Preview extends Rete.Component { constructor() { super("Preview") } builder(node) { this.node = node this.max_size = 1_000 this.preview = new ChartController('preview') return node .addInput(new Rete.Input('num', "Input", numSocket, false)) .addOutput(new Rete.Output('num', "Output", numSocket, false)) .addControl(this.preview) } worker(_node, inputs, outputs) { const base = inputs['num'] const val = (base.length == 0 || typeof base[0] != 'number') ? 0 : base[0] this.preview.addValue(val) outputs['num'] = val return outputs } }