Slider not keep on moving with onProgress method in react native - react-native

Question

I am playing some audio files in react native. For progress of the audio file (Duration), I am showing slider for status of the audio file and for forward and reverse the duration.
But, According to audio duration, It is not keep on moving the position (like timer).
https://www.npmjs.com/package/react-native-slider
getInfo = async () => {
try {
const info = await SoundPlayer.getInfo();
// console.log('getInfo', info); // {duration: 12.416, currentTime: 7.691}
const currentTime = get(info, 'currentTime');
this.setState({ currentDuration: currentTime });
} catch (e) {
console.log('There is no song playing', e);
}
}
getProgress = (e) => {
console.log('getProgress calling');
this.getInfo();
this.setState({
currentTime: this.state.currentDuration,
});
}
<Slider
maximumValue={parseFloat(totalLength)}
minimumTrackTintColor="color"
maximumTractTintColor="color"
step={1}
value={currentTime}
onSlidingComplete={value => this.onValueChange(value)}
style={styles.slider}
thumbTintColor="red"
trackLength={parseFloat(totalLength)}
// onSlidingStart={() => this.setState({ paused: true })}
currentPosition={currentTime}
onProgress={e => this.getProgress(e)}
/>
It has to move slider value automatically according to audio duration
Any suggestions?

Answer 1

You'll need a counter to update the progress bar each second
timer = null;
durationCounter = () => {
this.timer = setInterval(async () => {
const info = await SoundPlayer.getInfo();
this.setState({
currentTime: info.currentTime
});
}, 1000);
};
componentDidMount = () => {
SoundPlayer.onFinishedLoading(async success => {
this.durationCounter();
});
}
componentWillMount = () => {
this.timer && clearInterval(this.timer);
};