diff --git a/frontend/package.json b/frontend/package.json
index aa5d6139..bd605329 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -73,10 +73,17 @@
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
- "eject": "react-scripts eject"
+ "eject": "react-scripts eject",
+ "lint": "eslint 'src/**/*.{tsx,ts,js,jsx}'",
+ "lint_file": "eslint 'src/views/AngularWorkflow.jsx'"
},
"eslintConfig": {
- "extends": "react-app"
+ "extends": "react-app",
+ "rules":{
+ "jsx-a11y/img-redundant-alt" : "off",
+ "no-redeclare" : "off",
+ "no-loop-func": "off"
+ }
},
"browserslist": [
">0.2%",
diff --git a/frontend/src/views/AngularWorkflow.jsx b/frontend/src/views/AngularWorkflow.jsx
index 6a611f21..967450fa 100644
--- a/frontend/src/views/AngularWorkflow.jsx
+++ b/frontend/src/views/AngularWorkflow.jsx
@@ -1,4 +1,4 @@
-import React, {useRef, useState, useEffect, useLayoutEffect} from 'react';
+import React, { useState, useEffect, useLayoutEffect} from 'react';
import { useInterval } from 'react-powerhooks';
import { useTheme } from '@material-ui/core/styles';
@@ -225,7 +225,8 @@ const AngularWorkflow = (props) => {
const [showSkippedActions, setShowSkippedActions] = React.useState(false)
const [lastExecution, setLastExecution] = React.useState("")
const [configureWorkflowModalOpen, setConfigureWorkflowModalOpen] = React.useState(false)
- const [curpath, setCurpath] = useState(typeof window === 'undefined' || window.location === undefined ? "" : window.location.pathname)
+
+ const curpath = typeof window === 'undefined' || window.location === undefined ? "" : window.location.pathname
// 0 = normal, 1 = just done, 2 = normal
const [savingState, setSavingState] = React.useState(0)
@@ -276,7 +277,9 @@ const AngularWorkflow = (props) => {
const [lastSaved, setLastSaved] = React.useState(true)
- const [update, setUpdate] = useState("");
+ // eslint-disable-next-line no-unused-vars
+ const [_, setUpdate] = useState(""); // Used for rendring, don't remove
+
const [workflowExecutions, setWorkflowExecutions] = React.useState([]);
const [defaultEnvironmentIndex, setDefaultEnvironmentIndex] = React.useState(0)
@@ -327,7 +330,6 @@ const AngularWorkflow = (props) => {
// Sets up subflow trigger with the right info
if (trigger_index > -1) {
- var outersub = {}
const trigger = workflow.triggers[trigger_index]
if (trigger.parameters.length >= 3) {
for (var key in trigger.parameters) {
@@ -335,12 +337,10 @@ const AngularWorkflow = (props) => {
if (param.name === "workflow") {
if (param.value === workflow.id) {
setSubworkflow(workflow)
- outersub = workflow
} else {
const sub = responseJson.find(data => data.id === param.value)
if (sub !== undefined && subworkflow.id !== sub.id) {
setSubworkflow(sub)
- outersub = sub
}
}
}
@@ -530,24 +530,6 @@ const AngularWorkflow = (props) => {
});
}
- const debugView = workflowExecutions.length > 0 ?
-
-
- {workflowExecutions.slice(0,15).map((data, index) => {
- return (
-
- {new Date(data.started_at*1000).toISOString()}
- , {data.status}
- {data.result.length > 0 ? ", "+data.result : ", "}
- {data.execution_argument.length > 0 ? ", "+data.execution_argument : ", "}
-
-
- )
- return
- })}
-
-
- : null
const fetchUpdates = () => {
fetch(globalUrl+"/api/v1/streams/results", {
@@ -747,7 +729,7 @@ const AngularWorkflow = (props) => {
}
}
- if (responseJson.status === "ABORTED" || responseJson.status === "STOPPED" || responseJson.status === "FAILURE" || responseJson.status == "WAITING") {
+ if (responseJson.status === "ABORTED" || responseJson.status === "STOPPED" || responseJson.status === "FAILURE" || responseJson.status === "WAITING") {
stop()
if (executionRunning) {
@@ -1072,77 +1054,6 @@ const AngularWorkflow = (props) => {
});
}
- //const handleAppVersioning = (apps) => {
- // var newapps = []
- // for (var key in apps) {
- // var item = apps[key]
- // const previtem = newapps.findIndex(data => data.name === item.name)
- // if (previtem === -1) {
- // item["versions"] = [item.app_version]
- // newapps.push(item)
- // continue
- // }
-
- // // THere might be duplicates for some reason..
- // if (!newapps[previtem]["versions"].includes(item.app_version)) {
- // newapps[previtem]["versions"].push(item.app_version)
- // }
- // }
- //
- // // FIXME - handle this, as we can't have more than one of each :)
- // //setVersionedApps(newapps)
- //}
-
- // Builtin actions that should ran in Worker and not apps
- const getExtraApps = () => {
- const data = [{
- name: "Filter",
- is_valid: true,
- id: "0ca8887e-b4af-4e3e-887c-87e9d3bc3d3e",
- link: "https://shuffler.io",
- app_version: "1.0.0",
- generated: true,
- downloaded: false,
- sharing: false,
- verified: false,
- tested: false,
- owner: "",
- private_id: "",
- description: "Filter",
- environment: "Shuffle",
- small_image: "",
- large_image: "",
- contact_info: {name: "", url: ""},
- authentication: {required: false, parameters: [],},
- actions: [{
- description: "Filter cases",
- id: "",
- name: "filter_cases",
- node_type: "action",
- environment: "Shuffle",
- sharing: false,
- private_id: "",
- app_id: "",
- authentication: null,
- tested: true,
- parameters: [{
- description: "",
- id: "",
- name: "Field to look for",
- example: "$testing_1.#.id",
- value: "",
- multiline: true,
- action_field: "",
- variant: "",
- required: true,
- schema: {type: "string"},
- }]
- }],
- }]
-
- return data
- }
-
// This can be used to only show prioritzed ones later
// Right now, it can prioritize authenticated ones
//"Testing",
@@ -1197,10 +1108,6 @@ const AngularWorkflow = (props) => {
// Setup auth here :)
var appUpdates = false
const authenticationOptions = []
- var findAuthId = ""
- if (selectedAction.authentication_id !== null && selectedAction.authentication_id !== undefined && selectedAction.authentication_id.length > 0) {
- findAuthId = selectedAction.authentication_id
- }
var tmpAuth = JSON.parse(JSON.stringify(responseJson.data))
var latest = 0
@@ -1222,7 +1129,7 @@ const AngularWorkflow = (props) => {
selectedAction.selectedAuthentication = item
for (var key in workflow.actions) {
- if (workflow.actions[key].app_name == selectedApp.name) {
+ if (workflow.actions[key].app_name === selectedApp.name) {
workflow.actions[key].selectedAuthentication = item
workflow.actions[key].authentication_id = item.id
appUpdates = true
@@ -1443,7 +1350,12 @@ const AngularWorkflow = (props) => {
// Add error checks
console.log("Workflow: ", responseJson)
if (!responseJson.public) {
- if ((!responseJson.previously_saved || (!responseJson.is_valid || (responseJson.errors !== undefined || responseJson.errors !== null || responseJson.errors !== responseJson.errors.length > 0)))) {
+ if ((!responseJson.previously_saved ||
+ (!responseJson.is_valid ||
+ (responseJson.errors !== undefined ||
+ responseJson.errors !== null ||
+ responseJson.errors !== // what
+ (responseJson.errors.length > 0))))) {
setConfigureWorkflowModalOpen(true)
}
}
@@ -1543,7 +1455,7 @@ const AngularWorkflow = (props) => {
const curaction = workflow.actions.find(a => a.id === destinationId)
//console.log("ACTION: ", curaction)
if (curaction !== undefined && curaction !== null) {
- if (curaction.app_name == "Shuffle Tools" && curaction.name === "router") {
+ if (curaction.app_name === "Shuffle Tools" && curaction.name === "router") {
alert.info("Router action can't have incoming conditions")
event.target.unselect()
return
@@ -1598,7 +1510,6 @@ const AngularWorkflow = (props) => {
}
}
- var hiddenNodes = []
const onNodeDragStop = (event, selectedAction) => {
const nodedata = event.target.data()
if (nodedata.id === selectedAction.id) {
@@ -1658,7 +1569,6 @@ const AngularWorkflow = (props) => {
}
}
- const skipnames = []
if (nodedata.app_name !== undefined && ((
nodedata.app_name !== "Shuffle Tools" &&
nodedata.app_name !== "Testing" &&
@@ -1720,13 +1630,6 @@ const AngularWorkflow = (props) => {
return
}
- if (nodedata.app_name == "Shuffle Tools" || nodedata.app_name == "Testing") {
-
- // 1. Find location of node
- // 2. Check if it's within view of another node (inside)
- // 3. If it is, then hide text
- }
-
if (nodedata.app_name !== undefined) {
const allNodes = cy.nodes().jsons()
for (var key in allNodes) {
@@ -1758,7 +1661,7 @@ const AngularWorkflow = (props) => {
if (elementMouseIsOver !== undefined && elementMouseIsOver !== null) {
// Color for #f85a3e translated to rgb
const newBorder = "3px solid rgb(248, 90, 62)"
- if (elementMouseIsOver.style.border != newBorder && elementMouseIsOver.id.includes("rightside")) {
+ if (elementMouseIsOver.style.border !== newBorder && elementMouseIsOver.id.includes("rightside")) {
if (elementMouseIsOver.style.border !== undefined) {
elementMouseIsOver.style.original_border = elementMouseIsOver.style.border
} else {
@@ -2003,7 +1906,10 @@ const AngularWorkflow = (props) => {
if (curaction.parameters !== undefined && curaction.parameters !== null && curaction.parameters.length > 0) {
for (var key in curaction.parameters) {
- if (curaction.parameters[key].options !== undefined && curaction.parameters[key].options !== null && curaction.parameters[key].options.length > 0 && curaction.parameters[key].value == "") {
+ if (curaction.parameters[key].options !== undefined &&
+ curaction.parameters[key].options !== null &&
+ curaction.parameters[key].options.length > 0 &&
+ curaction.parameters[key].value === "") {
curaction.parameters[key].value = curaction.parameters[key].options[0]
}
}
@@ -2061,7 +1967,6 @@ const AngularWorkflow = (props) => {
var exampledata = item.example === undefined ? "" : item.example
if (workflowExecutions.length > 0) {
// Look for the ID
- const found = false
for (var key in workflowExecutions) {
if (workflowExecutions[key].results === undefined || workflowExecutions[key].results === null) {
continue
@@ -2088,14 +1993,12 @@ const AngularWorkflow = (props) => {
var jsonvalid = true
try {
- const tmp = String(JSON.parse(foundResult.result))
if (!foundResult.result.includes("{") && !foundResult.result.includes("[")) {
jsonvalid = false
}
} catch (e) {
try {
- foundResult.result = foundResult.result.split("\'").join("\"")
- const tmp = String(JSON.parse(foundResult.result))
+ foundResult.result = foundResult.result.split("'").join("\"")
if (!foundResult.result.includes("{") && !foundResult.result.includes("[")) {
jsonvalid = false
}
@@ -2116,7 +2019,6 @@ const AngularWorkflow = (props) => {
}
const GetParamMatch = (paramname, exampledata, basekey) => {
- const splitkey = "."
if (typeof(exampledata) !== "object") {
return ""
}
@@ -2152,8 +2054,6 @@ const AngularWorkflow = (props) => {
for (const [key, value] of Object.entries(exampledata)) {
// Check if loop or JSON
- const extra = basekey.length > 0 ? splitkey : ""
- const basekeyname = `${basekey.slice(1, basekey.length).split(".").join(splitkey)}${extra}${key}`
if (typeof(value) === 'object') {
if (Array.isArray(value)) {
@@ -2278,8 +2178,6 @@ const AngularWorkflow = (props) => {
}
targetnode = -1
- var sourcenode = workflow.triggers.findIndex(data => data.id === edge.source)
-
@@ -2397,7 +2295,6 @@ const AngularWorkflow = (props) => {
}
// Remove bad startnode
- const startnode_exists = false
for (var key in workflow.actions) {
const action = workflow.actions[key]
if (action.isStartNode && workflow.start !== action.id) {
@@ -2648,7 +2545,7 @@ const AngularWorkflow = (props) => {
break;
case 70:
-
+ break;
case 65:
// As a poweruser myself, I found myself hitting this a few
// too many times to just edit text. Need a better bind
@@ -2727,6 +2624,7 @@ const AngularWorkflow = (props) => {
window.location.pathname = "/workflows/"+props.match.params.key
}
+ // eslint-disable-next-line react-hooks/exhaustive-deps
useEffect(() => {
if (firstrequest) {
setFirstrequest(false)
@@ -2819,7 +2717,6 @@ const AngularWorkflow = (props) => {
})
- var previousnodecolor = ""
const animationDuration = 150
const onNodeHoverOut = (event) => {
const nodedata = event.target.data()
@@ -3027,7 +2924,6 @@ const AngularWorkflow = (props) => {
duration: animationDuration,
})
- previousnodecolor = event.target.style("border-color")
const outgoingEdges = event.target.outgoers('edge')
const incomingEdges = event.target.incomers('edge')
@@ -3595,7 +3491,6 @@ const AngularWorkflow = (props) => {
)
}
- const curTab = 0
const handleSetTab = (event, newValue) => {
setCurrentView(newValue)
}
@@ -4618,43 +4513,6 @@ const AngularWorkflow = (props) => {
}
}
- const changeActionParameterVariant = (variant) => {
- if (data.variant === variant) {
- return
- }
-
- data.variant = variant
- data.value = ""
-
- if (variant === "ACTION_RESULT") {
- console.log("SHOULD FIND PARENTS OF EDGE")
-
- // Uses the target's parents, as the target should be executing the checks (I think)
- var parents = getParents(workflow.actions.find(a => a.id === selectedEdge["target"]))
- if (parents.length > 0) {
- data.action_field = parents[0].label
- } else {
- data.action_field = ""
- }
- } else if (variant === "WORKFLOW_VARIABLE") {
- if (workflow.workflow_variables !== null && workflow.workflow_variables !== undefined && workflow.workflow_variables.length > 0) {
- data.action_field = workflow.workflow_variables[0].name
- }
- }
-
- setSourceValue({})
- setConditionValue({})
- setDestinationValue({})
-
- if (type === "source") {
- setSourceValue(data)
- setDestinationValue(destinationValue)
- } else if (type === "destination") {
- setDestinationValue(data)
- setSourceValue(sourceValue)
- }
- }
-
return (
@@ -4689,7 +4547,6 @@ const AngularWorkflow = (props) => {
onChange={(e) => {
const autocomplete = e.target.value.autocomplete
const newValue = autocomplete.startsWith("$") ? data.value+autocomplete : `${data.value}$${autocomplete}`
-
changeActionVariable(data.action_field, newValue)
}}
>
@@ -5248,7 +5105,7 @@ const AngularWorkflow = (props) => {
saveWorkflow(workflow)
}}>
-

+
Sign in with Google
@@ -5492,7 +5349,6 @@ const AngularWorkflow = (props) => {
const SubflowSidebar = () => {
const [menuPosition, setMenuPosition] = useState(null)
const [showDropdown, setShowDropdown] = React.useState(false)
- const [showAutocomplete, setShowAutocomplete] = React.useState(false)
const [actionlist, setActionlist] = React.useState([])
if (actionlist.length === 0) {
@@ -5525,7 +5381,6 @@ const AngularWorkflow = (props) => {
// Find previous execution and their variables
if (workflowExecutions.length > 0) {
// Look for the ID
- const found = false
for (var key in workflowExecutions) {
if (workflowExecutions[key].results === undefined || workflowExecutions[key].results === null) {
continue
@@ -5543,14 +5398,12 @@ const AngularWorkflow = (props) => {
var jsonvalid = true
try {
- const tmp = String(JSON.parse(foundResult.result))
if (!foundResult.result.includes("{") && !foundResult.result.includes("[")) {
jsonvalid = false
}
} catch (e) {
try {
- foundResult.result = foundResult.result.split("\'").join("\"")
- const tmp = String(JSON.parse(foundResult.result))
+ foundResult.result = foundResult.result.split("'").join("\"")
if (!foundResult.result.includes("{") && !foundResult.result.includes("[")) {
jsonvalid = false
}
@@ -5583,7 +5436,6 @@ const AngularWorkflow = (props) => {
const { data } = props;
const handleMenuClose = () => {
- setShowAutocomplete(false)
@@ -5598,7 +5450,7 @@ const AngularWorkflow = (props) => {
var toComplete = workflow.triggers[selectedTriggerIndex].parameters[1].value.trim().endsWith("$") ? values[0].autocomplete : "$"+values[0].autocomplete
for (var key in values) {
- if (key == 0 || values[key].autocomplete.length === 0) {
+ if (key === 0 || values[key].autocomplete.length === 0) {
continue
}
@@ -6038,7 +5890,6 @@ const AngularWorkflow = (props) => {
})
//setShowDropdownNumber(3)
setShowDropdown(true)
- setShowAutocomplete(true)
}}/>
@@ -6165,12 +6016,12 @@ const AngularWorkflow = (props) => {
selectedTrigger.environment = e.target.value
setSelectedTrigger(selectedTrigger)
if (e.target.value === "cloud") {
- var tmpvalue = workflow.triggers[selectedTriggerIndex].parameters[0].value.split("/")
+ const tmpvalue = workflow.triggers[selectedTriggerIndex].parameters[0].value.split("/")
const urlpath = tmpvalue.slice(3, tmpvalue.length)
const newurl = "https://shuffler.io/"+urlpath.join("/")
workflow.triggers[selectedTriggerIndex].parameters[0].value = newurl
} else {
- var tmpvalue = workflow.triggers[selectedTriggerIndex].parameters[0].value.split("/")
+ const tmpvalue = workflow.triggers[selectedTriggerIndex].parameters[0].value.split("/")
const urlpath = tmpvalue.slice(3, tmpvalue.length)
const newurl = window.location.origin+"/"+urlpath.join("/")
workflow.triggers[selectedTriggerIndex].parameters[0].value = newurl
@@ -6922,19 +6773,6 @@ const AngularWorkflow = (props) => {
)
}
- const NoActionsBar = () => {
- return (
-
- )
-
-
- return null
- }
-
const WorkflowMenu = () => {
const [newAnchor, setNewAnchor] = React.useState(null)
const [showShuffleMenu, setShowShuffleMenu] = React.useState(false)
@@ -7037,7 +6875,6 @@ const AngularWorkflow = (props) => {
}
const BottomCytoscapeBar = () => {
- const [anchorEl, setAnchorEl] = React.useState(null)
const boxSize = 100
const executionButton = executionRunning ?
@@ -7152,7 +6989,11 @@ const AngularWorkflow = (props) => {
}
const RightSideBar = (props) => {
- const {workflow, setWorkflow, setAction, setSelectedAction, setUpdate, appActionArguments, selectedApp, workflowExecutions, setSelectedResult, selectedAction, setSelectedApp, setSelectedTrigger, setSelectedEdge, setCurrentView, cy, setAuthenticationModalOpen,setVariablesModalOpen, setCodeModalOpen, selectedNameChange, rightsidebarStyle, showEnvironment, selectedActionEnvironment, environments, setNewSelectedAction, appApiViewStyle, globalUrl, setSelectedActionEnvironment, requiresAuthentication, hideExtraTypes, scrollConfig, setScrollConfig } = props
+ const {workflow, setWorkflow, setSelectedAction, setUpdate,
+ selectedApp, workflowExecutions, setSelectedResult, selectedAction, setSelectedApp, setSelectedTrigger,
+ setSelectedEdge, setCurrentView, cy, setAuthenticationModalOpen,setVariablesModalOpen, setCodeModalOpen,
+ selectedNameChange, rightsidebarStyle, showEnvironment, selectedActionEnvironment, environments, setNewSelectedAction,
+ appApiViewStyle, globalUrl, setSelectedActionEnvironment, requiresAuthentication, scrollConfig, setScrollConfig } = props
if (!rightSideBarOpen) {
return null
@@ -7478,7 +7319,6 @@ const AngularWorkflow = (props) => {
{workflowExecutions.map((data, index) => {
const statusColor = data.status === "FINISHED" ? green : data.status === "ABORTED" || data.status === "FAILED" ? "red" : yellow
- const timeElapsed = data.completed_at-data.started_at
const resultsLength = data.results !== undefined && data.results !== null ? data.results.length : 0
const timestamp = new Date(data.started_at*1000).toISOString().split('.')[0].split("T").join(" ")
@@ -7536,8 +7376,7 @@ const AngularWorkflow = (props) => {
- )
- return
+ )
})}
:
@@ -7667,7 +7506,15 @@ const AngularWorkflow = (props) => {
- {executionData.status !== undefined && executionData.status !== "ABORTED" && executionData.status !== "FINISHED" && executionData.status !== "FAILURE" && executionData.status !== "WAITING" && !(executionData.results === undefined || executionData.results === null || executionData.results.length === 0 && executionData.status === "EXECUTING")? : null}
+ {executionData.status !== undefined &&
+ executionData.status !== "ABORTED" &&
+ executionData.status !== "FINISHED" &&
+ executionData.status !== "FAILURE" &&
+ executionData.status !== "WAITING" &&
+ !(executionData.results === undefined ||
+ executionData.results === null ||
+ (executionData.results.length === 0 && // probably ment to be around the or's
+ executionData.status === "EXECUTING"))? : null}
{executionData.results === undefined || executionData.results === null || (executionData.results.length === 0 && executionData.status === "EXECUTING" )?
@@ -8443,10 +8290,8 @@ const AngularWorkflow = (props) => {
}}
/>
- {/*selectedApp.link.length > 0 ?
: null*/}
-
+
{selectedApp.authentication.parameters.map((data, index) => {
- //console.log("AUTH: ", data)
return (
@@ -8520,39 +8365,6 @@ const AngularWorkflow = (props) => {
)
}
- const EndpointData = () => {
- const [tmpVar, setTmpVar] = React.useState("")
-
- return (
-
- The API endpoint to use (URL) - predefined in the app
- {
- setTmpVar(event.target.value)
- }}
- onBlur={() => {
- selectedApp.link = tmpVar
- console.log("LINK: ", selectedApp.link)
- setSelectedApp(selectedApp)
- }}
- />
-
- )
- }
-
const configureWorkflowModal = configureWorkflowModalOpen && apps.length !== 0 ?