diff --git a/ui/src/clockface/components/wizard/ProgressBar.tsx b/ui/src/clockface/components/wizard/ProgressBar.tsx index 4e6ef34cff..e4e33d130b 100644 --- a/ui/src/clockface/components/wizard/ProgressBar.tsx +++ b/ui/src/clockface/components/wizard/ProgressBar.tsx @@ -30,11 +30,10 @@ class ProgressBar extends PureComponent { const {stepStatuses, stepTitles, currentStepIndex} = this.props const lastIndex = stepStatuses.length - 1 - const lastEleIndex = stepStatuses.length - 2 const progressBar: JSX.Element[] = stepStatuses.reduce( (acc, stepStatus, i) => { - if (i === 0 || i === lastIndex) { + if (i === 0) { return [...acc] } @@ -64,7 +63,7 @@ class ProgressBar extends PureComponent { ) - if (i === lastEleIndex) { + if (i === lastIndex) { return [...acc, stepEle] } @@ -74,7 +73,7 @@ class ProgressBar extends PureComponent { if (i === currentStepIndex && stepStatus !== StepStatus.Error) { connectorStatus = ConnectorState.Some } - if (i === lastEleIndex || stepStatus === StepStatus.Complete) { + if (i === lastIndex || stepStatus === StepStatus.Complete) { connectorStatus = ConnectorState.Full } const connectorEle = ( diff --git a/ui/src/onboarding/components/CompletionStep.tsx b/ui/src/onboarding/components/CompletionStep.tsx index 2d81f38d04..1d0e585c4b 100644 --- a/ui/src/onboarding/components/CompletionStep.tsx +++ b/ui/src/onboarding/components/CompletionStep.tsx @@ -13,11 +13,14 @@ class CompletionStep extends PureComponent { public componentDidMount() { window.addEventListener('keydown', this.handleKeydown) } + public componentWillUnmount() { window.removeEventListener('keydown', this.handleKeydown) } + public render() { - const {onExit} = this.props + const {onExit, onDecrementCurrentStepIndex} = this.props + return (
@@ -28,7 +31,7 @@ class CompletionStep extends PureComponent { color={ComponentColor.Default} text="Back" size={ComponentSize.Medium} - onClick={this.props.onDecrementCurrentStepIndex} + onClick={onDecrementCurrentStepIndex} />