Feature/new continue

package.json

@@ -32,6 +32,7 @@
 		"compile": "tsc -p ./",
 		"watch": "tsc -watch -p ./",
 		"postinstall": "node ./node_modules/vscode/bin/install",
+		"storybook": "cd web-app && npm run storybook",
 		"test": "npm run build && node ./node_modules/vscode/bin/test"
 	},
 	"devDependencies": {

src/editor/commands/index.ts

@@ -2,11 +2,12 @@ import * as vscode from 'vscode'
 import { join } from 'path'
 import { setStorage } from '../storage'
 import ReactWebView from '../ReactWebView'
+import { isEmptyWorkspace } from '../workspace'
 import * as CR from 'typings'
 
 const COMMANDS = {
     START: 'coderoad.start',
-    NEW_OR_CONTINUE: 'coderoad.new_or_continue',
+    TUTORIAL_LAUNCH: 'coderoad.tutorial_launch',
     OPEN_WEBVIEW: 'coderoad.open_webview',
     SEND_STATE: 'coderoad.send_state',
     SEND_DATA: 'coderoad.send_data',
@@ -20,12 +21,13 @@ interface CreateCommandProps {
     machine: CR.StateMachine,
     storage: any,
     git: any
+    position: any
 }
 
 // React panel webview
 let webview: any;
 
-export const createCommands = ({ context, machine, storage, git }: CreateCommandProps) => ({
+export const createCommands = ({ context, machine, storage, git, position }: CreateCommandProps) => ({
     // initialize
     [COMMANDS.START]: () => {
         // set local storage workspace
@@ -36,25 +38,30 @@ export const createCommands = ({ context, machine, storage, git }: CreateCommand
         console.log('webview', webview.panel.webview.postMessage)
         machine.activate()
     },
-    [COMMANDS.NEW_OR_CONTINUE]: async () => {
-        // verify that the user has a tutorial & progress
-        // verify git is setup with a coderoad remote
-        const [tutorial, progress, hasGit, hasGitRemote] = await Promise.all([
-            storage.getTutorial(),
-            storage.getProgress(),
-            git.gitVersion(),
-            git.gitCheckRemoteExists(),
-        ])
-        const canContinue = !!(tutorial && progress && hasGit && hasGitRemote)
-        console.log('canContinue', canContinue)
-        // if a tutorial exists, 'CONTINUE'
-        // otherwise start from 'NEW'
-        machine.send(canContinue ? 'CONTINUE' : 'NEW')
-    },
     // open React webview
     [COMMANDS.OPEN_WEBVIEW]: (column: number = vscode.ViewColumn.One) => {
         webview.createOrShow(column);
     },
+    // launch a new tutorial
+    // NOTE: may be better to move into action as logic is primarily non-vscode
+    [COMMANDS.TUTORIAL_LAUNCH]: async (tutorial: CR.Tutorial) => {
+        console.log('launch tutorial')
+
+        await isEmptyWorkspace()
+
+        await git.gitInitIfNotExists()
+
+        // TODO: use actual tutorial repo
+        await Promise.all([git.gitSetupRemote(tutorial.meta.repo), storage.setTutorial(tutorial), storage.resetProgress()])
+
+        // TODO: refactor to allow client to call initialization
+        const pos: CR.Position = await position.getInitial(tutorial)
+
+        // eslint-disable-next-line
+        const { steps } = tutorial.data
+        const { setup } = steps[pos.stepId].actions
+        await git.gitLoadCommits(setup)
+    },
     // open a file
     [COMMANDS.OPEN_FILE]: async (relativeFilePath: string) => {
         console.log(`OPEN_FILE ${JSON.stringify(relativeFilePath)}`)
@@ -79,6 +86,6 @@ export const createCommands = ({ context, machine, storage, git }: CreateCommand
     },
     [COMMANDS.RECEIVE_ACTION]: (action: string | CR.Action) => {
         console.log('onReceiveAction', action)
-        machine.onReceive(action)
+        machine.send(action)
     }
 })

src/editor/index.ts

@@ -3,6 +3,7 @@ import * as CR from 'typings'
 import { createCommands } from './commands'
 import * as storage from '../services/storage'
 import * as git from '../services/git'
+import * as position from '../services/position'
 
 interface Props {
     machine: CR.StateMachine,
@@ -33,6 +34,7 @@ class Editor {
             machine: this.machine,
             storage,
             git,
+            position,
         })
         for (const cmd in commands) {
             const command: vscode.Disposable = vscode.commands.registerCommand(cmd, commands[cmd])

src/services/api/index.ts

@@ -1,7 +1,7 @@
 import * as CR from 'typings'
 
 // temporary tutorials
-import basicTutorial from '../../state/context/tutorials/basic'
+import basicTutorial from 'tutorials/basic'
 
 interface Options {
   resource: string

src/state/actions/index.ts

@@ -1,6 +1,11 @@
 import { assign } from 'xstate'
+// NOTE: codesmell - importing machine
+import { machine } from '../../extension'
+import api from '../../services/api'
 import * as CR from 'typings'
 import * as vscode from 'vscode'
+import * as storage from '../../services/storage'
+import * as git from '../../services/git'
 
 let initialTutorial: CR.Tutorial | undefined
 let initialProgress: CR.Progress = {
@@ -11,7 +16,34 @@ let initialProgress: CR.Progress = {
 }
 
 export default {
-    tutorialLoad: assign({
+    createWebview() {
+        console.log('execute coderoad.open_webview')
+        vscode.commands.executeCommand('coderoad.open_webview')
+    },
+    async newOrContinue() {
+        // verify that the user has a tutorial & progress
+        // verify git is setup with a coderoad remote
+        const [tutorial, progress, hasGit, hasGitRemote] = await Promise.all([
+            storage.getTutorial(),
+            storage.getProgress(),
+            git.gitVersion(),
+            git.gitCheckRemoteExists(),
+        ])
+        const canContinue = !!(tutorial && progress && hasGit && hasGitRemote)
+
+        if (canContinue) {
+            initialTutorial = tutorial
+            initialProgress = progress
+        }
+
+        machine.send(canContinue ? 'CONTINUE' : 'NEW')
+    },
+    async tutorialLaunch() {
+        // TODO: add selection of tutorial id
+        const tutorial: CR.Tutorial = await api({ resource: 'getTutorial', params: { id: '1' } })
+        vscode.commands.executeCommand('coderoad.tutorial_launch', tutorial)
+    },
+    tutorialContinue: assign({
         // load initial data, progress & position
         data(): CR.TutorialData {
             console.log('ACTION: tutorialLoad.data')
@@ -45,11 +77,4 @@ export default {
             return position
         }
     }),
-    createWebview() {
-        console.log('execute coderoad.open_webview')
-        vscode.commands.executeCommand('coderoad.open_webview')
-    },
-    newOrContinue() {
-        vscode.commands.executeCommand('coderoad.new_or_continue')
-    }
 }

src/state/context/index.ts

@@ -1,4 +1,4 @@
-import basicTutorialData from './tutorials/basic'
+import basicTutorialData from 'tutorials/basic'
 import * as CR from 'typings'
 
 const tutorialContext: CR.MachineContext = {

src/state/index.ts

@@ -36,12 +36,6 @@ class StateMachine {
         this.service.stop()
     }
     send(action: string | CR.Action) {
-        console.log('machine.send')
-        console.log(action)
-        this.service.send(action)
-    }
-    onReceive(action: string | CR.Action) {
-        console.log(action)
         this.service.send(action)
     }
 }

src/state/machine.ts

@@ -11,7 +11,7 @@ export const machine = Machine<
     CR.MachineEvent
 >(
     {
-        id: 'tutorial',
+        id: 'root',
         context: initialContext,
         initial: 'SelectTutorial',
         states: {
@@ -40,28 +40,28 @@ export const machine = Machine<
                                 },
                             },
                             InitializeTutorial: {
+                                onEntry: ['tutorialLaunch'],
                                 on: {
-                                    TUTORIAL_LOADED: 'Tutorial'
+                                    TUTORIAL_LOADED: '#tutorial'
                                 }
                             },
                         }
-
                     },
                     ContinueTutorial: {
-                        onEntry: 'tutorialLoad',
+                        onEntry: ['tutorialContinue'],
                         on: {
-                            TUTORIAL_START: {
-                                target: 'Tutorial.LoadNext',
-                            }
+                            TUTORIAL_START: '#tutorial-load-next'
                         }
                     },
                 }
             },
             Tutorial: {
+                id: 'tutorial',
                 initial: 'Summary',
                 states: {
                     LoadNext: {
-                        onEntry: () => send('LOAD_NEXT'),
+                        id: 'tutorial-load-next',
+                        // onEntry: [() => send('LOAD_NEXT')],
                         on: {
                             LOAD_NEXT: [
                                 {
@@ -144,7 +144,7 @@ export const machine = Machine<
                                             cond: 'hasNextLevel',
                                         },
                                         {
-                                            target: 'EndTutorial',
+                                            target: '#root.Tutorial.EndTutorial',
                                         },
                                     ],
                                 },

tsconfig.json

@@ -8,7 +8,7 @@
 			"dom"
 		],
 		"sourceMap": true,
-		"rootDir": "src",
+		"rootDirs": ["src", "tutorials"],
 		"baseUrl": "src",
 		"strict": true,   /* enable all strict type-checking options */
 		/* Additional Checks */
@@ -23,6 +23,9 @@
 		"emitDecoratorMetadata": true,
 		"paths": {
 			"typings": ["../typings/index.d.ts"],
+			"tutorials/basic": [
+				"../tutorials/basic.ts"
+			]
 		},
 	},
 	"exclude": [