@@ -11,7 +11,6 @@ import TestMessage from '../../components/TestMessage'
1111import StepProgress from './components/StepProgress'
1212import { DISPLAY_RUN_TEST_BUTTON } from '../../environment'
1313import formatLevels from './formatLevels'
14- // import SettingsPage from './containers/Settings'
1514import Reset from './components/Reset'
1615import Continue from './components/Continue'
1716
@@ -69,6 +68,7 @@ const styles = {
6968interface PageProps {
7069context :T . MachineContext
7170send ( action :T . Action ) :void
71+ state :string // 'Normal' | 'TestRunning' | 'TestFail' | 'TestPass' | 'LevelComplete'
7272}
7373
7474/**
@@ -85,9 +85,6 @@ const TutorialPage = (props: PageProps) => {
8585const onContinue = ( ) :void => {
8686props . send ( {
8787type :'NEXT_LEVEL' ,
88- payload :{
89- levelId :position . levelId ,
90- } ,
9188} )
9289}
9390
@@ -111,6 +108,8 @@ const TutorialPage = (props: PageProps) => {
111108 testStatus,
112109} )
113110
111+ const disableOptions = processes . length > 0 || props . state === 'TestRunning'
112+
114113return (
115114< div >
116115< div >
@@ -141,26 +140,37 @@ const TutorialPage = (props: PageProps) => {
141140{ /* Left */ }
142141< div css = { { flex :1 } } >
143142{ DISPLAY_RUN_TEST_BUTTON && level . status !== 'COMPLETE' ?(
144- < Button style = { { marginLeft :'1rem' } } type = "primary" onClick = { onRunTest } disabled = { processes . length > 0 } >
143+ < Button style = { { marginLeft :'1rem' } } type = "primary" onClick = { onRunTest } disabled = { disableOptions } >
145144 Run
146145</ Button >
147146) :null }
148147</ div >
149148
150149{ /* Center */ }
151150< div css = { { flex :1 , display :'flex' , justifyContent :'center' } } >
152- < Reset onReset = { onReset } disabled = { processes . length > 0 } />
151+ < Reset onReset = { onReset } disabled = { disableOptions || props . state === 'LevelComplete' } />
153152</ div >
154153
155154{ /* Right */ }
156155< div css = { { flex :1 , display :'flex' , justifyContent :'flex-end' } } >
157- { level . status === 'COMPLETE' || ! level . steps . length ?(
156+ { ! level . steps . length ?(
157+ < div css = { { marginRight :'0.5rem' } } >
158+ < Continue
159+ onContinue = { onContinue }
160+ current = { levelIndex + 1 }
161+ max = { levels . length }
162+ title = { tutorial . summary . title }
163+ defaultOpen = { false }
164+ />
165+ </ div >
166+ ) :props . state === 'LevelComplete' ?(
158167< div css = { { marginRight :'0.5rem' } } >
159168< Continue
160169onContinue = { onContinue }
161170current = { levelIndex + 1 }
162171max = { levels . length }
163172title = { tutorial . summary . title }
173+ defaultOpen = { true }
164174/>
165175</ div >
166176) :level . steps . length > 1 ?(