projectstorm/react-diagrams

Hello guys, hope everyone is doing well.
I am working on a project that uses react-diagrams, but I am stuck at an issue.

So I have a simple functional compontent

import React from "react";
import "./styles.css";
import createEngine, {
  DefaultNodeModel,
  DiagramModel
} from "@projectstorm/react-diagrams";
import { CanvasWidget } from "@projectstorm/react-canvas-core";

export default function App() {
  React.useEffect(() => {
    // Do ajax request
  });

  const node = new DefaultNodeModel({
    name: "Function",
    color: "#44355b"
  });

  const engine = createEngine();
  const model = new DiagramModel();

  model.addAll(node);

  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <CanvasWidget engine={engine} style={{ height: "100%" }} />
    </div>
  );
}

When I use useEffect to do an Ajax request, the canvas is freezed, but it works fine when the useEffect isn't there.

Why is this happening?