Skip to content

Commit df64fb9

Browse files
camielvscamielvs
committed
Add Input Id and Output Id conversions
1 parent 434fc29 commit df64fb9

File tree

20 files changed

+88
-169
lines changed

20 files changed

+88
-169
lines changed

‎src/components/Editor/IOEditor/InputValueEditor/InputValueEditor.tsx‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ import { useComponentSpec } from "@/providers/ComponentSpecProvider";
1515
import { useContextPanel } from "@/providers/ContextPanelProvider";
1616
import { type InputSpec } from "@/utils/componentSpec";
1717
import { checkInputConnectionToRequiredFields } from "@/utils/inputConnectionUtils";
18-
import { inputNameToNodeId } from "@/utils/nodes/nodeIdUtils";
18+
import { inputNameToNodeId } from "@/utils/nodes/conversions";
1919

2020
import { NameField, TextField, TypeField } from "./FormFields/FormFields";
2121
import { checkNameCollision } from "./FormFields/utils";
@@ -31,6 +31,7 @@ export const InputValueEditor = ({
3131
disabled = false,
3232
}: InputValueEditorProps) => {
3333
const notify = useToastNotification();
34+
3435
const { transferSelection } = useNodeSelectionTransfer(inputNameToNodeId);
3536
const { componentSpec, setComponentSpec } = useComponentSpec();
3637
const { clearContent } = useContextPanel();

‎src/components/Editor/IOEditor/OutputNameEditor/OutputNameEditor.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import { useNodeSelectionTransfer } from "@/hooks/useNodeSelectionTransfer";
1111
import { useComponentSpec } from "@/providers/ComponentSpecProvider";
1212
import { useContextPanel } from "@/providers/ContextPanelProvider";
1313
import { type OutputSpec } from "@/utils/componentSpec";
14-
import { outputNameToNodeId } from "@/utils/nodes/nodeIdUtils";
14+
import { outputNameToNodeId } from "@/utils/nodes/conversions";
1515

1616
import { type OutputConnectedDetails } from "../../utils/getOutputConnectedDetails";
1717
import { updateOutputNameOnComponentSpec } from "../../utils/updateOutputNameOnComponentSpec";

‎src/components/shared/ReactFlow/FlowCanvas/TaskNode/TaskNodeCard/TaskNodeInputs.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import { useTaskNode } from "@/providers/TaskNodeProvider";
1010
import { inputsWithInvalidArguments } from "@/services/componentService";
1111
import type { InputSpec } from "@/utils/componentSpec";
1212
import { ComponentSearchFilter } from "@/utils/constants";
13-
import { inputNameToNodeId } from "@/utils/nodes/nodeIdUtils";
13+
import { inputNameToNodeId } from "@/utils/nodes/conversions";
1414
import { checkArtifactMatchesSearchFilters } from "@/utils/searchUtils";
1515

1616
import { InputHandle } from "./Handles";

‎src/components/shared/ReactFlow/FlowCanvas/TaskNode/TaskNodeCard/TaskNodeOutputs.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { isValidFilterRequest } from "@/providers/ComponentLibraryProvider/types
77
import { useTaskNode } from "@/providers/TaskNodeProvider";
88
import type { OutputSpec } from "@/utils/componentSpec";
99
import { ComponentSearchFilter } from "@/utils/constants";
10-
import { outputNameToNodeId } from "@/utils/nodes/nodeIdUtils";
10+
import { outputNameToNodeId } from "@/utils/nodes/conversions";
1111
import { checkArtifactMatchesSearchFilters } from "@/utils/searchUtils";
1212

1313
import { OutputHandle } from "./Handles";

‎src/components/shared/ReactFlow/FlowCanvas/utils/addAndConnectNode.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import {
1212
nodeIdToTaskId,
1313
outputNameToNodeId,
1414
taskIdToNodeId,
15-
} from "@/utils/nodes/nodeIdUtils";
15+
} from "@/utils/nodes/conversions";
1616

1717
import addTask from "./addTask";
1818
import { handleConnection } from "./handleConnection";

‎src/components/shared/ReactFlow/FlowCanvas/utils/addTask.ts‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -79,9 +79,9 @@ const addTask = (
7979
}
8080

8181
if (taskType === "input") {
82-
const inputId = getUniqueInputName(newComponentSpec);
82+
const inputName = getUniqueInputName(newComponentSpec);
8383
const inputSpec: InputSpec = {
84-
name: inputId,
84+
name: inputName,
8585
annotations: positionAnnotations,
8686
};
8787
const inputs = (newComponentSpec.inputs ?? []).concat([inputSpec]);
@@ -90,9 +90,9 @@ const addTask = (
9090
}
9191

9292
if (taskType === "output") {
93-
const outputId = getUniqueOutputName(newComponentSpec);
93+
const outputName = getUniqueOutputName(newComponentSpec);
9494
const outputSpec: OutputSpec = {
95-
name: outputId,
95+
name: outputName,
9696
annotations: positionAnnotations,
9797
};
9898

‎src/components/shared/ReactFlow/FlowCanvas/utils/duplicateNodes.test.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import {
1313
inputNameToNodeId,
1414
outputNameToNodeId,
1515
taskIdToNodeId,
16-
} from "@/utils/nodes/nodeIdUtils";
16+
} from "@/utils/nodes/conversions";
1717

1818
import { duplicateNodes } from "./duplicateNodes";
1919

‎src/components/shared/ReactFlow/FlowCanvas/utils/duplicateNodes.ts‎

Lines changed: 38 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -10,18 +10,18 @@ import {
1010
type TaskOutputArgument,
1111
type TaskSpec,
1212
} from "@/utils/componentSpec";
13-
import { createInputNode } from "@/utils/nodes/createInputNode";
14-
import { createOutputNode } from "@/utils/nodes/createOutputNode";
15-
import { createTaskNode } from "@/utils/nodes/createTaskNode";
16-
import { getNodesBounds } from "@/utils/nodes/getNodesBounds";
1713
import {
1814
inputNameToNodeId,
1915
nodeIdToInputName,
2016
nodeIdToOutputName,
2117
nodeIdToTaskId,
2218
outputNameToNodeId,
2319
taskIdToNodeId,
24-
} from "@/utils/nodes/nodeIdUtils";
20+
} from "@/utils/nodes/conversions";
21+
import { createInputNode } from "@/utils/nodes/createInputNode";
22+
import { createOutputNode } from "@/utils/nodes/createOutputNode";
23+
import { createTaskNode } from "@/utils/nodes/createTaskNode";
24+
import { getNodesBounds } from "@/utils/nodes/getNodesBounds";
2525
import { setPositionInAnnotations } from "@/utils/nodes/setPositionInAnnotations";
2626
import { convertTaskCallbacksToNodeCallbacks } from "@/utils/nodes/taskCallbackUtils";
2727
import {
@@ -102,9 +102,8 @@ export const duplicateNodes = (
102102
(input) => input.name === node.data.label,
103103
);
104104

105-
const newInputId = getUniqueInputName(componentSpec, inputSpec?.name);
106-
107-
const newNodeId = inputNameToNodeId(newInputId);
105+
const newInputName = getUniqueInputName(componentSpec, inputSpec?.name);
106+
const newNodeId = inputNameToNodeId(newInputName);
108107

109108
nodeIdMap[oldNodeId] = newNodeId;
110109

@@ -117,19 +116,21 @@ export const duplicateNodes = (
117116

118117
const newInputSpec = {
119118
...inputSpec,
120-
name: newInputId,
119+
name: newInputName,
121120
annotations: updatedAnnotations,
122121
};
123122

124-
newInputs[newInputId] = newInputSpec;
123+
newInputs[newInputName] = newInputSpec;
125124
} else if (node.type === "output") {
126125
const outputSpec = componentSpec.outputs?.find(
127126
(output) => output.name === node.data.label,
128127
);
129128

130-
const newOutputId = getUniqueOutputName(componentSpec, outputSpec?.name);
131-
132-
const newNodeId = outputNameToNodeId(newOutputId);
129+
const newOutputName = getUniqueOutputName(
130+
componentSpec,
131+
outputSpec?.name,
132+
);
133+
const newNodeId = outputNameToNodeId(newOutputName);
133134

134135
nodeIdMap[oldNodeId] = newNodeId;
135136

@@ -142,11 +143,11 @@ export const duplicateNodes = (
142143

143144
const newOutputSpec = {
144145
...outputSpec,
145-
name: newOutputId,
146+
name: newOutputName,
146147
annotations: updatedAnnotations,
147148
};
148149

149-
newOutputs[newOutputId] = newOutputSpec;
150+
newOutputs[newOutputName] = newOutputSpec;
150151
}
151152
});
152153

@@ -192,8 +193,8 @@ export const duplicateNodes = (
192193
if (connection !== "none") {
193194
/* Reconfigure Outputs */
194195
Object.entries(newOutputs).forEach((output) => {
195-
const [outputId] = output;
196-
const newNodeId = outputNameToNodeId(outputId);
196+
const [outputName] = output;
197+
const newNodeId = outputNameToNodeId(outputName);
197198
const oldNodeId = Object.keys(nodeIdMap).find(
198199
(key) => nodeIdMap[key] === newNodeId,
199200
);
@@ -202,13 +203,13 @@ export const duplicateNodes = (
202203
return;
203204
}
204205

205-
const oldOutputId = nodeIdToOutputName(oldNodeId);
206+
const oldOutputName = nodeIdToOutputName(oldNodeId);
206207

207208
if (!graphSpec.outputValues) {
208209
return;
209210
}
210211

211-
const outputValue = graphSpec.outputValues[oldOutputId];
212+
const outputValue = graphSpec.outputValues[oldOutputName];
212213

213214
if (!outputValue) {
214215
return;
@@ -243,7 +244,7 @@ export const duplicateNodes = (
243244
(!isInternal && connection === "external") ||
244245
connection === "all"
245246
) {
246-
updatedGraphOutputs[outputId] = updatedOutputValue;
247+
updatedGraphOutputs[outputName] = updatedOutputValue;
247248
}
248249
});
249250
}
@@ -307,9 +308,9 @@ export const duplicateNodes = (
307308

308309
return newNode;
309310
} else if (originalNode.type === "input") {
310-
const newInputId = nodeIdToInputName(newNodeId);
311+
const newInputName = nodeIdToInputName(newNodeId);
311312
const newInputSpec = updatedInputs.find(
312-
(input) => input.name === newInputId,
313+
(input) => input.name === newInputName,
313314
);
314315

315316
if (!newInputSpec) {
@@ -338,9 +339,9 @@ export const duplicateNodes = (
338339

339340
return newNode;
340341
} else if (originalNode.type === "output") {
341-
const newOutputId = nodeIdToOutputName(newNodeId);
342+
const newOutputName = nodeIdToOutputName(newNodeId);
342343
const newOutputSpec = updatedOutputs.find(
343-
(output) => output.name === newOutputId,
344+
(output) => output.name === newOutputName,
344345
);
345346

346347
if (!newOutputSpec) {
@@ -408,9 +409,11 @@ export const duplicateNodes = (
408409

409410
updatedGraphSpec.tasks[taskId] = newTaskSpec;
410411
} else if (node.type === "input") {
411-
const inputId = nodeIdToInputName(node.id);
412+
const newInputName = nodeIdToInputName(node.id);
412413

413-
const inputSpec = updatedInputs.find((input) => input.name === inputId);
414+
const inputSpec = updatedInputs.find(
415+
(input) => input.name === newInputName,
416+
);
414417

415418
if (!inputSpec) {
416419
return;
@@ -429,17 +432,17 @@ export const duplicateNodes = (
429432
};
430433

431434
const updatedInputIndex = updatedInputs.findIndex(
432-
(input) => input.name === inputId,
435+
(input) => input.name === newInputName,
433436
);
434437

435438
if (updatedInputIndex !== -1) {
436439
updatedInputs[updatedInputIndex] = newInputSpec;
437440
}
438441
} else if (node.type === "output") {
439-
const outputId = nodeIdToOutputName(node.id);
442+
const newOutputName = nodeIdToOutputName(node.id);
440443

441444
const outputSpec = updatedOutputs.find(
442-
(output) => output.name === outputId,
445+
(output) => output.name === newOutputName,
443446
);
444447

445448
if (!outputSpec) {
@@ -459,7 +462,7 @@ export const duplicateNodes = (
459462
};
460463

461464
const updatedOutputIndex = updatedOutputs.findIndex(
462-
(output) => output.name === outputId,
465+
(output) => output.name === newOutputName,
463466
);
464467

465468
if (updatedOutputIndex !== -1) {
@@ -518,25 +521,25 @@ function reconfigureConnections(
518521

519522
newArgId = newTaskId;
520523
} else if ("graphInput" in argument) {
521-
const oldInputId = argument.graphInput.inputName;
522-
oldNodeId = inputNameToNodeId(oldInputId);
524+
const oldInputName = argument.graphInput.inputName;
525+
oldNodeId = inputNameToNodeId(oldInputName);
523526

524527
if (!("inputs" in componentSpec)) {
525528
throw new Error("ComponentSpec does not contain inputs.");
526529
}
527530

528531
const inputs = componentSpec.inputs || [];
529-
isExternal = inputs.some((input) => input.name === oldInputId);
532+
isExternal = inputs.some((input) => input.name === oldInputName);
530533

531534
const newNodeId = nodeIdMap[oldNodeId];
532535

533536
if (!newNodeId) {
534537
return reconfigureExternalConnection(taskSpec, argKey, mode);
535538
}
536539

537-
const newInputId = nodeIdToInputName(newNodeId);
540+
const newInputName = nodeIdToInputName(newNodeId);
538541

539-
newArgId = newInputId;
542+
newArgId = newInputName;
540543
}
541544

542545
if (!newArgId) {

‎src/components/shared/ReactFlow/FlowCanvas/utils/handleConnection.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import {
99
nodeIdToInputName,
1010
nodeIdToOutputName,
1111
nodeIdToTaskId,
12-
} from "@/utils/nodes/nodeIdUtils";
12+
} from "@/utils/nodes/conversions";
1313

1414
import { setGraphOutputValue } from "./setGraphOutputValue";
1515
import { setTaskArgument } from "./setTaskArgument";

‎src/components/shared/ReactFlow/FlowCanvas/utils/removeEdge.ts‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
11
import type { Edge } from "@xyflow/react";
22

33
import type { ComponentSpec, GraphImplementation } from "@/utils/componentSpec";
4-
import { nodeIdToOutputName, nodeIdToTaskId } from "@/utils/nodes/nodeIdUtils";
4+
import {
5+
nodeIdToInputName,
6+
nodeIdToOutputName,
7+
nodeIdToTaskId,
8+
} from "@/utils/nodes/conversions";
59

610
import { setGraphOutputValue } from "./setGraphOutputValue";
711
import { setTaskArgument } from "./setTaskArgument";
@@ -10,7 +14,11 @@ export const removeEdge = (edge: Edge, componentSpec: ComponentSpec) => {
1014
const graphSpec = (componentSpec.implementation as GraphImplementation)
1115
?.graph;
1216

13-
const inputName = edge.targetHandle?.replace(/^input_/, "");
17+
if (!edge.targetHandle) {
18+
return componentSpec;
19+
}
20+
21+
const inputName = nodeIdToInputName(edge.targetHandle);
1422

1523
const updatedComponentSpec = {
1624
...componentSpec,

0 commit comments

Comments
 (0)