diff --git a/ui/src/components/PipelineEditor/IOListPane.js b/ui/src/components/PipelineEditor/IOListPane.js index 5b997b57d..469732dae 100644 --- a/ui/src/components/PipelineEditor/IOListPane.js +++ b/ui/src/components/PipelineEditor/IOListPane.js @@ -15,6 +15,7 @@ export const IOListPane = ({ editSession }) => { const [collapsedPane, setCollapsedPane] = useState(true); + console.log("IOListPane", inputList, outputList, selectedNodes); return (
setCollapsedPane(!collapsedPane)}> diff --git a/ui/src/components/PipelineEditor/PipelineEditor.js b/ui/src/components/PipelineEditor/PipelineEditor.js index 27d49e27c..4325894ff 100644 --- a/ui/src/components/PipelineEditor/PipelineEditor.js +++ b/ui/src/components/PipelineEditor/PipelineEditor.js @@ -324,22 +324,24 @@ export default function PipelineEditor(props) { (allNodes, allEdges) => { if (allNodes.length === 0) return - + console.log('in refreshInputList') setInputList((previousInputs) => { let newUserInputs = []; - + allNodes.forEach((node) => { if (node.data) { + console.log('in refreshInputList node: ',node) if (node.type === "userInput") { + console.log('in refreshInputList userInput: ',node) const previousInput = previousInputs.find( (prev) => prev.nodeId === node.id ); - // The label and description of previous inputs might have been modified, so we keep them as is. if (previousInput) { newUserInputs.push(previousInput); } else { // No existing input, add a new one + console.log('in refreshInputList, no existing input, add a new one: ',node) let toAdd = { label: "Label missing", description: "Description missing", @@ -412,7 +414,7 @@ export default function PipelineEditor(props) { } } }); - + console.log('newUserInputs: ',newUserInputs) return newUserInputs; }); }, @@ -437,10 +439,11 @@ export default function PipelineEditor(props) { let newPipelineOutputs = []; allNodes.forEach((node) => { if (node.type === "output") { - const connectedEdges = getConnectedEdges([node], edges); + const outputNodeId = node.id; + const connectedEdges = getConnectedEdges([node], edges); //returns all edges connected to the output node connectedEdges.forEach((edge) => { - const sourceNode = allNodes.find((n) => n.id === edge.source); // Always 1 - + const sourceNode = allNodes.find((n) => n.id === edge.source); // Always 1, you get the source node + console.log('edge: ',edge) // outputDescription may be null if stepDescription not yet available. // This is ok when loading since we rely on the saved description anyways. const stepDescription = getStepDescription( @@ -451,12 +454,59 @@ export default function PipelineEditor(props) { stepDescription.outputs && stepDescription.outputs[edge.sourceHandle]; - newPipelineOutputs.push({ - ...outputDescription, // shallow clone - nodeId: edge.source, - outputId: edge.sourceHandle, - file: sourceNode.data.descriptionFile, - }); + if (outputDescription === undefined) { + let newNode = {}; + if (sourceNode.type === 'userInput') { + // look for node in inputList + console.log('userInput: ',sourceNode) + const input = inputList.find((input) => input.nodeId === sourceNode.id); + console.log('input: ',input) + newNode = { + description: input.description, + label: input.label, + example: input.example, + nodeId: getStepNodeId(outputNodeId), + outputId: getStepOutput(outputNodeId), + file: sourceNode.data.descriptionFile, + } + newPipelineOutputs.push(newNode); + } + + else if (sourceNode.type === 'constant') { // change this to 'else if' + console.log('constant: ',sourceNode) + newNode = { + description: 'A constant has no description', + label: 'a constant has no label', + type: sourceNode.data.type, + example: sourceNode.data.value, + nodeId: getStepNodeId(outputNodeId), + outputId: getStepOutput(outputNodeId), + // nodeId: edge.source, + // outputId: edge.sourceHandle, + file: sourceNode.data.descriptionFile, + } + newPipelineOutputs.push(newNode); + } + + const updateOutputList = outputList.map((output) => { + return ( + (output.nodeId === getStepNodeId(outputNodeId) && output.outputId === getStepOutput(outputNodeId)) + ? newNode + : output + ); + }); + console.log('updateOutputList: ',updateOutputList) + setOutputList(updateOutputList); + } + else { + newPipelineOutputs.push({ + ...outputDescription, // shallow clone + nodeId: edge.source, + outputId: edge.sourceHandle, + file: sourceNode.data.descriptionFile, + }); + } + }); } }); @@ -468,13 +518,21 @@ export default function PipelineEditor(props) { prev.nodeId === newOutput.nodeId && prev.outputId === newOutput.outputId ); + console.log('previousOutput: ',previousOutput) // The label and description of previous outputs might have been modified, so we keep them as is. return previousOutput && previousOutput.label ? previousOutput : newOutput; }) ); - }, [edges, reactFlowInstance, setOutputList]); + }, [edges, reactFlowInstance, setOutputList, inputList]); + + + const refreshOutputListOnInputNodeChange = useCallback(() => { + if (!reactFlowInstance) + return + + }, [edges, nodes]) const onLayout = useCallback(() => { layoutElements(