I was thinking of having a button which calls a drawing component so I can draw on top of the video player component.

const VideoPlayer = ({selectedVideo}) => {
    
    return(
        <div className="App">
       <video key = {selectedVideo} width="950" height="500" controls>
         <source 
         key= {selectedVideo}
         src={selectedVideo} 
         type="video/mp4" />
         </video>
   </div>
    );
};

export default VideoPlayer;

I was thinking of writing something similar to this: I want to draw (using html5 canvas) inside video in react but with the ability to having drawing enabled or disabled with a button press and that it stays within the boundaries of the video player. How do you suggest I go about doing this?