TG-523: Different style for subpipelines.

GEO-BON · Aug 2, 2023 · 11e2abb · 11e2abb
1 parent 92cfdee
commit 11e2abb
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 1 deletion.
diff --git a/ui/src/components/PipelineEditor/Editor.css b/ui/src/components/PipelineEditor/Editor.css
@@ -119,6 +119,11 @@ aside.scriptChooser .description {
   border-style: solid;
 }
 
+.ioNode.pipeline {
+  border-style: double;
+  border-width: 5px;
+}
+
 .ioNode:hover,
 .constant:hover,
 .userInput:hover,
@@ -177,6 +182,10 @@ aside.scriptChooser .description {
   margin-right: 3px;
 }
 
+.ioNode.pipeline .inputs .react-flow__handle-left {
+  margin-left: -9px;
+}
+
 .outputs {
   text-align: right;
 }
@@ -186,6 +195,10 @@ aside.scriptChooser .description {
   margin-right: -7px;
 }
 
+.ioNode.pipeline .outputs .react-flow__handle-right {
+  margin-right: -9px;
+}
+
 .inputs div:hover,
 .outputs div:hover {
   text-shadow: 0px 0px 1px black;

diff --git a/ui/src/components/PipelineEditor/IONode.js b/ui/src/components/PipelineEditor/IONode.js
@@ -31,7 +31,9 @@ export default function IONode({ id, data }) {
   }
 
   if (!metadata) return null
-  return <table className='ioNode'><tbody>
+
+  let divClass = /\.json$/i.test(descriptionFileLocation) ? 'pipeline' : 'script'
+  return <table className={`ioNode ${divClass}`}><tbody>
     <tr>
       <td className='inputs'>
         {metadata.inputs && Object.entries(metadata.inputs).map(([inputName, desc]) => {