React-graph-vis не перерисовывается при изменении состояния (с использованием хуков)

Я пытаюсь обновить свой инструмент визуализации графиков (переход от компонентов на основе классов к функциональным компонентам) и столкнулся с проблемой.

Когда я пытаюсь добавить ребро к графу, компонент не перерисовывается. Я пробовал обновлять состояние разными способами и даже пытался использовать хук useRef, но безуспешно. У меня нет идей. Кто-нибудь знает, как это решить?

Мой код:

function App() {
const [state, setState] = useState({
    counter: 5,
    graph: {
        nodes: [
            { id: 1, label: "Node 1", color: "#e04141" },
            { id: 2, label: "Node 2", color: "#e09c41" },
            { id: 3, label: "Node 3", color: "#e0df41" },
            { id: 4, label: "Node 4", color: "#7be041" },
            { id: 5, label: "Node 5", color: "#41e0c9" }
        ],
        edges: [
            { from: 1, to: 2 },
            { from: 1, to: 3 },
            { from: 2, to: 4 },
            { from: 2, to: 5 }
        ]
    },
    events: {
    }
})

const stateRef = useRef(state);
const { graph, events } = stateRef.current;

return (
    <div>
        <Button
            onClick={() => {
                const temp = {...state};
                temp.graph.edges.push({from: 4, to: 5});
                console.log(graph);
                setState(temp);
            }}
        >
            Add edge
        </Button>

        <Graph graph={graph} options={options} events={events} style={{ height: "640px" }} />
    </div>
);

Когда я нажимаю кнопку "Добавить ребро", компонент графика остается прежним. Однако, когда я смотрю на состояние, преимущество есть.

Большое спасибо!