1- import { interpret , Interpreter } from 'xstate'
1+ import { interpret , Interpreter } from 'xstate'
2+ import Tutorial from '../services/tutorial'
23import * as CR from 'typings'
34import createMachine from './machine'
45
@@ -7,61 +8,64 @@ import createMachine from './machine'
78
89// convert state into a readable string
910const stateToString = ( state :string | object , str :string = '' ) :string => {
10- if ( typeof state === 'object' ) {
11- const keys = Object . keys ( state )
12- if ( keys && keys . length ) {
13- const key = keys [ 0 ]
14- return stateToString ( state [ key ] , str . length ?`${ str } .${ key } ` :key )
15- }
16- return str
17- } else if ( typeof state === 'string' ) {
18- return state
19- }
20- return ''
11+ if ( typeof state === 'object' ) {
12+ const keys = Object . keys ( state )
13+ if ( keys && keys . length ) {
14+ const key = keys [ 0 ]
15+ return stateToString ( state [ key ] , str . length ?`${ str } .${ key } ` :key )
16+ }
17+ return str
18+ } else if ( typeof state === 'string' ) {
19+ return state
20+ }
21+ return ''
2122}
2223
2324interface Props {
24- dispatch :CR . EditorDispatch
25+ dispatch :CR . EditorDispatch
26+ tutorial :Tutorial
2527}
2628
2729class StateMachine {
28- private dispatch :CR . EditorDispatch
29- private machineOptions = {
30- devTools :true ,
31- deferEvents :true ,
32- execute :true ,
33- }
34- private service :Interpreter < CR . MachineContext , CR . MachineStateSchema , CR . MachineEvent >
35- constructor ( { dispatch} :Props ) {
36- this . dispatch = dispatch
37- const machine = createMachine ( dispatch )
38- this . service = interpret ( machine , this . machineOptions )
39- // logging
40- . onTransition ( state => {
41- if ( state . changed ) {
42- console . log ( `STATE:${ stateToString ( state . value ) } ` )
43- dispatch ( 'coderoad.send_state' , { state :state . value , data :state . context } )
44- } else {
45- dispatch ( 'coderoad.send_data' , { data :state . context } )
46- }
47- } )
48- }
49- public activate ( ) {
50- // initialize
51- this . service . start ( )
52- }
53- public deactivate ( ) {
54- this . service . stop ( )
55- }
56- public refresh ( ) {
57- console . log ( 'service refresh' )
58- console . log ( this . service . state )
59- const { value, context} = this . service . state
60- this . dispatch ( 'coderoad.send_state' , { state :value , data :context } )
61- }
62- public send ( action :string | CR . Action ) {
63- this . service . send ( action )
64- }
30+ private dispatch :CR . EditorDispatch
31+ private tutorial :Tutorial
32+ private machineOptions = {
33+ devTools :true ,
34+ deferEvents :true ,
35+ execute :true ,
36+ }
37+ private service :Interpreter < CR . MachineContext , CR . MachineStateSchema , CR . MachineEvent >
38+ constructor ( { dispatch, tutorial} :Props ) {
39+ this . dispatch = dispatch
40+ this . tutorial = tutorial
41+ const machine = createMachine ( dispatch )
42+ this . service = interpret ( machine , this . machineOptions )
43+ // logging
44+ . onTransition ( state => {
45+ if ( state . changed ) {
46+ console . log ( `STATE:${ stateToString ( state . value ) } ` )
47+ dispatch ( 'coderoad.send_state' , { state :state . value , data :state . context } )
48+ } else {
49+ dispatch ( 'coderoad.send_data' , { data :state . context } )
50+ }
51+ } )
52+ }
53+ public activate ( ) {
54+ // initialize
55+ this . service . start ( )
56+ }
57+ public deactivate ( ) {
58+ this . service . stop ( )
59+ }
60+ public refresh ( ) {
61+ console . log ( 'service refresh' )
62+ console . log ( this . service . state )
63+ const { value, context} = this . service . state
64+ this . dispatch ( 'coderoad.send_state' , { state :value , data :context } )
65+ }
66+ public send ( action :string | CR . Action ) {
67+ this . service . send ( action )
68+ }
6569}
6670
6771export default StateMachine