One of the final syncs before merges start happening for 2.0
This commit is contained in:
Frikky
@@ -1203,18 +1203,15 @@ const AngularWorkflow = (defaultprops) => {
|
||||
if (workflowExecutions.length > 0) {
|
||||
// Look for the ID
|
||||
for (let execkey in workflowExecutions) {
|
||||
if (
|
||||
workflowExecutions[execkey].results === undefined ||
|
||||
workflowExecutions[execkey].results === null
|
||||
) {
|
||||
continue;
|
||||
if (workflowExecutions[execkey].results === undefined || workflowExecutions[execkey].results === null) {
|
||||
continue
|
||||
}
|
||||
|
||||
var foundResult = workflowExecutions[execkey].results.find(
|
||||
(result) => result.action.id === item.id
|
||||
);
|
||||
)
|
||||
if (foundResult === undefined) {
|
||||
continue;
|
||||
continue
|
||||
}
|
||||
|
||||
const validated = validateJson(foundResult.result)
|
||||
@@ -4863,6 +4860,177 @@ const AngularWorkflow = (defaultprops) => {
|
||||
})
|
||||
};
|
||||
|
||||
// Check if it already has any non-decorator branches attached to it
|
||||
const findClosestNode = (event, nodedata) => {
|
||||
if (cy === undefined || cy === null) {
|
||||
console.log("Cy is undefined or null")
|
||||
return
|
||||
}
|
||||
|
||||
if (event === undefined || event === null) {
|
||||
console.log("Event is undefined or null")
|
||||
return
|
||||
}
|
||||
|
||||
if (event.target === undefined || event.target === null) {
|
||||
console.log("Event target is undefined or null")
|
||||
return
|
||||
}
|
||||
|
||||
if (!((nodedata?.trigger_type === "SUBFLOW" || nodedata?.trigger_type === "USERINPUT" || nodedata?.type === "ACTION") && !nodedata?.isStartNode)) {
|
||||
//console.log("Not a valid node to find closest node for")
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
if (nodedata.finished === false) {
|
||||
//console.log("Node is not finished")
|
||||
return
|
||||
}
|
||||
|
||||
const branches = cy.elements('edge').jsons()
|
||||
var branchFound = false
|
||||
var decoratorNodeIds = []
|
||||
var decoratorIds = []
|
||||
for (var branchkey in branches) {
|
||||
if (branches[branchkey].data.source === nodedata.id || branches[branchkey].data.target === nodedata.id) {
|
||||
decoratorIds.push(branches[branchkey].data.id)
|
||||
|
||||
if (branches[branchkey].data.decorator === true) {
|
||||
|
||||
// Add the source/destination
|
||||
if (branches[branchkey].data.source === nodedata.id) {
|
||||
decoratorNodeIds.push(branches[branchkey].data.target)
|
||||
} else {
|
||||
decoratorNodeIds.push(branches[branchkey].data.source)
|
||||
}
|
||||
|
||||
continue
|
||||
}
|
||||
|
||||
//branchFound = true
|
||||
//break
|
||||
}
|
||||
}
|
||||
|
||||
if (!branchFound) {
|
||||
var relevantNodes = []
|
||||
|
||||
const minDistance = 225
|
||||
const draggedNode = event.target
|
||||
const allnodes = cy.nodes().jsons()
|
||||
for (var nodekey in allnodes) {
|
||||
const node = allnodes[nodekey]
|
||||
if (node.data.id === nodedata.id) {
|
||||
continue
|
||||
}
|
||||
|
||||
// Decorators
|
||||
if (node.data.attachedTo !== undefined) {
|
||||
continue
|
||||
}
|
||||
|
||||
if (node.position === undefined || node.position === null || node.position.x === undefined || node.position.y === undefined) {
|
||||
continue
|
||||
}
|
||||
|
||||
if (node.data.type !== "ACTION" && node.data.type !== "TRIGGER") {
|
||||
continue
|
||||
}
|
||||
|
||||
const distance = Math.sqrt(
|
||||
Math.pow(draggedNode.position('x') - node.position.x, 2) +
|
||||
Math.pow(draggedNode.position('y') - node.position.y, 2)
|
||||
)
|
||||
|
||||
if (decoratorNodeIds.includes(node.data.id)) {
|
||||
|
||||
// Drag a little farther to remove it
|
||||
if (distance > minDistance + 75) {
|
||||
// Remove the branch? Why?
|
||||
const edgeToRemove = cy.getElementById(branches[branchkey].data.id)
|
||||
if (edgeToRemove !== null && edgeToRemove !== undefined) {
|
||||
//console.log("Removing edge: ", edgeToRemove)
|
||||
edgeToRemove.remove()
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
if (distance < minDistance) {
|
||||
relevantNodes.push(node)
|
||||
//minDistance = distance
|
||||
//closestNode = node
|
||||
}
|
||||
}
|
||||
|
||||
for (var key in relevantNodes) {
|
||||
const closestNode = relevantNodes[key]
|
||||
if (closestNode.data.app_name === "Webhook" || closestNode.data.app_name === "Schedule") {
|
||||
return
|
||||
}
|
||||
|
||||
// Checks if the branch already exists between the nodes
|
||||
if (decoratorIds.length > 0) {
|
||||
var foundBranch = false
|
||||
for (var decoratorkey in decoratorIds) {
|
||||
const decoratorEdge = cy.getElementById(decoratorIds[decoratorkey])
|
||||
if (decoratorEdge === null || decoratorEdge === undefined) {
|
||||
continue
|
||||
}
|
||||
|
||||
// Check if source and destination exists with a branch
|
||||
const sourceId = decoratorEdge.data("source")
|
||||
const targetId = decoratorEdge.data("target")
|
||||
if ((sourceId === closestNode.data.id && targetId === nodedata.id) || (sourceId === nodedata.id && targetId === closestNode.data.id)) {
|
||||
foundBranch = true
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
if (foundBranch) {
|
||||
continue
|
||||
}
|
||||
}
|
||||
|
||||
const newId = uuidv4()
|
||||
cy.add({
|
||||
group: "edges",
|
||||
data: {
|
||||
decorator: true,
|
||||
id: newId,
|
||||
_id: newId,
|
||||
source: closestNode.data.id,
|
||||
target: nodedata.id,
|
||||
label: releaseToConnectLabel,
|
||||
conditions: [],
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
// FIXME: This is the start of a highlighter for the node
|
||||
// to better match it up with other elements
|
||||
// 1. Get current node's position in X/Y on the screen
|
||||
// 2. Draw a red line on the X and Y axis for positioning
|
||||
|
||||
// Draw a red div line in the HTML
|
||||
const position = event.target.position()
|
||||
const redline = document.getElementById("redline")
|
||||
if (redline !== null && redline !== undefined) {
|
||||
redline.style.display = "block"
|
||||
redline.style.position = "absolute"
|
||||
redline.style.left = position.x + "px"
|
||||
redline.style.top = position.y + "px"
|
||||
redline.style.height = "10000px"
|
||||
redline.style.width = 1
|
||||
console.log("REDLINE!")
|
||||
}
|
||||
*/
|
||||
}
|
||||
|
||||
const onNodeDrag = (event, selectedAction) => {
|
||||
const nodedata = event.target.data();
|
||||
|
||||
@@ -4906,161 +5074,9 @@ const AngularWorkflow = (defaultprops) => {
|
||||
return;
|
||||
}
|
||||
|
||||
// Finds closest partner to show edge to connect to
|
||||
if ((nodedata.trigger_type === "SUBFLOW" || nodedata.trigger_type === "USERINPUT" || nodedata.type === "ACTION") && !nodedata.isStartNode) {
|
||||
// Check if it already has any non-decorator branches attached to it
|
||||
const branches = cy.elements('edge').jsons()
|
||||
var branchFound = false
|
||||
var decoratorIds = []
|
||||
for (var branchkey in branches) {
|
||||
if (branches[branchkey].data.source === nodedata.id || branches[branchkey].data.target === nodedata.id) {
|
||||
|
||||
if (branches[branchkey].data.decorator === true) {
|
||||
|
||||
// Add the source/destination
|
||||
if (branches[branchkey].data.source === nodedata.id) {
|
||||
decoratorIds.push(branches[branchkey].data.target)
|
||||
} else {
|
||||
decoratorIds.push(branches[branchkey].data.source)
|
||||
}
|
||||
|
||||
continue
|
||||
}
|
||||
|
||||
branchFound = true
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
if (!branchFound) {
|
||||
//console.log("Found action during drag. Checking closest nodes as it doesn't have a valid branch")
|
||||
var closestNode = null
|
||||
var minDistance = 300
|
||||
|
||||
const draggedNode = event.target
|
||||
const allnodes = cy.nodes().jsons()
|
||||
for (var nodekey in allnodes) {
|
||||
const node = allnodes[nodekey]
|
||||
if (node.data.id === nodedata.id) {
|
||||
continue
|
||||
}
|
||||
|
||||
// Decorators
|
||||
if (node.data.attachedTo !== undefined) {
|
||||
continue
|
||||
}
|
||||
|
||||
if (node.position === undefined || node.position === null || node.position.x === undefined || node.position.y === undefined) {
|
||||
continue
|
||||
}
|
||||
|
||||
if (node.data.type !== "ACTION" && node.data.type !== "TRIGGER") {
|
||||
continue
|
||||
}
|
||||
|
||||
const distance = Math.sqrt(
|
||||
Math.pow(draggedNode.position('x') - node.position.x, 2) +
|
||||
Math.pow(draggedNode.position('y') - node.position.y, 2)
|
||||
)
|
||||
|
||||
if (decoratorIds.includes(node.data.id)) {
|
||||
//console.log("Found existing decorator for: ", node.data.app_name, "Distance: ", distance)
|
||||
|
||||
if (distance > 300) {
|
||||
// Remove the branch
|
||||
const edgeToRemove = cy.getElementById(branches[branchkey].data.id)
|
||||
if (edgeToRemove !== null && edgeToRemove !== undefined) {
|
||||
//console.log("Removing edge: ", edgeToRemove)
|
||||
edgeToRemove.remove()
|
||||
//decoratorIds.splice(decoratorIds.indexOf(node.data.id), 1)
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
if (distance < minDistance) {
|
||||
minDistance = distance
|
||||
closestNode = node
|
||||
}
|
||||
}
|
||||
|
||||
if (closestNode !== null && closestNode !== undefined) {
|
||||
if (closestNode.data.app_name === "Webhook" || closestNode.data.app_name === "Schedule") {
|
||||
return
|
||||
}
|
||||
|
||||
//console.log("Closest node app: ", closestNode.data.app_name, "Distance: ", minDistance)
|
||||
|
||||
/*
|
||||
if (decoratorIds.length > 0) {
|
||||
console.log("Decorators already exists. If within distance of 15 add to existing, otherwise remove old and add new: ", decoratorIds)
|
||||
for (var decoratorkey in decoratorIds) {
|
||||
const decoratorEdge = cy.getElementById(decoratorIds[decoratorkey])
|
||||
if (decoratorEdge === null || decoratorEdge === undefined) {
|
||||
continue
|
||||
}
|
||||
|
||||
const sourceNode = cy.getElementById(decoratorEdge.data.source)
|
||||
const targetNode = cy.getElementById(decoratorEdge.data.target)
|
||||
|
||||
const distance = Math.sqrt(
|
||||
Math.pow(draggedNode.position('x') - sourceNode.position('x'), 2) +
|
||||
Math.pow(draggedNode.position('y') - sourceNode.position('y'), 2)
|
||||
)
|
||||
|
||||
// Check plus minus 15 in distance from mindistance
|
||||
if (distance > minDistance - 15 && distance < minDistance + 15) {
|
||||
console.log("Within distance of 15, add to existing edge")
|
||||
} else {
|
||||
console.log("Outside distance of 15, remove old edge and add new")
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
*/
|
||||
|
||||
if (decoratorIds.length === 0) {
|
||||
//const edgeCurve = calculateEdgeCurve(draggedNode.position(), closestNode.position)
|
||||
//currentedge.style('control-point-distance', edgeCurve.distance)
|
||||
//currentedge.style('control-point-weight', edgeCurve.weight)
|
||||
|
||||
const newId = uuidv4()
|
||||
cy.add({
|
||||
group: "edges",
|
||||
data: {
|
||||
decorator: true,
|
||||
id: newId,
|
||||
_id: newId,
|
||||
source: closestNode.data.id,
|
||||
target: nodedata.id,
|
||||
label: releaseToConnectLabel,
|
||||
conditions: [],
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
// FIXME: This is the start of a highlighter for the node
|
||||
// to better match it up with other elements
|
||||
// 1. Get current node's position in X/Y on the screen
|
||||
// 2. Draw a red line on the X and Y axis for positioning
|
||||
|
||||
// Draw a red div line in the HTML
|
||||
const position = event.target.position()
|
||||
const redline = document.getElementById("redline")
|
||||
if (redline !== null && redline !== undefined) {
|
||||
redline.style.display = "block"
|
||||
redline.style.position = "absolute"
|
||||
redline.style.left = position.x + "px"
|
||||
redline.style.top = position.y + "px"
|
||||
redline.style.height = "10000px"
|
||||
redline.style.width = 1
|
||||
console.log("REDLINE!")
|
||||
}
|
||||
*/
|
||||
|
||||
findClosestNode(event, nodedata)
|
||||
}
|
||||
|
||||
if (originalLocation.x === 0 && originalLocation.y === 0 && nodedata.position !== undefined) {
|
||||
@@ -5222,7 +5238,9 @@ const AngularWorkflow = (defaultprops) => {
|
||||
name: item.label,
|
||||
autocomplete: itemlabelComplete,
|
||||
example: exampledata,
|
||||
};
|
||||
}
|
||||
|
||||
console.log("VALUE: ", actionvalue)
|
||||
|
||||
actionlist.push(actionvalue);
|
||||
}
|
||||
@@ -5736,7 +5754,6 @@ const AngularWorkflow = (defaultprops) => {
|
||||
return
|
||||
|
||||
} else if (data.buttonType === "copy") {
|
||||
console.log("COPY!");
|
||||
|
||||
// 1. Find parent
|
||||
// 2. Find branches for parent
|
||||
@@ -6198,8 +6215,10 @@ const AngularWorkflow = (defaultprops) => {
|
||||
}
|
||||
}
|
||||
|
||||
setSelectedApp(curapp)
|
||||
setSelectedAction(curaction)
|
||||
setTimeout(() => {
|
||||
setSelectedApp(curapp)
|
||||
setSelectedAction(curaction)
|
||||
}, 50)
|
||||
|
||||
cy.removeListener("drag");
|
||||
cy.removeListener("free");
|
||||
@@ -10658,6 +10677,7 @@ const AngularWorkflow = (defaultprops) => {
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
// HTML -> Canvas overlap check
|
||||
if (
|
||||
e.pageX > cycontainer.offsetLeft
|
||||
@@ -10670,6 +10690,9 @@ const AngularWorkflow = (defaultprops) => {
|
||||
return
|
||||
}
|
||||
|
||||
findClosestNode({
|
||||
target: currentnode,
|
||||
}, currentnode.data())
|
||||
|
||||
currentnode[0].renderedPosition("x", e.pageX - cycontainer.offsetLeft)
|
||||
currentnode[0].renderedPosition("y", e.pageY - cycontainer.offsetTop)
|
||||
@@ -17734,10 +17757,24 @@ const AngularWorkflow = (defaultprops) => {
|
||||
onChange={(e) => {
|
||||
if (lastSaved === false && originalWorkflow.id === workflow.id) {
|
||||
setSuborgWorkflows([])
|
||||
|
||||
saveWorkflow(workflow, undefined, undefined, e.target.value)
|
||||
toast.warn(`Saving workflow first due to detected changes. If more than 10 auth`, {
|
||||
|
||||
/* Standard re-loads */
|
||||
setAllTriggers(undefined)
|
||||
setSelectedTriggerIndex(-1)
|
||||
|
||||
getEnvironments(e.target.value)
|
||||
getAppAuthentication(undefined, undefined, undefined, e.target.value)
|
||||
getFiles(e.target.value)
|
||||
listOrgCache(e.target.value)
|
||||
/* Standard re-loads */
|
||||
|
||||
toast.warn(`Saving workflow first due to detected changes.`, {
|
||||
autoClose: 2000,
|
||||
})
|
||||
|
||||
|
||||
return
|
||||
}
|
||||
|
||||
@@ -17761,12 +17798,14 @@ const AngularWorkflow = (defaultprops) => {
|
||||
}
|
||||
|
||||
ReactDOM.unstable_batchedUpdates(() => {
|
||||
/* Standard re-loads */
|
||||
setAllTriggers(undefined)
|
||||
setSelectedTriggerIndex(-1)
|
||||
getEnvironments(e.target.value)
|
||||
getAppAuthentication(undefined, undefined, undefined, e.target.value)
|
||||
getFiles(e.target.value)
|
||||
listOrgCache(e.target.value)
|
||||
/* Standard re-loads */
|
||||
|
||||
// Reset the save button to ensure random saves don't occur during move
|
||||
setLastSaved(true)
|
||||
@@ -19035,7 +19074,7 @@ const AngularWorkflow = (defaultprops) => {
|
||||
{workflow.public || userdata.support == true ?
|
||||
<Tooltip
|
||||
color="secondary"
|
||||
title="Download public workflow"
|
||||
title="Download workflow"
|
||||
placement="top-start"
|
||||
>
|
||||
<span>
|
||||
@@ -20038,7 +20077,8 @@ const AngularWorkflow = (defaultprops) => {
|
||||
}
|
||||
}
|
||||
|
||||
to_be_copied.replaceAll(" ", "_");
|
||||
to_be_copied = to_be_copied.replaceAll(" ", "_");
|
||||
console.log("COPY: ", to_be_copied);
|
||||
const elementName = "copy_element_shuffle";
|
||||
var copyText = document.getElementById(elementName);
|
||||
if (copyText !== null && copyText !== undefined) {
|
||||
@@ -21562,19 +21602,21 @@ const AngularWorkflow = (defaultprops) => {
|
||||
const checked = validateJson(data.value.trim())
|
||||
|
||||
if (data.name === "shuffle_action_logs" && data.value !== undefined && data.value !== null && data.value.length > 0 && data.value.includes("add env SHUFFLE_LOGS_DISABLED")) {
|
||||
return (
|
||||
<div style={{ maxWidth: 600, marginTop: 15, overflowX: "hidden", }}>
|
||||
<Typography
|
||||
variant="body1"
|
||||
style={{}}
|
||||
>
|
||||
<b>Action Logs</b>
|
||||
</Typography>
|
||||
<Typography variant="body2" style={{ whiteSpace: 'pre-line', }}>
|
||||
Logs for an action are not available without <a style={{ color: "#FF8544", }} href="/admin?tab=locations" target="_blank" rel="noopener noreferrer">an onprem environment</a> with the <a style={{ color: "#FF8544", }} href="/docs/configuration#scaling-shuffle" target="_blank" rel="noopener noreferrer">SHUFFLE_LOGS_DISABLED</a> environment variable set to false: SHUFFLE_LOGS_DISABLED=false. Logs are enabled by default, except in scale mode.
|
||||
</Typography>
|
||||
</div>
|
||||
)
|
||||
data.value = `Logs for this action are not available without <a style={{ color: "#FF8544", }} href="/admin?tab=locations" target="_blank" rel="noopener noreferrer">an onprem environment</a> with the <a style={{ color: "#FF8544", }} href="/docs/configuration#scaling-shuffle" target="_blank" rel="noopener noreferrer">SHUFFLE_LOGS_DISABLED</a> environment variable set to false: SHUFFLE_LOGS_DISABLED=false. Logs are enabled by default, except in scale mode.`
|
||||
/*
|
||||
return (
|
||||
<div style={{ maxWidth: 600, marginTop: 15, overflowX: "hidden", }}>
|
||||
<Typography
|
||||
variant="body1"
|
||||
style={{}}
|
||||
>
|
||||
<b>Action Logs</b>
|
||||
</Typography>
|
||||
<Typography variant="body2" style={{ whiteSpace: 'pre-line', }}>
|
||||
</Typography>
|
||||
</div>
|
||||
)
|
||||
*/
|
||||
}
|
||||
|
||||
var showlink = false
|
||||
@@ -22139,9 +22181,9 @@ const AngularWorkflow = (defaultprops) => {
|
||||
variant="h6"
|
||||
style={{ marginBottom: 0, marginTop: 0 }}
|
||||
>
|
||||
Variables <span style={{ fontSize: 10 }}>(click to expand)</span>
|
||||
Variable & Debug info <span style={{ fontSize: 10 }}>({selectedResult?.action?.parameters?.length})</span>
|
||||
</Typography>
|
||||
{selectedResult.action.parameters.map((data, index) => {
|
||||
{selectedResult?.action?.parameters?.map((data, index) => {
|
||||
if (data.value.length === 0) {
|
||||
return null;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user