Active toast's counter about react-toastify HOT 2 CLOSED

class App extends React.Component {
  state = {
    toastCounter: 0
  };

  increment = () => {
    this.setState(state => ({ toastCounter: state.toastCounter + 1 }));
  };

  decrement = () => {
    this.setState(state => ({ toastCounter: state.toastCounter - 1 }));
  };

  noti = () => {
    toast("Hello", {
      onOpen: this.increment,
      onClose: this.decrement
    });
  };

  render() {
    return (
      <div>
        <h3>Toast Displayed: {this.state.toastCounter}</h3>
        <hr />
        <button onClick={this.noti}>Notify</button>
        <hr />
        <button onClick={() => toast.dismiss()} disabled={this.state.toastCounter === 0}>Dismiss ALL</button>
        <ToastContainer className="xxxx" />
      </div>
    );
  }
}