Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commitac42ad7

Browse files
committed
init/set tutorial with progress
1 parente31c39b commitac42ad7

File tree

17 files changed

+157
-62
lines changed

17 files changed

+157
-62
lines changed

‎typings/index.d.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,11 @@ export interface Action {
114114
meta?:any
115115
}
116116

117-
exportinterfaceMachineContext{}
117+
exportinterfaceMachineContext{
118+
tutorial:G.Tutorial|null,
119+
position:CR.Position,
120+
progress:CR.Progress,
121+
}
118122

119123
exportinterfaceMachineEvent{
120124
type:string

‎web-app/package-lock.json

Lines changed: 24 additions & 4 deletions
Some generated files are not rendered by default. Learn more aboutcustomizing how changed files appear on GitHub.

‎web-app/package.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@
3535
"markdown-it-emoji":"^1.4.0",
3636
"markdown-it-prism":"^2.0.2",
3737
"moment":"^2.24.0",
38+
"ramda":"^0.26.1",
3839
"react":"^16.9.0",
3940
"react-dom":"^16.9.0",
4041
"react-scripts":"^3.1.1",
@@ -52,6 +53,7 @@
5253
"@types/jest":"^24.0.18",
5354
"@types/markdown-it":"0.0.8",
5455
"@types/node":"^12.7.3",
56+
"@types/ramda":"^0.26.21",
5557
"@types/react":"^16.9.2",
5658
"@types/react-dom":"^16.9.0",
5759
"@types/storybook__react":"^4.0.2",

‎web-app/src/Routes.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import*asReactfrom'react'
22
// import { editorDispatch } from './services/vscode'
3-
3+
import*asCRfrom'typings'
44
importRouterfrom'./components/Router'
55
importLoadingPagefrom'./containers/LoadingPage'
66
importContinuePagefrom'./containers/Continue'
@@ -63,13 +63,13 @@ const Routes = () => {
6363
<LoadingPagetext="Loading..."/>
6464
</Route>
6565
<Routepath="Tutorial.Summary">
66-
<SummaryPagesend={tempSend}/>
66+
<SummaryPagesend={tempSend}context={{}asCR.MachineContext}/>
6767
</Route>
6868
<Routepath="Tutorial.Level">
69-
<LevelSummaryPagesend={tempSend}/>
69+
<LevelSummaryPagesend={tempSend}context={{}asCR.MachineContext}/>
7070
</Route>
7171
<Routepath="Tutorial.Stage">
72-
<StageSummaryPagesend={tempSend}/>
72+
<StageSummaryPagesend={tempSend}context={{}asCR.MachineContext}/>
7373
</Route>
7474
<Routepath="Tutorial.Completed">
7575
<CompletedPage/>

‎web-app/src/components/Debugger/debuggerWrapper.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import stateToString from './stateToString'
55
constdebuggerWrapper=(element:React.ReactElement,state:any)=>{
66
if(process.env.REACT_APP_DEBUG){
77
return(
8-
<Debuggerstate={stateToString(state.value)}>
8+
<Debuggerstate={stateToString(state.value)}{...state.context}>
99
{element}
1010
</Debugger>
1111
)

‎web-app/src/components/Debugger/index.tsx

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,21 @@
11
import*asReactfrom'react'
2-
// import * as CR from 'typings'
2+
import*asGfrom'typings/graphql'
3+
import*asCRfrom'typings'
34

45
interfaceProps{
56
state:string
6-
// position: CR.Position
7-
// progress: CR.Progress
7+
tutorial:G.Tutorial
8+
position:CR.Position
9+
progress:CR.Progress
810
children:React.ReactElement
911
}
1012

11-
constDebugger=({ state, children}:Props)=>(
13+
constDebugger=({ state, children, position, progress, tutorial}:Props)=>(
1214
<divstyle={{backgroundColor:'#FFFF99',color:'black',padding:'.5rem'}}>
1315
<h4>state:{state}</h4>
14-
{/* <p style={{ backgroundColor: 'khaki', padding: '.5rem' }}>position: {JSON.stringify(position)}</p>
15-
<p style={{ backgroundColor: 'moccasin', padding: '.5rem' }}>progress: {JSON.stringify(progress)}</p> */}
16+
<p>tutorial:{tutorial ?tutorial.id :'none'}</p>
17+
<pstyle={{backgroundColor:'khaki',padding:'.5rem'}}>position:{JSON.stringify(position)}</p>
18+
<pstyle={{backgroundColor:'moccasin',padding:'.5rem'}}>progress:{JSON.stringify(progress)}</p>
1619
{children}
1720
</div>
1821
)

‎web-app/src/components/Router/index.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ interface Props {
1313
}
1414

1515
interfaceCloneElementProps{
16+
context:CR.MachineContext
1617
send(action:CR.Action):void
1718
}
1819

@@ -22,6 +23,8 @@ const Router = ({ children }: Props): React.ReactElement<CloneElementProps>|null
2223
logger:console.log.bind('XSTATE:')
2324
})
2425

26+
console.log('state',state)
27+
2528
channel.setMachineSend(send)
2629

2730
// event bus listener
@@ -30,7 +33,7 @@ const Router = ({ children }: Props): React.ReactElement<CloneElementProps>|null
3033
constchildArray=React.Children.toArray(children)
3134
for(constchildofchildArray){
3235
if(state.matches(child.props.path)){
33-
constelement=React.cloneElement<CloneElementProps>(child.props.children,{ send})
36+
constelement=React.cloneElement<CloneElementProps>(child.props.children,{ send,context:state.context})
3437
returndebuggerWrapper(element,state)
3538
}
3639
}

‎web-app/src/containers/New/TutorialList/index.tsx

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,19 @@
11
import*asReactfrom'react'
22

3-
importcurrentTutorialfrom'../../../services/current'
4-
import*asCRfrom'typings'
3+
importchannelfrom'../../../services/channel'
54
import*asTfrom'typings/graphql'
65
importTutorialItemfrom'./TutorialItem'
76

87
interfaceProps{
98
tutorialList:T.Tutorial[]
10-
onNew(Action:CR.Action):void
119
}
1210

1311
constTutorialList=(props:Props)=>{
1412
constonSelect=(tutorial:T.Tutorial)=>{
15-
currentTutorial.set({
16-
tutorialId:tutorial.id,
17-
version:tutorial.version.version,
18-
})
19-
props.onNew({
13+
channel.machineSend({
2014
type:'TUTORIAL_START',
2115
payload:{
22-
id:tutorial.id,
23-
version:tutorial.version.version,
16+
tutorial,
2417
}
2518
})
2619
}

‎web-app/src/containers/New/index.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,12 @@ import TutorialList from './TutorialList'
1010

1111
interfaceProps{
1212
tutorialList:T.Tutorial[]
13-
onNew(action:CR.Action):void
1413
}
1514

1615
exportconstNewPage=(props:Props)=>(
1716
<div>
1817
<h2>Start a New Tutorial</h2>
19-
<TutorialListtutorialList={props.tutorialList}onNew={props.onNew}/>
18+
<TutorialListtutorialList={props.tutorialList}/>
2019
</div>
2120
)
2221

@@ -38,7 +37,7 @@ const NewPageContainer = (props: ContainerProps) => {
3837

3938
return(
4039
<React.Suspensefallback={Loading}>
41-
<NewPageonNew={props.send}tutorialList={data.tutorials}/>
40+
<NewPagetutorialList={data.tutorials}/>
4241
</React.Suspense>
4342
)
4443
}

‎web-app/src/containers/Tutorial/LevelPage/index.tsx

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import*asReactfrom'react'
22
import{useQuery}from'@apollo/react-hooks'
3+
import*asCRfrom'typings'
34
import*asGfrom'typings/graphql'
45

56
importcurrentTutorialfrom'../../../services/current'
@@ -23,17 +24,18 @@ export const LevelSummaryPage = (props: LevelProps) => {
2324
}
2425

2526
interfaceContainerProps{
26-
send(action:string):void
27+
context:CR.MachineContext
28+
send(action:string):void
2729
}
2830

2931
constLevelSummaryPageContainer=(props:ContainerProps)=>{
30-
const{ tutorialId, version, position, progress}=currentTutorial.get()
31-
3232
console.log('load level summary')
33+
const{ tutorial, position, progress}=props.context
34+
3335
const{ loading, error, data}=useQuery(queryLevel,{
3436
variables:{
35-
tutorialId,
36-
version,
37+
tutorialId:tutorial.id,
38+
version:tutorial.version.version,
3739
levelId:position.levelId,
3840
},
3941
})

‎web-app/src/containers/Tutorial/LevelPage/queryLevel.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import{gql}from'apollo-boost'
1+
import{gql}from'apollo-boost'
22

33
exportdefaultgql`
44
query getLevel($tutorialId: ID!, $version: String, $levelId: ID!) {

‎web-app/src/containers/Tutorial/StagePage/index.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import*asReactfrom'react'
2+
import*asCRfrom'typings'
23
import{useQuery}from'@apollo/react-hooks'
34

45
importcurrentTutorialfrom'../../../services/current'
@@ -7,6 +8,7 @@ import Stage from './Stage'
78
importqueryStagefrom'./queryStage'
89

910
interfacePageProps{
11+
context:CR.MachineContext,
1012
send(action:string):void
1113
}
1214

‎web-app/src/containers/Tutorial/SummaryPage/index.tsx

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,23 @@
11
import*asReactfrom'react'
2+
import*asCRfrom'typings'
23
import{useQuery}from'@apollo/react-hooks'
34

45
importquerySummaryfrom'./querySummary'
56
importSummaryfrom'./Summary'
6-
importcurrentTutorialfrom'../../../services/current'
77
importErrorViewfrom'../../../components/Error'
88

99
interfacePageProps{
10-
send(action:string):void
10+
context:CR.MachineContext
11+
send(action:CR.Action):void
1112
}
1213

1314
constSummaryPage=(props:PageProps)=>{
14-
const{tutorialId}=currentTutorial.get()
15+
const{tutorial}=props.context
1516
const{ loading, error, data}=useQuery(querySummary,{
17+
fetchPolicy:'network-only',// for debugging purposes
1618
variables:{
17-
tutorialId,
19+
tutorialId:tutorial.id,
20+
version:tutorial.version.version,
1821
},
1922
})
2023

@@ -26,8 +29,14 @@ const SummaryPage = (props: PageProps) => {
2629
return<ErrorViewerror={error}/>
2730
}
2831

29-
const{ title, text}=data.tutorial
30-
constonNext=()=>props.send('NEXT')
32+
constonNext=()=>props.send({
33+
type:'LOAD_TUTORIAL',
34+
payload:{
35+
tutorial:data.tutorial,
36+
}
37+
})
38+
39+
const{ title, text}=data.tutorial
3140

3241
return<Summarytitle={title}text={text}onNext={onNext}/>
3342
}
Lines changed: 20 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,24 @@
1-
import{gql}from'apollo-boost'
1+
import{gql}from'apollo-boost'
22

33
exportdefaultgql`
44
query getSummary($tutorialId: ID!, $version: String) {
5-
tutorial(id: $tutorialId) {
6-
id
7-
title
8-
text
9-
version(version: $version) {
10-
version
11-
coderoadVersion
12-
}
13-
}
14-
}
5+
tutorial(id: $tutorialId) {
6+
id
7+
title
8+
text
9+
version(version: $version) {
10+
version
11+
coderoadVersion
12+
levels {
13+
id
14+
stages {
15+
id
16+
steps {
17+
id
18+
}
19+
}
20+
}
21+
}
22+
}
23+
}
1524
`
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import{assign}from'xstate'
2+
import*asGfrom'typings/graphql'
3+
import*asCRfrom'typings'
4+
5+
exportdefault{
6+
setTutorial:assign({
7+
tutorial:(context:CR.MachineContext,event:CR.MachineEvent):any=>{
8+
returnevent.payload.tutorial
9+
},
10+
}),
11+
//@ts-ignore
12+
initPosition:assign({
13+
position:(context:CR.MachineContext,event:CR.MachineEvent):CR.Position=>{
14+
if(!event.payload.tutorial){
15+
thrownewError('Invalid tutorial')
16+
}
17+
18+
constversion:G.TutorialVersion=event.payload.tutorial.version
19+
20+
constposition:CR.Position={
21+
levelId:version.levels[0].id,
22+
stageId:version.levels[0].stages[0].id,
23+
stepId:version.levels[0].stages[0].steps[0].id,
24+
}
25+
26+
returnposition
27+
},
28+
})
29+
}

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp