Skip to content

Commit f94ddc5

Browse files
christianalfonichristianalfoni
committed
fix(overmind-devtools): run mutations on mutations message
1 parent eee392e commit f94ddc5

File tree

4 files changed

+102
-142
lines changed

4 files changed

+102
-142
lines changed

‎packages/node_modules/overmind-devtools/src/overmind/actions.ts‎

Lines changed: 29 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -7,31 +7,7 @@ import {
77
ActionsListItemType,
88
Component,
99
} from './types'
10-
import {
11-
forkEachMessage,
12-
ensureCurrentApp,
13-
addFlushAndRunMutations,
14-
updateComponent,
15-
addComponent,
16-
removeComponent,
17-
updateDerived,
18-
updateFlushWithDerived,
19-
addAction,
20-
addOperator,
21-
updateOperator,
22-
updateAction,
23-
addMutations,
24-
updateEffect,
25-
setPortExists,
26-
isPortExistsMessage,
27-
getMessages,
28-
addStateAndActions,
29-
ensureApp,
30-
addClientMessages,
31-
updateOperatorAsync,
32-
runGetterMutation,
33-
updateState,
34-
} from './operators'
10+
import * as o from './operators'
3511
import { isValidJson } from './utils'
3612

3713
export const onInitialize: OnInitialize = async ({ state, effects }, app) => {
@@ -43,37 +19,35 @@ export const onInitialize: OnInitialize = async ({ state, effects }, app) => {
4319
effects.connector.connect(state.port)
4420
}
4521

46-
const handleClientMessage: Operator<Message, any> = pipe(
47-
ensureCurrentApp,
48-
ensureApp,
49-
addClientMessages,
50-
getMessages,
51-
forkEachMessage({
52-
[AppMessageType.PORT_EXISTS]: setPortExists,
53-
[ExecutionType.INIT]: addStateAndActions,
54-
[ExecutionType.RE_INIT]: addStateAndActions,
55-
[ExecutionType.FLUSH]: addFlushAndRunMutations,
56-
[ExecutionType.DERIVED]: updateDerived,
57-
[ExecutionType.MUTATIONS]: addMutations,
58-
[ExecutionType.EFFECT]: updateEffect,
59-
[ExecutionType.STATE]: updateState,
60-
[ExecutionType.COMPONENT_ADD]: addComponent,
61-
[ExecutionType.COMPONENT_UPDATE]: updateComponent,
62-
[ExecutionType.COMPONENT_REMOVE]: removeComponent,
63-
[ExecutionType.DERIVED_DIRTY]: updateFlushWithDerived,
64-
[ExecutionType.ACTION_START]: addAction,
65-
[ExecutionType.OPERATOR_START]: addOperator,
66-
[ExecutionType.OPERATOR_END]: updateOperator,
67-
[ExecutionType.ACTION_END]: updateAction,
68-
[ExecutionType.OPERATOR_ASYNC]: updateOperatorAsync,
69-
[ExecutionType.GETTER]: runGetterMutation,
70-
})
71-
)
72-
7322
export const onMessage: Operator<Message> = pipe(
74-
isPortExistsMessage({
75-
true: setPortExists,
76-
false: handleClientMessage,
23+
o.isPortExistsMessage({
24+
true: o.setPortExists(),
25+
false: pipe(
26+
o.ensureCurrentApp(),
27+
o.ensureApp(),
28+
o.addClientMessages(),
29+
o.getMessages(),
30+
o.forkEachMessage({
31+
[AppMessageType.PORT_EXISTS]: o.setPortExists(),
32+
[ExecutionType.INIT]: o.addStateAndActions(),
33+
[ExecutionType.RE_INIT]: o.addStateAndActions(),
34+
[ExecutionType.FLUSH]: o.addFlush(),
35+
[ExecutionType.DERIVED]: o.updateDerived(),
36+
[ExecutionType.MUTATIONS]: o.addMutations(),
37+
[ExecutionType.EFFECT]: o.updateEffect(),
38+
[ExecutionType.STATE]: o.updateState(),
39+
[ExecutionType.COMPONENT_ADD]: o.addComponent(),
40+
[ExecutionType.COMPONENT_UPDATE]: o.updateComponent(),
41+
[ExecutionType.COMPONENT_REMOVE]: o.removeComponent(),
42+
[ExecutionType.DERIVED_DIRTY]: o.updateFlushWithDerived(),
43+
[ExecutionType.ACTION_START]: o.addAction(),
44+
[ExecutionType.OPERATOR_START]: o.addOperator(),
45+
[ExecutionType.OPERATOR_END]: o.updateOperator(),
46+
[ExecutionType.ACTION_END]: o.updateAction(),
47+
[ExecutionType.OPERATOR_ASYNC]: o.updateOperatorAsync(),
48+
[ExecutionType.GETTER]: o.runGetterMutation(),
49+
})
50+
),
7751
})
7852
)
7953

‎packages/node_modules/overmind-devtools/src/overmind/operators.ts‎

Lines changed: 67 additions & 85 deletions
Original file line numberDiff line numberDiff line change
@@ -34,27 +34,26 @@ import {
3434
runMutation,
3535
} from './utils'
3636

37-
export const ensureCurrentApp: Operator<Message> = mutate(
38-
({ state }, message) => {
37+
export const ensureCurrentApp: () => Operator<Message> = () =>
38+
mutate(({ state }, message) => {
3939
if (!state.currentAppName) {
4040
state.currentAppName = message.appName
4141
}
42-
}
43-
)
42+
})
4443

45-
export const runGetterMutation: Operator<GetterMessage> = mutate(
46-
({ state }, message) => {
44+
export const runGetterMutation: () => Operator<GetterMessage> = () =>
45+
mutate(({ state }, message) => {
4746
runMutation(state.apps[message.appName].state)({
4847
method: 'set',
4948
path: message.data.path,
5049
args: [message.data.value],
5150
})
52-
}
53-
)
51+
})
5452

55-
export const setPortExists: Operator<any> = mutate(({ state }) => {
56-
state.error = 'PORT_EXISTS'
57-
})
53+
export const setPortExists: <T>() => Operator<T> = () =>
54+
mutate(({ state }) => {
55+
state.error = 'PORT_EXISTS'
56+
})
5857

5958
export const isPortExistsMessage: (
6059
paths: {
@@ -64,17 +63,16 @@ export const isPortExistsMessage: (
6463
) => Operator<Message> = (paths) =>
6564
when((_, message) => message.messages[0].type === 'PORT_EXISTS', paths)
6665

67-
export const addStateAndActions: Operator<InitMessage> = mutate(
68-
({ state }, message) => {
66+
export const addStateAndActions: () => Operator<InitMessage> = () =>
67+
mutate(({ state }, message) => {
6968
state.isConnecting = false
7069
state.error = null
7170
state.apps[message.appName].state = message.data.state
7271
state.apps[message.appName].actionPaths = message.data.actions
73-
}
74-
)
72+
})
7573

76-
export const addFlushAndRunMutations: Operator<FlushMessage> = mutate(
77-
({ state }, message) => {
74+
export const addFlush: () => Operator<FlushMessage> = () =>
75+
mutate(({ state }, message) => {
7876
ensureFlushExists(state.apps[message.appName].flushes, message.data)
7977
state.apps[message.appName].flushes[message.data.flushId].mutations =
8078
message.data.mutations
@@ -90,15 +88,10 @@ export const addFlushAndRunMutations: Operator<FlushMessage> = mutate(
9088
flushId: message.data.flushId,
9189
}
9290
}
91+
})
9392

94-
message.data.mutations.forEach(
95-
runMutation(state.apps[message.appName].state)
96-
)
97-
}
98-
)
99-
100-
export const ensureApp: Operator<Message> = mutate(
101-
async ({ state, effects }, message) => {
93+
export const ensureApp: () => Operator<Message> = () =>
94+
mutate(async ({ state, effects }, message) => {
10295
if (
10396
!state.apps[message.appName] ||
10497
message.messages[0].type === ExecutionType.INIT
@@ -120,21 +113,19 @@ export const ensureApp: Operator<Message> = mutate(
120113
})
121114
state.currentTab = tab || state.currentTab
122115
}
123-
}
124-
)
116+
})
125117

126-
export const addClientMessages: Operator<Message> = mutate(
127-
({ state }, message) => {
118+
export const addClientMessages: () => Operator<Message> = () =>
119+
mutate(({ state }, message) => {
128120
state.apps[message.appName].messages = JSON.parse(
129121
JSON.stringify(message.messages)
130122
)
131123
.reverse()
132124
.concat(state.apps[message.appName].messages)
133-
}
134-
)
125+
})
135126

136-
export const addComponent: Operator<AddComponentMessage> = mutate(
137-
({ state }, message) => {
127+
export const addComponent: () => Operator<AddComponentMessage> = () =>
128+
mutate(({ state }, message) => {
138129
const id = `${message.data.componentId}_${message.data.componentInstanceId}`
139130

140131
state.apps[message.appName].components[id] = {
@@ -145,11 +136,10 @@ export const addComponent: Operator<AddComponentMessage> = mutate(
145136
paths: message.data.paths,
146137
isCollapsed: true,
147138
}
148-
}
149-
)
139+
})
150140

151-
export const updateComponent: Operator<UpdateComponentMessage> = mutate(
152-
({ state }, message) => {
141+
export const updateComponent: () => Operator<UpdateComponentMessage> = () =>
142+
mutate(({ state }, message) => {
153143
const id = `${message.data.componentId}_${message.data.componentInstanceId}`
154144

155145
state.apps[message.appName].components[id].paths = message.data.paths
@@ -163,40 +153,36 @@ export const updateComponent: Operator<UpdateComponentMessage> = mutate(
163153
id
164154
)
165155
}
166-
}
167-
)
156+
})
168157

169-
export const removeComponent: Operator<RemoveComponentMessage> = mutate(
170-
({ state }, message) => {
158+
export const removeComponent: () => Operator<RemoveComponentMessage> = () =>
159+
mutate(({ state }, message) => {
171160
const id = `${message.data.componentId}_${message.data.componentInstanceId}`
172161

173162
state.apps[message.appName].components[id].isMounted = false
174-
}
175-
)
163+
})
176164

177-
export const updateDerived: Operator<DerivedMessage> = mutate(
178-
({ state }, message) => {
165+
export const updateDerived: () => Operator<DerivedMessage> = () =>
166+
mutate(({ state }, message) => {
179167
const appState = state.apps[message.appName].state
180168
const path = message.data.path.split('.')
181169
const key = path.pop()
182170
const target = path.reduce((aggr, pathKey) => aggr[pathKey], appState)
183171
target[key] = message.data.value
184172

185173
state.apps[message.appName].derived[message.data.path] = message.data
186-
}
187-
)
174+
})
188175

189-
export const updateFlushWithDerived: Operator<DirtyDerivedMessage> = mutate(
190-
({ state }, message) => {
176+
export const updateFlushWithDerived: () => Operator<DirtyDerivedMessage> = () =>
177+
mutate(({ state }, message) => {
191178
ensureFlushExists(state.apps[message.appName].flushes, message.data)
192179
state.apps[message.appName].flushes[message.data.flushId].derived.push(
193180
message.data.path
194181
)
195-
}
196-
)
182+
})
197183

198-
export const addAction: Operator<StartActionMessage> = mutate(
199-
({ state }, message) => {
184+
export const addAction: () => Operator<StartActionMessage> = () =>
185+
mutate(({ state }, message) => {
200186
const app = state.apps[message.appName]
201187
const action = message.data
202188
const actionId = getActionId(action)
@@ -236,11 +222,10 @@ export const addAction: Operator<StartActionMessage> = mutate(
236222
if (isSelectingFirstAction) {
237223
app.currentActionId = actionId
238224
}
239-
}
240-
)
225+
})
241226

242-
export const addOperator: Operator<StartOperatorMessage> = mutate(
243-
({ state }, message) => {
227+
export const addOperator: () => Operator<StartOperatorMessage> = () =>
228+
mutate(({ state }, message) => {
244229
const operatorData = message.data
245230
const actionId = getActionId(operatorData)
246231
const action = state.apps[message.appName].actions[actionId]
@@ -251,11 +236,10 @@ export const addOperator: Operator<StartOperatorMessage> = mutate(
251236
}
252237

253238
action.operators[operator.operatorId] = operator
254-
}
255-
)
239+
})
256240

257-
export const updateOperator: Operator<EndOperatorMessage> = mutate(
258-
({ state }, message) => {
241+
export const updateOperator: () => Operator<EndOperatorMessage> = () =>
242+
mutate(({ state }, message) => {
259243
const operatorData = message.data
260244
const actionId = getActionId(operatorData)
261245
const action = state.apps[message.appName].actions[actionId]
@@ -267,32 +251,29 @@ export const updateOperator: Operator<EndOperatorMessage> = mutate(
267251
operator.error = operatorData.error
268252
operator.isIntercepted = operatorData.isIntercepted
269253
operator.isSkipped = operatorData.isSkipped
270-
}
271-
)
254+
})
272255

273-
export const updateState: Operator<StateMessage> = mutate(
274-
({ state }, message) => {
256+
export const updateState: () => Operator<StateMessage> = () =>
257+
mutate(({ state }, message) => {
275258
const app = state.apps[message.appName]
276259
const path = message.data.path
277260
const key = path.pop()
278261
const target = path.reduce((aggr, key) => aggr[key], app.state)
279262

280263
target[key] = message.data.value
281-
}
282-
)
264+
})
283265

284-
export const updateAction: Operator<EndActionMessage> = mutate(
285-
({ state }, message) => {
266+
export const updateAction: () => Operator<EndActionMessage> = () =>
267+
mutate(({ state }, message) => {
286268
const app = state.apps[message.appName]
287269
const action = message.data
288270
const id = `${action.actionId}_${action.executionId}`
289271

290272
app.actions[id].isRunning = false
291-
}
292-
)
273+
})
293274

294-
export const addMutations: Operator<MutationsMessage> = mutate(
295-
({ state }, message) => {
275+
export const addMutations: () => Operator<MutationsMessage> = () =>
276+
mutate(({ state }, message) => {
296277
const mutations = message.data
297278
const id = `${mutations.actionId}_${mutations.executionId}`
298279
const operator =
@@ -304,11 +285,14 @@ export const addMutations: Operator<MutationsMessage> = mutate(
304285
data: mutation,
305286
}))
306287
)
307-
}
308-
)
309288

310-
export const updateEffect: Operator<EffectMessage> = mutate(
311-
({ state }, message) => {
289+
message.data.mutations.forEach(
290+
runMutation(state.apps[message.appName].state)
291+
)
292+
})
293+
294+
export const updateEffect: () => Operator<EffectMessage> = () =>
295+
mutate(({ state }, message) => {
312296
const effect = message.data
313297
const id = getActionId(effect)
314298
const action = state.apps[message.appName].actions[id]
@@ -332,13 +316,12 @@ export const updateEffect: Operator<EffectMessage> = mutate(
332316
if (effect.error) {
333317
action.hasError = true
334318
}
335-
}
336-
)
319+
})
337320

338-
export const getMessages: Operator<Message, AppMessage<any>[]> = map(
339-
(_, value) =>
321+
export const getMessages: () => Operator<Message, AppMessage<any>[]> = () =>
322+
map((_, value) =>
340323
value.messages.map((message) => ({ ...message, appName: value.appName }))
341-
)
324+
)
342325

343326
export const forkEachMessage: (
344327
paths: {
@@ -347,6 +330,5 @@ export const forkEachMessage: (
347330
) => Operator<AppMessage<any>[]> = (paths) =>
348331
forEach(fork((_, value) => value.type, paths) as Operator<AppMessage<any>>)
349332

350-
export const updateOperatorAsync: Operator<AsyncOperatorMessage> = mutate(
351-
() => {}
352-
)
333+
export const updateOperatorAsync: () => Operator<AsyncOperatorMessage> = () =>
334+
mutate(() => {})

0 commit comments

Comments
 (0)