How should i pass props, I use countdown timer reactjs package-CodePudding

Here I'm using the CountDown timer package here is the package link https://www.npmjs.com/package/react-countdown-circle-timer. When the Timer goes to zero I want to call API, and the timer should repeat again.

import { CountdownCircleTimer } from "react-countdown-circle-timer";
import "./CountDownTimer.css";
const renderTime = ({ remainingTime }) => {
    if (remainingTime === 0) {
        return <div className="timer">Too lale...</div>;
    }

    return (
        <div className="timer">
            <div className="value">{remainingTime}</div>
        </div>
    );
};
const CountDownTimer = () => (
    <>
        <div className="App">
            <div className="timer-wrapper">
                <CountdownCircleTimer
                    isPlaying
                    duration={30}
                    colors={["#FFAD22", "#714DFF", "#5AD4FB", "#A30000"]}
                    colorsTime={[25, 20, 15, 0]}
                    onComplete={() => ({ shouldRepeat: true, delay: 0 })}
                >
                    {renderTime}
                </CountdownCircleTimer>
            </div>
        </div>
    </>
);

export default CountDownTimer;

CodePudding user response：

As per the document, onComplete() should be as follows:

 <CountdownCircleTimer
      isPlaying
      duration={30}
      colors={["#FFAD22", "#714DFF", "#5AD4FB", "#A30000"]}
      colorsTime={[25, 20, 15, 0]}
      onComplete={() => { 
         // your api call
        return { shouldRepeat: true, delay: 0 };
      }}
  >