Chart type scatter3d make onClick loop when calling history.push inside it

Using Plot inside a Router with type "scatter3d" and trying to use history inside onClick (only if it doesn't unmount the Plot Component) make onClick loop after a first click.

Minimal example:

import Plot from "react-plotly.js";
import { BrowserRouter, Route, useHistory } from "react-router-dom";

function Chart3D() {
    const history = useHistory();

    return (
        <Plot
            onClick={() => {
                console.log("This will be printed a lot");
                history.push("/");
            }}
            data={[
                {
                    x: [1],
                    y: [1],
                    z: [1],
                    type: "scatter3d",
                },
            ]}
        />
    );
}

export default function App() {
    return (
        <BrowserRouter>
            <Route path="/" component={Chart3D} />
        </BrowserRouter>
    );
}

Bắt đầu bằng cách tái hiện ví dụ tối thiểu với react-plotly.js, BrowserRouter, useHistory, một scatter3d Plot và history.push trong onClick. Truy tìm lý do handler được kích hoạt lặp lại sau lần nhấp đầu tiên mà không unmount Plot component. Hoàn tất khi callback chạy một lần cho mỗi lần nhấp và việc điều hướng vẫn hoạt động.