updated pipelineEditor

GEO-BON · Nov 22, 2023 · bdce476 · bdce476
1 parent 30fc263
commit bdce476
Show file tree

Hide file tree

Showing 2 changed files with 73 additions and 14 deletions.
diff --git 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 (
     <div className={`rightPane ioList ${collapsedPane ? "paneCollapsed" : "paneOpen"}`}>
       <div className="collapseTab" onClick={() => setCollapsedPane(!collapsedPane)}>

diff --git 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(