diff --git a/packages/redux-devtools-slider-monitor/src/SliderMonitor.tsx b/packages/redux-devtools-slider-monitor/src/SliderMonitor.tsx index 5679385e..390c2828 100644 --- a/packages/redux-devtools-slider-monitor/src/SliderMonitor.tsx +++ b/packages/redux-devtools-slider-monitor/src/SliderMonitor.tsx @@ -198,12 +198,6 @@ class SliderMonitor> extends (PureComponent || const aLoop = () => { const replayDiff = Date.now() - currentTimestamp; if (replayDiff >= timestampDiff) { - this.props.dispatch( - jumpToAction( - this.props.stagedActionIds[this.props.currentStateIndex + 1], - ), - ); - if ( this.props.currentStateIndex >= this.props.computedStates.length - 1 @@ -212,14 +206,23 @@ class SliderMonitor> extends (PureComponent || return; } - timestampDiff = this.getLatestTimestampDiff( - this.props.currentStateIndex, - ); - currentTimestamp = Date.now(); + // Update to check for nextActionId and dispatch it + const nextActionId = + this.props.stagedActionIds[this.props.currentStateIndex + 1]; + if (nextActionId !== undefined) { + this.props.dispatch(jumpToAction(nextActionId)); - this.setState({ - timer: requestAnimationFrame(aLoop), - }); + timestampDiff = this.getLatestTimestampDiff( + this.props.currentStateIndex, + ); + currentTimestamp = Date.now(); + + this.setState({ + timer: requestAnimationFrame(aLoop), + }); + } else { + this.pauseReplay(); + } } else { this.setState({ timer: requestAnimationFrame(aLoop),