Как изменить классовый компонент так чтоб он заработал?

Question

[Daniil]

Есть фича для сайта при нажатие на кнопку она должна отключиться на 60 секунд а по окончание времени снова работать. Не сильно разбираюсь в компонентах сама фича изначально была написано на функциональном компоненте а мне нужно переписать её на классовый компонент .
Вот мой классовый компонент:

import React, {useState , Component} from "react";

class Example extends React.Component {
  constructor() {
    super();
    this.state = { 
     isTimerActive : false,
     setIsTimerActive : false,
     my: "Смс отпрвлено"
    };
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick() {
    this.setIsTimerActive = true;
    setTimeout(()=> {
      this.setIsTimerActive = false;
    } , 60000);
  }

  render() {
    return(
      <button disabled={this.isTimerActive} onClick={this.handleClick}>
      {this.isTimerActive ? {my} : 'Повторно отправить смс'}
      </button>
    );
  }
}
export default Example;

Вот код который работает , но он написан на функциональном компоненте:

import React , {useState} from "react";
const App = () => {
  const [isTimerActive, setIsTimerActive] = useState(false);
  const my = ''
  const handleClick = () => {
    // активируем счетчик
    setIsTimerActive(true);
    setTimeout(() => {
      // сбрасываем
      setIsTimerActive(false);
    }, 10000);
  };

  return (
    <button disabled={isTimerActive} onClick={handleClick}>
      {isTimerActive ? my : 'Повторно отправить смс'}
    </button>
  );
};
export default App;

Answer 1

[0xD34F]

class App extends React.Component {
  state = { 
    isTimerActive: false,
  }

  setTimerActive = isTimerActive => {
    this.setState(() => ({ isTimerActive }));
  }

  onClick = () => {
    this.setTimerActive(true);
    setTimeout(this.setTimerActive, 60000, false);
  }

  render() {
    const { isTimerActive } = this.state;

    return(
      <button disabled={isTimerActive} onClick={this.onClick}>
        {isTimerActive ? 'отправлено' : 'отправить повторно'}
      </button>
    );
  }
}