Skip to content

Commit 664dcc3

Browse files
jsajaljsajal
committed
parser for setvarnode to serialize and deserialize
1 parent b18d6e1 commit 664dcc3

File tree

4 files changed

+114
-32
lines changed

4 files changed

+114
-32
lines changed

‎packages/flowtest-electron/src/utils/flowparser/SetVarNode.js‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
const { Node } = require('./Node');
2+
3+
class SetVarNode extends Node {
4+
constructor() {
5+
super('setVarNode');
6+
}
7+
8+
serialize(id, data, metadata) {
9+
return {
10+
id,
11+
type: 'setVarNode',
12+
data,
13+
...metadata,
14+
};
15+
}
16+
17+
deserialize(node) {
18+
const id = node.id;
19+
const data = node.data;
20+
delete node.id;
21+
delete node.data;
22+
const metadata = node;
23+
24+
return {
25+
id,
26+
data,
27+
metadata,
28+
};
29+
}
30+
}
31+
32+
module.exports = {
33+
SetVarNode,
34+
};

‎packages/flowtest-electron/src/utils/flowparser/parser.js‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ const { AssertNode } = require('./AssertNode');
66
const { OutputNode } = require('./OutputNode');
77
const { RequestNode } = require('./RequestNode');
88
const { StartNode } = require('./StartNode');
9+
const { SetVarNode } = require('./SetVarNode');
910

1011
const VERSION = 1;
1112

@@ -123,6 +124,20 @@ const deserialize = (flowData) => {
123124
...result.metadata,
124125
};
125126
}
127+
128+
if (node.type === 'setVarNode') {
129+
const sNode = new SetVarNode();
130+
const result = sNode.deserialize(node);
131+
textData.graph.data.nodes[result.id] = {
132+
type: 'setVarNode',
133+
...result.data,
134+
};
135+
136+
textData.graph.metadata.nodes[result.id] = {
137+
type: 'setVarNode',
138+
...result.metadata,
139+
};
140+
}
126141
});
127142
}
128143

@@ -211,6 +226,14 @@ const serialize = (textData) => {
211226
const result = cNode.serialize(id, data, metadata);
212227
flowData.nodes.push(result);
213228
}
229+
230+
if (value.type === 'setVarNode') {
231+
const data = value;
232+
const metadata = textDataCopy.graph.metadata.nodes[id];
233+
const cNode = new SetVarNode();
234+
const result = cNode.serialize(id, data, metadata);
235+
flowData.nodes.push(result);
236+
}
214237
});
215238

216239
Object.entries(textDataCopy.graph.metadata.edges).map(([key, value], index) => {

‎src/components/molecules/flow/nodes/SetVarNode.js‎

Lines changed: 28 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -19,26 +19,26 @@ const SetVarNode = ({ id, data }) => {
1919
return (
2020
<div className='flex items-center justify-between pb-2'>
2121
<div className='flex items-center justify-between text-sm border rounded-md border-neutral-500 text-neutral-500 outline-0 focus:ring-0'>
22-
{data.type === 'Boolean' ? (
22+
{data.variable.type === 'Boolean' ? (
2323
<select
2424
onChange={(e) => variableNodeChangeVar(id, e.target.value)}
2525
name='boolean-val'
2626
className='nodrag h-9 w-full rounded-br-md rounded-tr-md p-2.5 px-1 '
27-
value={data.value}
27+
value={data.variable.value}
2828
>
2929
<option value='true'>True</option>
3030
<option value='false'>False</option>
3131
</select>
32-
) : data.type === 'Now' ? (
32+
) : data.variable.type === 'Now' ? (
3333
<div></div>
3434
) : (
3535
<input
36-
type={getInputType(data.type)}
36+
type={getInputType(data.variable.type)}
3737
className='nodrag nowheel block h-9 w-full rounded-bl-md rounded-tl-md p-2.5'
3838
name='variable-value'
39-
data-type={getInputType(data.type)}
39+
data-type={getInputType(data.variable.type)}
4040
onChange={(e) => variableNodeChangeVar(id, e.target.value)}
41-
value={data.value}
41+
value={data.variable.value}
4242
/>
4343
)}
4444
</div>
@@ -60,7 +60,11 @@ const SetVarNode = ({ id, data }) => {
6060
<select
6161
onChange={handleOperatorSelection}
6262
name='operator-type'
63-
value={data.value.operator ? data.value.operator : CHOOSE_OPERATOR_DEFAULT_VALUE_OBJ.value}
63+
value={
64+
data.variable && data.variable.value.operator
65+
? data.variable.value.operator
66+
: CHOOSE_OPERATOR_DEFAULT_VALUE_OBJ.value
67+
}
6468
className='w-full h-12 px-1 py-2 border rounded-md border-neutral-500 text-neutral-500 outline-0 focus:ring-0'
6569
>
6670
<option value={CHOOSE_OPERATOR_DEFAULT_VALUE_OBJ.value}>
@@ -97,28 +101,28 @@ const SetVarNode = ({ id, data }) => {
97101

98102
return (
99103
<div className='flex items-center justify-center mb-4 text-sm border rounded-md border-neutral-500 text-neutral-500 outline-0 focus:ring-0'>
100-
{data.value.variables && data.value.variables[varName] ? (
101-
data.value.variables[varName].type === 'Boolean' ? (
104+
{data.variable && data.variable.value.variables && data.variable.value.variables[varName] ? (
105+
data.variable.value.variables[varName].type === 'Boolean' ? (
102106
<select
103107
onChange={(event) => setVariableNodeExpressionsVariable(id, varName, 'Boolean', event.target?.value)}
104108
name='boolean-val'
105109
className='nodrag h-12 w-full rounded-br-md rounded-tr-md p-2.5 px-1 '
106-
value={data.value.variables[varName].value}
110+
value={data.variable.value.variables[varName].value}
107111
>
108112
<option value='true'>True</option>
109113
<option value='false'>False</option>
110114
</select>
111115
) : (
112116
<input
113117
id='outlined-adornment-weight'
114-
type={getInputType(data.value.variables[varName].type)}
118+
type={getInputType(data.variable.value.variables[varName].type)}
115119
className='nodrag nowheel block h-12 w-full rounded-bl-md rounded-tl-md p-2.5'
116120
name='variable-value'
117121
placeholder={varName}
118-
value={data.value.variables[varName].value}
122+
value={data.variable.value.variables[varName].value}
119123
onChange={(event) => {
120124
const updatedValue = event.target.value;
121-
switch (data.value.variables[varName].type) {
125+
switch (data.variable.value.variables[varName].type) {
122126
case 'String':
123127
// data.variables[varName].value = updatedValue.toString();
124128
// setVariableValue(updatedValue.toString());
@@ -163,7 +167,11 @@ const SetVarNode = ({ id, data }) => {
163167
onChange={handleInputTypeSelection}
164168
name='var-input-type'
165169
className='w-full h-8 p-0 px-1 border-l nodrag rounded-br-md rounded-tr-md border-l-neutral-500'
166-
value={data.value.variables && data.value.variables[varName] ? data.value.variables[varName].type : 'String'}
170+
value={
171+
data.variable && data.variable.value.variables && data.variable.value.variables[varName]
172+
? data.variable.value.variables[varName].type
173+
: 'String'
174+
}
167175
>
168176
<option value='Select'>Select</option>
169177
<option value='String'>String</option>
@@ -191,13 +199,13 @@ const SetVarNode = ({ id, data }) => {
191199
className='nodrag nowheel mb-2 block w-full rounded-lg border border-gray-300 bg-gray-50 p-2.5 text-sm text-gray-900 outline-blue-300 focus:border-blue-100 focus:ring-blue-100'
192200
name='variable_name'
193201
onChange={(e) => setVariableNodeName(id, e.target.value)}
194-
value={data.name ? data.name : ''}
202+
value={data.variable && data.variable.name ? data.variable.name : ''}
195203
/>
196204
<select
197205
onChange={(e) => setVariableNodeType(id, e.target.value)}
198206
name='var-input-type'
199207
className='w-full h-8 p-0 px-1 border-l nodrag rounded-br-md rounded-tr-md border-l-neutral-500'
200-
value={data.type ? data.type : ''}
208+
value={data.variable && data.variable.type ? data.variable.type : ''}
201209
>
202210
<option value=''>None</option>
203211
{variableTypes.map((option) => (
@@ -208,13 +216,15 @@ const SetVarNode = ({ id, data }) => {
208216
<option value='Expression'>Expression</option>
209217
</select>
210218
</div>
211-
{data.type != '' ? (
212-
data.type === 'Expression' ? (
219+
{data.variable && data.variable.type ? (
220+
data.variable.type === 'Expression' ? (
213221
<div>
214222
<div>{variableElem(id, data, 'var1')}</div>
215223
<div>{operatorMenu(id, data)}</div>
216224
<div>{variableElem(id, data, 'var2')}</div>
217225
</div>
226+
) : data.variable.type === '' ? (
227+
<div></div>
218228
) : (
219229
<div>
220230
<div>{renderVariable()}</div>

‎src/stores/CanvasStore.js‎

Lines changed: 29 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -364,7 +364,10 @@ const useCanvasStore = create((set, get) => ({
364364
// it's important to create a new object here, to inform React Flow about the cahnges
365365
node.data = {
366366
...node.data,
367-
name,
367+
variable: {
368+
...node.data?.variable,
369+
name,
370+
},
368371
};
369372
}
370373

@@ -380,8 +383,11 @@ const useCanvasStore = create((set, get) => ({
380383
// it's important to create a new object here, to inform React Flow about the cahnges
381384
node.data = {
382385
...node.data,
383-
type,
384-
value: type === 'Expression' ? {} : getDefaultValue(type),
386+
variable: {
387+
...node.data?.variable,
388+
type,
389+
value: type === 'Expression' ? {} : getDefaultValue(type),
390+
},
385391
};
386392
}
387393

@@ -396,13 +402,16 @@ const useCanvasStore = create((set, get) => ({
396402
// it's important to create a new object here, to inform React Flow about the cahnges
397403
node.data = {
398404
...node.data,
399-
value: {
400-
...node.data.value,
401-
variables: {
402-
...node.data.value.variables,
403-
[name]: {
404-
type,
405-
value,
405+
variable: {
406+
...node.data.variable,
407+
value: {
408+
...node.data.variable.value,
409+
variables: {
410+
...node.data.variable.value?.variables,
411+
[name]: {
412+
type,
413+
value,
414+
},
406415
},
407416
},
408417
},
@@ -421,9 +430,12 @@ const useCanvasStore = create((set, get) => ({
421430
// it's important to create a new object here, to inform React Flow about the cahnges
422431
node.data = {
423432
...node.data,
424-
value: {
425-
...node.data.value,
426-
operator,
433+
variable: {
434+
...node.data.variable,
435+
value: {
436+
...node.data.variable.value,
437+
operator,
438+
},
427439
},
428440
};
429441
}
@@ -439,7 +451,10 @@ const useCanvasStore = create((set, get) => ({
439451
// it's important to create a new object here, to inform React Flow about the cahnges
440452
node.data = {
441453
...node.data,
442-
value,
454+
variable: {
455+
...node.data.variable,
456+
value,
457+
},
443458
};
444459
}
445460

0 commit comments

Comments
 (0)