Videojs react add custom button component using react hooks

Below is class base react component to add videojs custom buttons. I am trying to add custom buttons
using react hooks, but not getting right solutions.

import React from 'react';
import VideoImageOverlayChild from './VideoImageOverlayChild';
import ReactDOM from 'react-dom';
import videojs from 'video.js';
const vjsComponent = videojs.getComponent('Component');

class VideoImageOverlay extends vjsComponent {
  constructor(player, options) {
    super(player, options);
    console.log(options);
    /* Bind the current class context to the mount method */
    this.mount = this.mount.bind(this);

    /* When player is ready, call method to mount React component */
    player.ready(() => {
      this.mount();
    });

    /* Remove React root when component is destroyed */
    this.on('dispose', () => {
      ReactDOM.unmountComponentAtNode(this.el());
    });
  }

  /**
   * We will render out the React EpisodeList component into the DOM element
   * generated automatically by the VideoJS createEl() method.
   *
   * We fetch that generated element using `this.el()`, a method provided by the
   * vjsComponent class that this class is extending.
   */
  mount() {
    //console.log(this.player_);
    ReactDOM.render(
      <VideoImageOverlayChild
        vjsComponent={this}
        videoTicker={this.options_.videoTicker}
        imgOption={this.options_.logo}
        playerObject={this.player_}
      />,
      this.el()
    );
  }
}

/**
 * Make sure to register the vjsComponent so Video JS knows it exists
 */
vjsComponent.registerComponent('VideoImageOverlay', VideoImageOverlay);
export default VideoImageOverlay;