How to use renderArrowPrev in React Responsive Carousel to implement next and previous functionality?

I am using https://www.npmjs.com/package/react-responsive-carousel I am able to render desired image using renderArrowPrev and renderArrowNext. but I am not able add functionality to it.

    const Swiper = () => {
      const [hasNext, setHasNext] = React.useState(true);
      const [hasPrev, setHasPrev] = React.useState(true);
      const [labelPrev] = React.useState("PREVIOUS");
      const [labelNext] = React.useState("NEXT");

      const clickHandler = () => {
        console.log("clickHandlerCalled");
      };

      return (
        <Carousel
           renderArrowPrev={(clickHandler, hasPrev, labelPrev) => (
            <img
              style={{ height: "30px", width: "30px" }}
              src={`assets/img/previous.svg`}
            />
          )}
          renderArrowNext={(clickHandler, hasNext, labelNext) => (
            <img
              style={{ height: "30px", width: "30px" }}
              src={`assets/img/next.svg`}
           />
         )}
         onChange={onChange}
         renderThumbs={() => null}
        >
          {getSlides()}
        </Carousel>
      );
    };

Even after passing first parameter to renderArrowNext, clickHandler is not getting called.