document.getElementById in react using fabric js

How I can change the JavaScript code into React?

document.getElementById('text-color').onchange = function() {
  canvas.getActiveObject().setFill(this.value);
  canvas.renderAll();
};

Note that I am using Fabric.js library. Here is my code:

export default function App() {

  const { editor, onReady } = useFabricJSEditor();

  onAddCircle = () => {
    editor.addCircle();
  };

  const onAddRectangle = () => {
    editor.addRectangle();
  };


  function insertText() {
    editor.canvas.add(new fabric.IText('Tap and Type', {
      left: 40,
      top:   100,
      fontFamily: 'comic sans ms',
      fill: 'red',
      fontSize: 28,

    }));
  }


  //just added this in
  return (
    <div className="App">
      <Navbar />

      <div className="bg-light border-top p-4 mb-3">
        <h1 className="display-5">Customize Your Shirt</h1>
      </div>
    </div>

source: https://codepen.io/psbolden/pen/NbLJbV