@@ -85,8 +85,10 @@ interface Props {
8585}
8686
8787const Level = ( { level, onContinue, onLoadSolution, processes, testStatus} :Props ) => {
88- if ( ! level . steps ) {
89- throw new Error ( 'No Stage steps found' )
88+ //@ts -ignore
89+ let currentStep = level . steps . findIndex ( s => s . status === 'ACTIVE' )
90+ if ( currentStep === - 1 ) {
91+ currentStep = level . steps . length
9092}
9193
9294const pageBottomRef = React . useRef ( null )
@@ -95,11 +97,6 @@ const Level = ({ level, onContinue, onLoadSolution, processes, testStatus }: Pro
9597//@ts -ignore
9698pageBottomRef . current . scrollIntoView ( { behavior :'smooth' } )
9799}
98- //@ts -ignore
99- let currentStep = level . steps . findIndex ( s => s . status === 'ACTIVE' )
100- if ( currentStep === - 1 ) {
101- currentStep = level . steps . length
102- }
103100React . useEffect ( scrollToBottom , [ currentStep ] )
104101
105102return (
@@ -112,26 +109,28 @@ const Level = ({ level, onContinue, onLoadSolution, processes, testStatus }: Pro
112109< Markdown > { level . content || '' } </ Markdown >
113110</ div >
114111
115- < div css = { styles . tasks } >
116- < div css = { styles . header } > Tasks</ div >
117- < div css = { styles . steps } >
118- { level . steps . map ( ( step :( G . Step & { status :T . ProgressStatus } ) | null , index :number ) => {
119- if ( ! step ) {
120- return null
121- }
122- return (
123- < Step
124- key = { step . id }
125- order = { index + 1 }
126- status = { step . status }
127- content = { step . content }
128- onLoadSolution = { onLoadSolution }
129- />
130- )
131- } ) }
112+ { level . steps . length ?(
113+ < div css = { styles . tasks } >
114+ < div css = { styles . header } > Tasks</ div >
115+ < div css = { styles . steps } >
116+ { level . steps . map ( ( step :( G . Step & { status :T . ProgressStatus } ) | null , index :number ) => {
117+ if ( ! step ) {
118+ return null
119+ }
120+ return (
121+ < Step
122+ key = { step . id }
123+ order = { index + 1 }
124+ status = { step . status }
125+ content = { step . content }
126+ onLoadSolution = { onLoadSolution }
127+ />
128+ )
129+ } ) }
130+ </ div >
132131</ div >
133- < div ref = { pageBottomRef } />
134- </ div >
132+ ) : null }
133+ < div ref = { pageBottomRef } / >
135134
136135{ ( testStatus || processes . length > 0 ) && (
137136< div css = { styles . processes } >
@@ -149,7 +148,7 @@ const Level = ({ level, onContinue, onLoadSolution, processes, testStatus }: Pro
149148{ level . title }
150149</ span >
151150< span >
152- { level . status === 'COMPLETE' ?(
151+ { level . status === 'COMPLETE' || ! level . steps . length ?(
153152< Button type = "primary" onClick = { onContinue } >
154153 Continue
155154</ Button >