Fixed the paramChange Issue and finally done with the rendering issue of Subflow

frontend/src/components/ShuffleCodeEditor1.jsx

@@ -109,6 +109,7 @@ const CodeEditor = (props) => {
 		setActiveDialog,
 		fieldname,
 		contentLoading,
+		selectedTrigger,
 	} = props
 
 	const [localcodedata, setlocalcodedata] = React.useState(codedata === undefined || codedata === null || codedata.length === 0 ? "" : codedata);
@@ -436,7 +437,8 @@ const CodeEditor = (props) => {
 	}
 
 	const autoFormat = (input) => {
-		// Check if it's default too
+		if(selectedAction && selectedAction.parameters && selectedAction.parameters.length > 0){
+				// Check if it's default too
 		if (validation !== true) {
 
 			// Should try to automatically fix this input
@@ -475,6 +477,48 @@ const CodeEditor = (props) => {
 		if (input !== localcodedata) {
 			setlocalcodedata(input)
 		}
+		}
+
+		if(selectedTrigger && selectedTrigger.parameters && selectedTrigger.parameters.length > 0){
+			if (validation !== true) {
+
+				// Should try to automatically fix this input
+				console.log("Running AI input fixer")
+				if (aiSubmit !== undefined && parameterName !== undefined && selectedTrigger !== undefined) {
+	
+					// Should remove params from selectedAction that aren't parameterName  
+					var tmpAction = JSON.parse(JSON.stringify(selectedTrigger))
+					var tmpParams = selectedTrigger.parameters.filter((param) => param.name === parameterName)
+	
+					var aiMsg = `Make it valid for trigger ${tmpAction.label} with parameter ${parameterName}: `
+					if (tmpParams.length > 0) {
+						aiMsg += tmpParams[0].value
+					}
+	
+	
+					if (localcodedata.startsWith("//")) {
+						aiMsg = localcodedata
+					}
+	
+					tmpAction.parameters = tmpParams
+					console.log("Parameters: ", tmpParams.length)
+	
+					aiSubmit(aiMsg, tmpAction)
+				}
+	
+				return
+			}
+	
+			try {
+				input = JSON.stringify(JSON.parse(input), null, 4)
+			} catch (e) {
+				console.log("Failed magic JSON stringification: ", e)
+			}
+	
+			if (input !== localcodedata) {
+				setlocalcodedata(input)
+			}
+		}
 	}
 
 	const findIndex = (line, loc) => {
@@ -1767,7 +1811,6 @@ const CodeEditor = (props) => {
 						// This is to make it so we don't need to handle these fixes on the
 						// backend by itself
 						var fixedcodedata = localcodedata
-						console.log("Fixedcodedata: ", fixedcodedata)
 						const valid = validateJson(localcodedata, true)
 						if (valid.valid) {
 							fixedcodedata = JSON.stringify(valid.result, null, 2)
@@ -1780,11 +1823,6 @@ const CodeEditor = (props) => {
 							setcodedata(fixedcodedata);
 							setExpansionModalOpen(false)
 						} else if (changeActionParameterCodeMirror !== undefined) { 
-							console.log("Entering in Submit onCLick")
-							console.log("Data passing to chnageActionParameterCodeMirror: ", fixedcodedata)
-							console.log("Fieldcount: ", fieldCount)
-							console.log("Actionlist: ", actionlist)
-							console.log("Event: ", event)
 							//changeActionParameterCodeMirror(event, fieldCount, fixedcodedata)
 							changeActionParameterCodeMirror(event, fieldCount, fixedcodedata, actionlist)
 							setExpansionModalOpen(false)
@@ -1808,4 +1846,4 @@ const CodeEditor = (props) => {
 		</Dialog>)
 }
 
-export default CodeEditor;
+export default CodeEditor;

frontend/src/views/AngularWorkflow.jsx

@@ -1,5 +1,5 @@
 /* eslint-disable react/no-multi-comp */
-import React, { useState, useEffect, useLayoutEffect, memo, useMemo, useRef } from "react";
+import React, { useState, useEffect, useLayoutEffect } from "react";
 import ReactDOM from "react-dom"
 
 import theme from "../theme.jsx";
@@ -922,14 +922,8 @@ const releaseToConnectLabel = "Release to Connect"
 
       setSubflowActionlist(newActionList);
 
-  },[selectedTrigger, workflowExecutions]);
+  },[selectedTrigger, workflowExecutions, workflow.workflow_variables, workflow.execution_variables, workflow.branches,workflow]);
-
+  
-
-  useEffect(() => {
-    if(selectedTrigger.parameters !== undefined && selectedTrigger.parameters.length > 1){
-    setSubflowExec(selectedTrigger?.parameters[1]?.value)
-    }
-  },[selectedTrigger,selectedTriggerIndex,subflowActionList]);
 
   const [executionArgumentModalOpen, setExecutionArgumentModalOpen] = React.useState(false);
 
@@ -4671,7 +4665,6 @@ const releaseToConnectLabel = "Release to Connect"
 	}
 
 
-  console.log("Selected Trigger: ", selectedTrigger)
   // Nodeselectbatching:
   // https://stackoverflow.com/questions/16677856/cy-onselect-callback-only-once
   // onNodeClick
@@ -4686,8 +4679,6 @@ const releaseToConnectLabel = "Release to Connect"
       if ((data.parameters !== undefined) && (data?.parameters?.length > 0)) {
         getWorkflowApps(data.parameters[0].value)
       }
-      console.log("data", data)
-      // setSubflowExec(data?.parameters[1]?.value)
     }
 
 	if (data.buttonType == "ACTIONSUGGESTION") {
@@ -12976,9 +12967,14 @@ const releaseToConnectLabel = "Release to Connect"
 
         if (selectedTrigger.name === "Shuffle Workflow") {
           const toComplete = selectedTrigger.parameters[1].value + "$" + values[0].autocomplete
-          selectedTrigger.parameters[1].value = toComplete
+          // selectedTrigger.parameters[1].value = toComplete
-          // setSubflowExec(selectedTrigger.parameters[1].value)
+          workflow.triggers[selectedTriggerIndex].parameters[1].value = toComplete
-          setSelectedTrigger(selectedTrigger)
+          const foundfield = document.getElementById("subflow_field")
+							if (foundfield !== undefined && foundfield !== null) {
+								foundfield.value = toComplete
+							}
+          // setSelectedTrigger(selectedTrigger)
+          // setSubflowExec(toComplete)
           setWorkflow(workflow)
         }
 
@@ -12987,16 +12983,6 @@ const releaseToConnectLabel = "Release to Connect"
         setMenuPosition(null);
     };
 
-    const handleSubflowExecChange = (e) => {
-        setSubflowExec(e.target.value)
-        // if(selectedTrigger.length > 0){
-        //   selectedTrigger.parameters[1].value = e.target.value
-        //   setSelectedTrigger(selectedTrigger)
-        //   setWorkflow(workflow)
-        //   setLastSaved(false)
-        // }
-    }
-
    const SubflowSidebar =  Object.getOwnPropertyNames(selectedTrigger).length === 0 || workflow.triggers[selectedTriggerIndex] === undefined || selectedTrigger.trigger_type !== "SUBFLOW" ? null :
         <div style={appApiViewStyle}>
 		  <span style={{display: "flex", }}>
@@ -13287,6 +13273,7 @@ const releaseToConnectLabel = "Release to Connect"
 									value: data
 								}
 							})
+              document.activeElement.blur();
 						  }}
                         >
 						  <PolylineIcon style={{ marginRight: 8 }} />
@@ -13302,11 +13289,6 @@ const releaseToConnectLabel = "Release to Connect"
                           backgroundColor: theme.palette.inputColor,
                           borderRadius: theme.palette.borderRadius,
                         }}
-                        sx={{
-                          '& .MuiInputLabel-root': {
-                            transition: 'none', // Disable the animation for the label
-                          },
-                        }}
                         {...params}
                         label="Find your workflow"
                         variant="outlined"
@@ -13414,11 +13396,6 @@ const releaseToConnectLabel = "Release to Connect"
                             backgroundColor: theme.palette.inputColor,
                             borderRadius: theme.palette.borderRadius,
                           }}
-                          sx={{
-                            '& .MuiInputLabel-root': {
-                              transition: 'none', // Disable the animation for the label
-                            },
-                          }}
                           {...params}
                           label="Select a start-node (optional)"
                           variant="outlined"
@@ -13481,7 +13458,7 @@ const releaseToConnectLabel = "Release to Connect"
                             }}
                           />
                         </Tooltip>
-                        <Tooltip title="Autocomplete text" placement="top">
+                        <Tooltip title="Autocomplete text" placement="bottom">
                           <AddCircleOutlineIcon
                             style={{ cursor: "pointer" }}
                             onClick={(event) => {
@@ -13503,23 +13480,15 @@ const releaseToConnectLabel = "Release to Connect"
                 fullWidth
                 color="primary"
                 placeholder="Some execution data"
-                // defaultValue={
+                defaultValue={
-                //   workflow?.triggers[selectedTriggerIndex]?.parameters[1]?.value
+                  workflow?.triggers[selectedTriggerIndex]?.parameters[1]?.value
-                // }
+                }
-                value={subflowExec}
+                onBlur={(e) => {
-                onChange={(e) => {
+                  workflow.triggers[selectedTriggerIndex].parameters[1].value = e.target.value
-                  // handleSubflowExecChange(e)
+                  setWorkflow(workflow)
-                  setSubflowExec(e.target.value)
+                  setLastSaved(false)
-                    // workflow.triggers[selectedTriggerIndex].parameters[1].value = e.target.value
-                    // setWorkflow(workflow)
 
                 }}
-              //   onBlur={(e) => {
-      			  // setLastSaved(false)
-
-              //     // workflow.triggers[selectedTriggerIndex].parameters[1].value = e.target.value
-              //     // setWorkflow(workflow)
-              //   }}
               />
               {!showDropdown ? null :
 							  <Menu
@@ -22098,7 +22067,7 @@ const releaseToConnectLabel = "Release to Connect"
 				fieldCount={editorData.field_number}
 				actionlist={editorData.actionlist}
 				fieldname={editorData.field_id}
-
+        selectedTrigger={selectedTrigger}
 				changeActionParameterCodeMirror={changeActionParameterCodeMirror}
         activeDialog={activeDialog}
         setActiveDialog={setActiveDialog}
@@ -22228,4 +22197,4 @@ const releaseToConnectLabel = "Release to Connect"
   );
 };
 
-export default AngularWorkflow;
+export default AngularWorkflow;