Skip to content

Commit eb22e17

Browse files
authored
Merge pull request #34 from ShMcK/fix/parent-out-edges
Progress towards #33
2 parents 655078c + 5dc3d9f commit eb22e17

File tree

3 files changed

+67
-55
lines changed

3 files changed

+67
-55
lines changed

src/containers/StateNavigator/StateNav/index.tsx

+21-6
Original file line numberDiff line numberDiff line change
@@ -70,6 +70,20 @@ export default class StateNavigator extends React.Component<IProps, IState> {
7070
labels[label] = node.id
7171
}
7272
}
73+
getEdges = (node: INode | IGroup): Array<INode | IGroup> => {
74+
let outEdges = node!.getOutEdges()
75+
this.validate(outEdges, 'Edge')
76+
77+
if (node.model.parent) {
78+
const parent =
79+
this.state.allNodes.find(({ id }: any) => id === node.model.parent) ||
80+
null
81+
if (parent) {
82+
outEdges = outEdges.concat(this.getEdges(parent))
83+
}
84+
}
85+
return outEdges
86+
}
7387
next = () => {
7488
if (!this.state.error) {
7589
const currentNode = xsf.state.value
@@ -87,12 +101,13 @@ export default class StateNavigator extends React.Component<IProps, IState> {
87101
// set node as selected
88102
this.props.flow.setSelected(node, true)
89103
// get possible transitions as node edges
90-
const outEdges = node!.getOutEdges()
91-
this.validate(outEdges, 'Edge')
92-
const edges: IEdge[] = outEdges.map(({ model: { label, id } }) => ({
93-
label,
94-
id,
95-
}))
104+
const outEdges = this.getEdges(node)
105+
const edges: IEdge[] = outEdges.map(
106+
({ model: { label, id } }: any) => ({
107+
label,
108+
id,
109+
}),
110+
)
96111
// update state
97112
this.setState({ node, edges })
98113
}

src/utils/export/toXState/index.ts

+13-3
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,14 @@ export default (data: IData) => {
4545
edgeList.forEach((edge: IEdge) => {
4646
if (xstate.states) {
4747
// add state
48-
const target: string = nodesById[edge.target].label || ''
48+
const node = nodesById[edge.target]
49+
if (!node) {
50+
// BUG HERE, should have node
51+
throw new Error(
52+
'Node does not exist. This is likely a bug in the toXstate function',
53+
)
54+
}
55+
const target: string = node.label || node.id || ''
4956
if (!get(xstate, [...path, target])) {
5057
set(xstate, [...path, target], {})
5158
}
@@ -112,9 +119,12 @@ export default (data: IData) => {
112119
// TODO: traverse parent
113120
const parentId = node.parent
114121
if (parentId && !traversedStates.has(parentId)) {
115-
const parent = allNodes.filter((n) => n.id === parentId)
122+
const parent = allNodes.find((n) => n.id === parentId)
123+
if (parent) {
124+
traverseNode(parent, [...path, label, 'states'])
125+
}
116126
// TODO: handle parent
117-
console.warn('WARNING: parent not yet handled', parent)
127+
// console.warn('WARNING: parent not yet handled', parent)
118128
}
119129

120130
// traverse edges

src/utils/export/toXState/tests/toXState.test.ts

+33-46
Original file line numberDiff line numberDiff line change
@@ -40,8 +40,11 @@ describe('export to xstate', () => {
4040
const expected: StateNodeConfig = {
4141
initial: 'Second',
4242
states: {
43-
First: {},
43+
First: {
44+
id: '05a22f1a',
45+
},
4446
Second: {
47+
id: 'e54f9f9b',
4548
on: {
4649
SecondToFirst: 'First',
4750
},
@@ -143,9 +146,7 @@ describe('export to xstate', () => {
143146

144147
const expected: StateNodeConfig = {
145148
initial: 'First',
146-
states: {
147-
First: {},
148-
},
149+
states: { First: { id: '27bd6ab5' } },
149150
}
150151
expect(result).toEqual(expected)
151152
})
@@ -185,12 +186,8 @@ describe('export to xstate', () => {
185186
const expected: StateNodeConfig = {
186187
initial: 'First',
187188
states: {
188-
First: {
189-
on: {
190-
FirstToSecond: 'Second',
191-
},
192-
},
193-
Second: {},
189+
First: { id: '27bd6ab5', on: { FirstToSecond: 'Second' } },
190+
Second: { id: '132835b3' },
194191
},
195192
}
196193
expect(result).toEqual(expected)
@@ -226,7 +223,7 @@ describe('export to xstate', () => {
226223
{
227224
source: '132835b3',
228225
target: '27bd6ab5',
229-
id: '2a553b4c',
226+
id: '27bd6ab5',
230227
index: 2,
231228
label: 'SecondToFirst',
232229
},
@@ -238,16 +235,8 @@ describe('export to xstate', () => {
238235
const expected: StateNodeConfig = {
239236
initial: 'First',
240237
states: {
241-
First: {
242-
on: {
243-
FirstToSecond: 'Second',
244-
},
245-
},
246-
Second: {
247-
on: {
248-
SecondToFirst: 'First',
249-
},
250-
},
238+
First: { id: '27bd6ab5', on: { FirstToSecond: 'Second' } },
239+
Second: { id: '132835b3', on: { SecondToFirst: 'First' } },
251240
},
252241
}
253242
expect(result).toEqual(expected)
@@ -331,18 +320,21 @@ describe('export to xstate', () => {
331320
initial: 'First',
332321
states: {
333322
First: {
323+
id: '7d8ff3c3',
334324
on: {
335325
FirstToSecond: 'Second',
336326
FirstToThird: 'Third',
337327
},
338328
},
339329
Second: {
330+
id: '37770e39',
340331
on: {
341332
SecondToFirst: 'First',
342333
SecondToThird: 'Third',
343334
},
344335
},
345336
Third: {
337+
id: 'f7bef9df',
346338
on: {
347339
ThirdToFirst: 'First',
348340
ThirdToSecond: 'Second',
@@ -399,14 +391,18 @@ describe('export to xstate', () => {
399391
initial: 'First',
400392
states: {
401393
First: {
394+
id: '97431d6f',
402395
on: {
403396
FirstToGroup: 'SecondGroup',
404397
},
405398
},
406399
SecondGroup: {
400+
id: 'ca850085',
407401
initial: 'Third',
408402
states: {
409-
Third: {},
403+
Third: {
404+
id: 'b66468dc',
405+
},
410406
},
411407
},
412408
},
@@ -429,7 +425,7 @@ describe('export to xstate', () => {
429425
{
430426
shape: 'state',
431427
type: 'node',
432-
id: '97431d6f',
428+
id: 'b66468dc',
433429
index: 2,
434430
initial: false,
435431
label: 'Second',
@@ -447,32 +443,26 @@ describe('export to xstate', () => {
447443
},
448444
],
449445
groups: [
450-
{
451-
id: 'ca850085',
452-
index: 0,
453-
label: 'FirstGroup',
454-
initial: true,
455-
},
446+
{ id: 'ca850085', index: 0, label: 'FirstGroup', initial: true },
456447
],
457448
}
458449
const result = exportToXState(data)
459450
const expected = {
460451
initial: 'FirstGroup',
461452
states: {
462453
FirstGroup: {
454+
id: 'ca850085',
463455
initial: 'InnerFirst',
464-
on: {
465-
FirstToSecond: 'Second',
466-
},
467-
states: { InnerFirst: {} },
456+
on: { FirstToSecond: 'Second' },
457+
states: { InnerFirst: { id: 'b66468dc' } },
468458
},
469-
Second: {},
459+
Second: { id: 'b66468dc' },
470460
},
471461
}
472462
expect(result).toEqual(expected)
473463
})
474464

475-
// it('should ensure a nested state has an initial state')
465+
// it('should ensure a nested state has an initial s'tate')
476466

477467
// it('should connect to a nested state within a nested state')
478468
})
@@ -521,9 +511,11 @@ describe('export to xstate', () => {
521511
initial: 'Second',
522512
states: {
523513
First: {
514+
id: '05a22f1a',
524515
onEntry: ['enterFirst'],
525516
},
526517
Second: {
518+
id: 'e54f9f9b',
527519
onEntry: ['enterSecond'],
528520
on: {
529521
SecondToFirst: 'First',
@@ -572,9 +564,11 @@ describe('export to xstate', () => {
572564
initial: 'Second',
573565
states: {
574566
First: {
567+
id: '05a22f1a',
575568
onExit: ['exitFirst'],
576569
},
577570
Second: {
571+
id: 'e54f9f9b',
578572
onExit: ['exitSecond'],
579573
on: {
580574
SecondToFirst: 'First',
@@ -620,12 +614,8 @@ describe('export to xstate', () => {
620614
const expected: StateNodeConfig = {
621615
initial: 'Second',
622616
states: {
623-
First: {},
624-
Second: {
625-
on: {
626-
SecondToFirst: 'First',
627-
},
628-
},
617+
First: { id: '05a22f1a' },
618+
Second: { id: 'e54f9f9b', on: { SecondToFirst: 'First' } },
629619
},
630620
}
631621
expect(result).toEqual(expected)
@@ -665,14 +655,11 @@ describe('export to xstate', () => {
665655

666656
const expected: StateNodeConfig = {
667657
initial: 'FirstGroup',
668-
669658
states: {
670659
FirstGroup: {
660+
id: 'ca850085',
671661
parallel: true,
672-
states: {
673-
Second: {},
674-
Third: {},
675-
},
662+
states: { Second: { id: 'e54f9f9b' }, Third: { id: '05a22f1a' } },
676663
},
677664
},
678665
}

0 commit comments

Comments
 (0)