Tip Calculator App built with React

This was the first time I experimented with css keyframe animations. I did not know that they overrides css transform properties. I believe that it is better css practice to use transform to make smaller positioning tweaks with absolute position instead of calculating with em values.

.button {
  ...
  position: absolute;
  right: calc(50% - 1.125em);
  bottom: -1.125em;
  ...
}

Set a two second timer before the button can be pressed again to generate a new piece of advice. This is because the API only takes a request only once every one and a half seconds or so. I am sure that this piece of spaghetti timeout function can be cleaned up somehow.

const handleClick = (e) => {
  console.log(`${e.type} at ${e.timeStamp}`);
  setAdviceCounter((prevState) => {
    return prevState + 1;
  });
  setRenderButton((prevState) => {
    return !prevState;
  });
  setTimeout(() => {
    setRenderButton((prevState) => {
      return !prevState;
    });
  }, 2000);
};