Skip to content

Commit be0ad85

Browse files
camielvscamielvs
committed
Add Input Id and Output Id conversions
1 parent 392ebb1 commit be0ad85

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 (nodeType === "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 (nodeType === "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
@@ -15,18 +15,18 @@ import {
1515
type TaskOutputArgument,
1616
type TaskSpec,
1717
} from "@/utils/componentSpec";
18-
import { createInputNode } from "@/utils/nodes/createInputNode";
19-
import { createOutputNode } from "@/utils/nodes/createOutputNode";
20-
import { createTaskNode } from "@/utils/nodes/createTaskNode";
21-
import { getNodesBounds } from "@/utils/nodes/getNodesBounds";
2218
import {
2319
inputNameToNodeId,
2420
nodeIdToInputName,
2521
nodeIdToOutputName,
2622
nodeIdToTaskId,
2723
outputNameToNodeId,
2824
taskIdToNodeId,
29-
} from "@/utils/nodes/nodeIdUtils";
25+
} from "@/utils/nodes/conversions";
26+
import { createInputNode } from "@/utils/nodes/createInputNode";
27+
import { createOutputNode } from "@/utils/nodes/createOutputNode";
28+
import { createTaskNode } from "@/utils/nodes/createTaskNode";
29+
import { getNodesBounds } from "@/utils/nodes/getNodesBounds";
3030
import { setPositionInAnnotations } from "@/utils/nodes/setPositionInAnnotations";
3131
import { convertTaskCallbacksToNodeCallbacks } from "@/utils/nodes/taskCallbackUtils";
3232
import {
@@ -107,9 +107,8 @@ export const duplicateNodes = (
107107
(input) => input.name === node.data.label,
108108
);
109109

110-
const newInputId = getUniqueInputName(componentSpec, inputSpec?.name);
111-
112-
const newNodeId = inputNameToNodeId(newInputId);
110+
const newInputName = getUniqueInputName(componentSpec, inputSpec?.name);
111+
const newNodeId = inputNameToNodeId(newInputName);
113112

114113
nodeIdMap[oldNodeId] = newNodeId;
115114

@@ -122,19 +121,21 @@ export const duplicateNodes = (
122121

123122
const newInputSpec = {
124123
...inputSpec,
125-
name: newInputId,
124+
name: newInputName,
126125
annotations: updatedAnnotations,
127126
};
128127

129-
newInputs[newInputId] = newInputSpec;
128+
newInputs[newInputName] = newInputSpec;
130129
} else if (isOutputNode(node)) {
131130
const outputSpec = componentSpec.outputs?.find(
132131
(output) => output.name === node.data.label,
133132
);
134133

135-
const newOutputId = getUniqueOutputName(componentSpec, outputSpec?.name);
136-
137-
const newNodeId = outputNameToNodeId(newOutputId);
134+
const newOutputName = getUniqueOutputName(
135+
componentSpec,
136+
outputSpec?.name,
137+
);
138+
const newNodeId = outputNameToNodeId(newOutputName);
138139

139140
nodeIdMap[oldNodeId] = newNodeId;
140141

@@ -147,11 +148,11 @@ export const duplicateNodes = (
147148

148149
const newOutputSpec = {
149150
...outputSpec,
150-
name: newOutputId,
151+
name: newOutputName,
151152
annotations: updatedAnnotations,
152153
};
153154

154-
newOutputs[newOutputId] = newOutputSpec;
155+
newOutputs[newOutputName] = newOutputSpec;
155156
}
156157
});
157158

@@ -197,8 +198,8 @@ export const duplicateNodes = (
197198
if (connection !== "none") {
198199
/* Reconfigure Outputs */
199200
Object.entries(newOutputs).forEach((output) => {
200-
const [outputId] = output;
201-
const newNodeId = outputNameToNodeId(outputId);
201+
const [outputName] = output;
202+
const newNodeId = outputNameToNodeId(outputName);
202203
const oldNodeId = Object.keys(nodeIdMap).find(
203204
(key) => nodeIdMap[key] === newNodeId,
204205
);
@@ -207,13 +208,13 @@ export const duplicateNodes = (
207208
return;
208209
}
209210

210-
const oldOutputId = nodeIdToOutputName(oldNodeId);
211+
const oldOutputName = nodeIdToOutputName(oldNodeId);
211212

212213
if (!graphSpec.outputValues) {
213214
return;
214215
}
215216

216-
const outputValue = graphSpec.outputValues[oldOutputId];
217+
const outputValue = graphSpec.outputValues[oldOutputName];
217218

218219
if (!outputValue) {
219220
return;
@@ -248,7 +249,7 @@ export const duplicateNodes = (
248249
(!isInternal && connection === "external") ||
249250
connection === "all"
250251
) {
251-
updatedGraphOutputs[outputId] = updatedOutputValue;
252+
updatedGraphOutputs[outputName] = updatedOutputValue;
252253
}
253254
});
254255
}
@@ -313,9 +314,9 @@ export const duplicateNodes = (
313314

314315
return newNode;
315316
} else if (isInputNode(originalNode)) {
316-
const newInputId = nodeIdToInputName(newNodeId);
317+
const newInputName = nodeIdToInputName(newNodeId);
317318
const newInputSpec = updatedInputs.find(
318-
(input) => input.name === newInputId,
319+
(input) => input.name === newInputName,
319320
);
320321

321322
if (!newInputSpec) {
@@ -343,9 +344,9 @@ export const duplicateNodes = (
343344

344345
return newNode;
345346
} else if (isOutputNode(originalNode)) {
346-
const newOutputId = nodeIdToOutputName(newNodeId);
347+
const newOutputName = nodeIdToOutputName(newNodeId);
347348
const newOutputSpec = updatedOutputs.find(
348-
(output) => output.name === newOutputId,
349+
(output) => output.name === newOutputName,
349350
);
350351

351352
if (!newOutputSpec) {
@@ -412,9 +413,11 @@ export const duplicateNodes = (
412413

413414
updatedGraphSpec.tasks[taskId] = newTaskSpec;
414415
} else if (isInputNode(node)) {
415-
const inputId = nodeIdToInputName(node.id);
416+
const newInputName = nodeIdToInputName(node.id);
416417

417-
const inputSpec = updatedInputs.find((input) => input.name === inputId);
418+
const inputSpec = updatedInputs.find(
419+
(input) => input.name === newInputName,
420+
);
418421

419422
if (!inputSpec) {
420423
return;
@@ -433,17 +436,17 @@ export const duplicateNodes = (
433436
};
434437

435438
const updatedInputIndex = updatedInputs.findIndex(
436-
(input) => input.name === inputId,
439+
(input) => input.name === newInputName,
437440
);
438441

439442
if (updatedInputIndex !== -1) {
440443
updatedInputs[updatedInputIndex] = newInputSpec;
441444
}
442445
} else if (isOutputNode(node)) {
443-
const outputId = nodeIdToOutputName(node.id);
446+
const newOutputName = nodeIdToOutputName(node.id);
444447

445448
const outputSpec = updatedOutputs.find(
446-
(output) => output.name === outputId,
449+
(output) => output.name === newOutputName,
447450
);
448451

449452
if (!outputSpec) {
@@ -463,7 +466,7 @@ export const duplicateNodes = (
463466
};
464467

465468
const updatedOutputIndex = updatedOutputs.findIndex(
466-
(output) => output.name === outputId,
469+
(output) => output.name === newOutputName,
467470
);
468471

469472
if (updatedOutputIndex !== -1) {
@@ -522,25 +525,25 @@ function reconfigureConnections(
522525

523526
newArgId = newTaskId;
524527
} else if ("graphInput" in argument) {
525-
const oldInputId = argument.graphInput.inputName;
526-
oldNodeId = inputNameToNodeId(oldInputId);
528+
const oldInputName = argument.graphInput.inputName;
529+
oldNodeId = inputNameToNodeId(oldInputName);
527530

528531
if (!("inputs" in componentSpec)) {
529532
throw new Error("ComponentSpec does not contain inputs.");
530533
}
531534

532535
const inputs = componentSpec.inputs || [];
533-
isExternal = inputs.some((input) => input.name === oldInputId);
536+
isExternal = inputs.some((input) => input.name === oldInputName);
534537

535538
const newNodeId = nodeIdMap[oldNodeId];
536539

537540
if (!newNodeId) {
538541
return reconfigureExternalConnection(taskSpec, argKey, mode);
539542
}
540543

541-
const newInputId = nodeIdToInputName(newNodeId);
544+
const newInputName = nodeIdToInputName(newNodeId);
542545

543-
newArgId = newInputId;
546+
newArgId = newInputName;
544547
}
545548

546549
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)