import { useTimer } from '@gabrielyotoo/react-use-timer';

function App() {
  const [finished, setFinished] = useState(false);

  const { currentTime, isRunning, start, pause } = useTimer(10, {
    onFinish: () => {
      setFinished(true);
    },
    onStart: () => {
      setFinished(false);
    },
  });

  return (
    <>
      {finished ? <p>Finished!</p> : null}
      <div>
        {!isRunning ? (
          <p>Not running! Timer at {currentTime}</p>
        ) : (
          <p>Timer at {currentTime}</p>
        )}
        <button onClick={start}>{!isRunning ? 'Start!' : 'Reset'}</button>
        {isRunning ? <button onClick={pause}>Pause</button> : null}
      </div>
    </>
  );
}