Skip to content

Commit be46fad

Browse files
ShMcKShMcK
committed
create setStatus mutation
1 parent 24eb6a6 commit be46fad

File tree

7 files changed

+102
-89
lines changed

7 files changed

+102
-89
lines changed

‎web-app/src/App.tsx

Lines changed: 20 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,41 @@
11
import * as React from 'react'
2-
import { ApolloProvider } from '@apollo/react-hooks'
2+
import { ApolloProvider, useMutation } from '@apollo/react-hooks'
33
import * as CR from 'typings'
44

55
import client from './services/apollo'
6+
import { SET_STATUS } from './services/apollo/mutations'
67
import Debugger from './components/Debugger'
78
import Routes from './Routes'
8-
import DataContext, { initialData, initialState } from './utils/DataContext'
99
import { send } from './utils/vscode'
1010

1111
interface ReceivedEvent {
1212
data: CR.Action
1313
}
1414

1515
const App = () => {
16+
const initialState = { SelectTutorial: 'Initial ' }
17+
18+
// set state machine state
1619
const [state, setState] = React.useState(initialState)
17-
const [data, setData]: [CR.MachineContext, (data: CR.MachineContext) => void] = React.useState(initialData)
20+
21+
// update level/stage/step status based on user progress & position
22+
// TODO: model server more effeciently
23+
const [setStatus] = useMutation(SET_STATUS)
1824

1925
// update state based on response from editor
2026
const handleEvent = (event: ReceivedEvent): void => {
2127
const message = event.data
2228
// messages from core
29+
const { progress, position } = message.payload.data
30+
2331
if (message.type === 'SET_STATE') {
32+
// SET_STATE - set state machine state
2433
setState(message.payload.state)
25-
setData(message.payload.data)
34+
35+
setStatus({ variables: { progress, position } })
2636
} else if (message.type === 'SET_DATA') {
27-
setData(message.payload.data)
37+
// SET_DATA - set state machine context
38+
setStatus({ variables: { progress, position } })
2839
}
2940
}
3041

@@ -44,20 +55,15 @@ const App = () => {
4455

4556
const value = {
4657
state,
47-
position: data.position,
48-
data: data.data,
49-
progress: data.progress,
5058
}
5159

5260
// TODO: refactor cond to user <Router><Route> and accept first route as if/else if
5361
return (
5462
<ApolloProvider client={client}>
55-
<DataContext.Provider value={value}>
56-
<div>
57-
{process.env.REACT_APP_DEBUG && <Debugger value={value} />}
58-
<Routes state={state} />
59-
</div>
60-
</DataContext.Provider>
63+
<div>
64+
{process.env.REACT_APP_DEBUG && <Debugger value={value} />}
65+
<Routes state={state} />
66+
</div>
6167
</ApolloProvider>
6268
)
6369
}

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,8 @@ const TutorialList = (props: Props) => (
1414
<TutorialItem
1515
key={tutorial.id}
1616
onNew={() => props.onNew(tutorial.id)}
17-
title={tutorial.title}
18-
text={tutorial.text}
17+
title={tutorial.title || ''}
18+
text={tutorial.text || ''}
1919
/>
2020
))}
2121
</div>

‎web-app/src/services/apollo/index.ts

Lines changed: 5 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -1,62 +1,16 @@
11
import ApolloClient, { InMemoryCache } from 'apollo-boost'
22

3+
import typeDefs from './typeDefs'
4+
import resolvers from './resolvers'
5+
36
const client = new ApolloClient({
47
uri: process.env.REACT_APP_GQL_URI,
58
headers: {
69
Authorization: process.env.GQL_AUTH_TOKEN,
710
},
811
cache: new InMemoryCache(),
9-
resolvers: {
10-
Mutation: {
11-
setStatus: (_root, variables, { cache, getCacheKey }) => {
12-
// TODO: optimize status setting to act on diffs
13-
14-
// set local cache
15-
function set(typename: string, id: string, status: 'ACTIVE' | 'COMPLETE') {
16-
const writeId = getCacheKey({ __typename: typename, id })
17-
const data = { status }
18-
cache.writeData({ id: writeId, data })
19-
}
20-
21-
const { progress, position } = variables
22-
23-
// set level progress & active
24-
for (const levelId of Object.keys(progress.levels)) {
25-
set('Level', levelId, 'COMPLETE')
26-
}
27-
set('Level', position.levelId, 'ACTIVE')
28-
29-
// set stage progress & active
30-
for (const stageId of Object.keys(progress.stages)) {
31-
set('Stage', stageId, 'COMPLETE')
32-
}
33-
set('Stage', position.stageId, 'ACTIVE')
34-
35-
// set step progress & active
36-
for (const stepId of Object.keys(progress.steps)) {
37-
set('Step', stepId, 'COMPLETE')
38-
}
39-
set('Step', position.stepId, 'ACTIVE')
40-
41-
return null
42-
},
43-
},
44-
Level: {
45-
status() {
46-
return 'INCOMPLETE'
47-
}
48-
},
49-
Stage: {
50-
status() {
51-
return 'INCOMPLETE'
52-
}
53-
},
54-
Step: {
55-
status() {
56-
return 'INCOMPLETE'
57-
}
58-
}
59-
},
12+
typeDefs,
13+
resolvers,
6014
})
6115

6216
export default client

‎web-app/src/services/apollo/mutations.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { gql } from 'apollo-boost'
2+
3+
export const SET_STATUS = gql`
4+
mutation ToggleTodo($progress: Progress!, $position: Position) {
5+
setStatus(progress: $progress, position: $position) @client
6+
}
7+
`

‎web-app/src/services/apollo/resolvers.ts

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
const resolvers = {
2+
Mutation: {
3+
setStatus: (_root, variables, { cache, getCacheKey }) => {
4+
// TODO: optimize status setting to act on diffs
5+
6+
// set local cache
7+
function set(typename: string, id: string, status: 'ACTIVE' | 'COMPLETE') {
8+
const writeId = getCacheKey({ __typename: typename, id })
9+
const data = { status }
10+
cache.writeData({ id: writeId, data })
11+
}
12+
13+
const { progress, position } = variables
14+
15+
// set level progress & active
16+
for (const levelId of Object.keys(progress.levels)) {
17+
set('Level', levelId, 'COMPLETE')
18+
}
19+
set('Level', position.levelId, 'ACTIVE')
20+
21+
// set stage progress & active
22+
for (const stageId of Object.keys(progress.stages)) {
23+
set('Stage', stageId, 'COMPLETE')
24+
}
25+
set('Stage', position.stageId, 'ACTIVE')
26+
27+
// set step progress & active
28+
for (const stepId of Object.keys(progress.steps)) {
29+
set('Step', stepId, 'COMPLETE')
30+
}
31+
set('Step', position.stepId, 'ACTIVE')
32+
33+
return null
34+
},
35+
},
36+
Level: {
37+
status() {
38+
return 'INCOMPLETE'
39+
}
40+
},
41+
Stage: {
42+
status() {
43+
return 'INCOMPLETE'
44+
}
45+
},
46+
Step: {
47+
status() {
48+
return 'INCOMPLETE'
49+
}
50+
}
51+
}
52+
53+
export default resolvers

‎web-app/src/services/apollo/typeDefs.ts

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { gql } from 'apollo-boost'
2+
3+
const typeDefs = gql`
4+
input Progress {
5+
levels: JSONObject
6+
stages: JSONObject
7+
steps: JSONObject
8+
}
9+
input Position {
10+
levelId: String
11+
stageId: String
12+
stepId: String
13+
}
14+
`
15+
export default typeDefs

‎web-app/src/utils/DataContext.tsx

Lines changed: 0 additions & 22 deletions
This file was deleted.

0 commit comments

Comments
 (0)