eslint conditional issue

[raulbarriga]

eslint on my codesandbox is giving me this issue:

A custom React Hook that provides a declarative useEventListener. React Hook "useEventListener" is called conditionally. React Hooks must be called in the exact same order in every component render. Did you accidentally call a React Hook after an early return? (react-hooks/rules-of-hooks)eslint

Im using a function for left, right, and escape keypress for a carousel modal like so:

const ESCAPE_KEYS = ["27", "Escape"];
  const ARROWLEFT_KEYS = ["37", "ArrowLeft"];
  const ARROWRIGHT_KEYS = ["39", "ArrowRight"];

 function keypressHandler ({ key }) {
    // e = e || window.event;
    if (ARROWLEFT_KEYS.includes(String(key))) {
      // setCurrent(current === length - 1 ? 0 : current + 1); //left <- show Prev image
      prevSlide();
      console.log("Left key pressed!");
    } else if (ARROWRIGHT_KEYS.includes(String(key))) {
      // right -> show next image
      // setCurrent(current + 1);
      nextSlide();
      console.log("Right key pressed!");
    }

    if (ESCAPE_KEYS.includes(String(key))) {
      onClose();
      console.log("Escape key pressed!");
    }
    // console.log("event: ", e);
  };

But the code still seems to work though so I guess I'm just gonna have to ignore this issue.