continue from same point

Author: ShMcK

web-app/src/Routes.tsx

@@ -47,34 +47,34 @@ const Routes = () => {
         <Route path="Start.Startup">
           <LoadingPage text="Launching..." />
         </Route>
-				<Route path="Start.NewTutorial.SelectTutorial">
-          <NewPage send={tempSend}/>
+        <Route path="Start.NewTutorial.SelectTutorial">
+          <NewPage send={tempSend} />
         </Route>
         <Route path="Start.NewTutorial.InitializeTutorial">
           <LoadingPage text="Launching Tutorial..." />
         </Route>
         <Route path="Start.ContinueTutorial">
-          <ContinuePage context={{} as CR.MachineContext}/>
+          <ContinuePage send={tempSend} context={{} as CR.MachineContext} />
         </Route>
-				<Route path="Tutorial.Initialize">
+        <Route path="Tutorial.Initialize">
           <LoadingPage text="Initializing..." />
         </Route>
-				<Route path="Tutorial.LoadNext">
-        	<LoadingPage text="Loading..." />
-				</Route>
-				<Route path="Tutorial.Summary">
-					<SummaryPage send={tempSend} context={{} as CR.MachineContext}/>
-				</Route>
-				<Route path="Tutorial.Level">
-					<LevelSummaryPage send={tempSend} context={{} as CR.MachineContext}/>
-				</Route>
-				<Route path="Tutorial.Stage">
-					<StageSummaryPage send={tempSend} context={{} as CR.MachineContext}/>
-				</Route>
-				<Route path="Tutorial.Completed">
-					<CompletedPage send={tempSend} context={{} as CR.MachineContext}/>
-				</Route>
-			</Router>
+        <Route path="Tutorial.LoadNext">
+          <LoadingPage text="Loading..." />
+        </Route>
+        <Route path="Tutorial.Summary">
+          <SummaryPage send={tempSend} context={{} as CR.MachineContext} />
+        </Route>
+        <Route path="Tutorial.Level">
+          <LevelSummaryPage send={tempSend} context={{} as CR.MachineContext} />
+        </Route>
+        <Route path="Tutorial.Stage">
+          <StageSummaryPage send={tempSend} context={{} as CR.MachineContext} />
+        </Route>
+        <Route path="Tutorial.Completed">
+          <CompletedPage send={tempSend} context={{} as CR.MachineContext} />
+        </Route>
+      </Router>
     </div>
   )
 }

web-app/src/containers/Continue/index.tsx

@@ -22,21 +22,15 @@ export const ContinuePage = (props: Props) => (
 )
 
 interface ContainerProps {
-	context: CR.MachineContext
+  context: CR.MachineContext
+  send(action: CR.Action | string): void
 }
 
-const ContinuePageContainer = ({ context }: ContainerProps) => {
-	// TODO: load specific tutorialId
-	const { tutorial } = context
+const ContinuePageContainer = ({ context, send }: ContainerProps) => {
+  // TODO: load specific tutorialId
+  const { tutorial } = context
 
-  return (
-    <ContinuePage
-      tutorial={tutorial}
-      onContinue={() => {
-        console.log('TUTORIAL_START')
-      }}
-    />
-  )
+  return <ContinuePage tutorial={tutorial} onContinue={() => send('TUTORIAL_START')} />
 }
 
 export default ContinuePageContainer

web-app/src/services/channel/index.ts

@@ -30,7 +30,6 @@ class Channel {
 		// @ts-ignore // ignore browser events from plugins
 		if (action.source) {return }
 
-		console.log('receive action', action)
 		// messages from core
 		switch (action.type) {
 			case 'TUTORIAL_LOADED':

web-app/src/services/state/actions/invoke.ts

@@ -1,25 +1,53 @@
 import * as storage from '../storage'
 import * as CR from 'typings'
+import * as G from 'typings/graphql'
 
 export const newOrContinue = async (context: CR.MachineContext) => {
-	const [tutorial, position, progress] = await Promise.all([
+	const [tutorial, progress] = await Promise.all([
 		storage.tutorial.get(),
-		storage.position.get(),
 		storage.progress.get()
 	])
 
-	const hasExistingTutorial = (tutorial && tutorial.id && progress && !progress.complete)
-	if (hasExistingTutorial) {
-		// TODO: calculate position based on progress
-		return {
-			type: 'CONTINUE',
-			payload: {
-				tutorial,
-				position,
-				progress
-			}
+	const hasExistingTutorial: boolean = (!!tutorial && !!progress && !progress.complete && !!tutorial.id)
+
+	if (!hasExistingTutorial) {
+		return Promise.reject()
+	}
+
+	// Calculate position based on progress
+
+	// @ts-ignore
+	const level = tutorial.version.levels.find((l: G.Level) => !progress.levels[l.id])
+	if (!level) {
+		// tutorial complete
+		return Promise.reject()
+	}
+
+	// @ts-ignore
+	const stage = level.stages.find((s: G.Stage) => !progress.stages[s.id])
+	if (!stage) {
+		// something went wrong
+		return Promise.reject()
+	}
+
+	// @ts-ignore
+	const step = stage.steps.find((s: G.Step) => !progress.steps[s.id])
+	if (!step) {
+		return Promise.reject()
+	}
+
+	const position = {
+		levelId: level.id,
+		stageId: stage.id,
+		stepId: step.id,
+	}
+
+	return {
+		type: 'CONTINUE',
+		payload: {
+			tutorial,
+			position,
+			progress
 		}
 	}
-	// New tutorial
-	return Promise.reject()
 }

web-app/src/services/state/machine.ts

@@ -52,9 +52,8 @@ export const machine = Machine<CR.MachineContext, CR.MachineStateSchema, CR.Mach
 						},
 					},
 					ContinueTutorial: {
-						onEntry: ['tutorialContinue'],
 						on: {
-							TUTORIAL_START: '#tutorial-load-next',
+							TUTORIAL_START: '#tutorial-stage',
 						},
 					},
 				},
@@ -104,6 +103,7 @@ export const machine = Machine<CR.MachineContext, CR.MachineStateSchema, CR.Mach
 						},
 					},
 					Stage: {
+						id: 'tutorial-stage',
 						onEntry: ['loadStage'],
 						initial: 'Normal',
 						states: {