I want to create a node that previews previous values using react, rete.js, and Chart JS.

But change of props or call to update method is not refreshing the component.

How can I fix that?

Relevant code below or codesandbox link with boilerplate

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
    }
}