Aquí está mi código:

 useEffect(() => { playerRef.current.seekTo(convertedflat[currentTimeIndex], 'seconds'); }); return ( <> <main> <div className={style.main_container}> <NavBar /> <div className={style.heronext}> <div className={style.hero_container}> <ReactPlayer ref={playerRef} playing controls={true} url={`videos/${episList[currentEpisodeIndex]}.mkv`} width="90%" height="55rem" /> </div> <button className={style.next} onClick={() => { setCurrentTimeIndex((prevTimeIndex) => prevTimeIndex + 1) % convertedflat.length; setcurrentEpisodeIndex((prevTimeIndex) => prevTimeIndex + 1) % convertedflat.length; console.log(currentTimeIndex); console.log(currentEpisodeIndex); }} > Next </button>

básicamente, cuando hace clic en el siguiente botón, se mueve a la siguiente marca de tiempo hasta que finaliza la matriz. pero quiero que comience de nuevo cuando finalice la lista de matrices. Actualmente, cuando finaliza la navegación de la matriz, muestra un error.

Usé % de longitud pero no funciona. Aquí está el mensaje de error cuando la lista está terminada:

TypeError: no se pudo establecer la propiedad 'currentTime' en 'HTMLMediaElement': el valor doble proporcionado no es finito.