Made it so wait for results does what it should for loops on cloud

This commit is contained in:
Frikky
2024-01-25 14:56:52 +01:00
parent 7a6970e3d6
commit 7a09037604
14 changed files with 550 additions and 227 deletions
+13 -2
View File
@@ -150,11 +150,22 @@ const CacheView = (props) => {
const deleteCache = (orgId, key) => {
toast("Attempting to delete Cache");
fetch(globalUrl + `/api/v1/orgs/${orgId}/cache/${key}`, {
method: "DELETE",
// method: "DELETE",
const method = "POST"
//const url = `${globalUrl}/api/v1/orgs/${orgId}/cache/${key}`
const url = `${globalUrl}/api/v1/orgs/${orgId}/delete_cache`
const parsed = {
"org_id": orgId,
"key": key,
}
fetch(url, {
method: method,
headers: {
Accept: "application/json",
},
body: JSON.stringify(parsed),
credentials: "include",
})
.then((response) => {
+126 -59
View File
@@ -32,6 +32,8 @@ import {
import { FixName } from "../views/Apps.jsx";
import aa from 'search-insights'
import AuthenticationOauth2 from "../components/Oauth2Auth.jsx";
// Handles workflow updates on first open to highlight the issues of the workflow
// Variables
// Action (exists, missing fields)
@@ -60,6 +62,8 @@ const ConfigureWorkflow = (props) => {
setAuthenticationType,
setAuthenticationModalOpen,
setConfigureWorkflowModalOpen,
setConfigurationFinished,
} = props;
const [requiredActions, setRequiredActions] = React.useState([]);
@@ -70,9 +74,19 @@ const ConfigureWorkflow = (props) => {
const [firstLoad, setFirstLoad] = React.useState("");
const [showFinalizeAnimation, setShowFinalizeAnimation] = React.useState(false);
const [loopRunning, setLoopRunning] = useState(false)
const [checkStarted, setCheckStarted] = React.useState(false);
useEffect(() => {
console.log("Required actions: ", requiredActions)
if (requiredActions.length === 0) {
console.log("No more actions? Set parent to done?")
if (setConfigurationFinished !== undefined) {
setConfigurationFinished(true)
}
}
}, [requiredActions])
const stop = () => {
setLoopRunning(false)
}
@@ -81,6 +95,7 @@ const ConfigureWorkflow = (props) => {
setLoopRunning(true)
}
useEffect(() => {
if (loopRunning) {
const intervalId = setInterval(() => {
@@ -159,7 +174,6 @@ const ConfigureWorkflow = (props) => {
return response.json();
})
.then((responseJson) => {
console.log("ACTION: ", responseJson);
if (
responseJson.actions !== undefined &&
responseJson.actions !== null
@@ -215,6 +229,9 @@ const ConfigureWorkflow = (props) => {
// without version match
const newappname = action.app_name.toLowerCase().replaceAll(" ", "_")
const app = apps.find((app) => app.id === action.app_id || app.name.toLowerCase().replaceAll(" ", "_") === newappname)
if (app === undefined || app === null) {
const subapp = apps.find(app => app.name === action.app_name)
@@ -229,47 +246,51 @@ const ConfigureWorkflow = (props) => {
"required": true,
})
} else {
if (action.authentication_id === "" && app.authentication.required === true && action.parameters !== undefined && action.parameters !== null) {
// Check if configuration is filled or not
// Check if configuration is filled or not
var filled = true;
for (let [key,keyval] in Object.entries(action.parameters)) {
if (action.parameters[key].configuration) {
//console.log("Found config: ", action.parameters[key])
if (
action.parameters[key].value === null ||
action.parameters[key].value.length === 0
) {
if (action.parameters[key].value === null || action.parameters[key].value.length === 0) {
filled = false;
break;
}
}
}
if (app.authentication.type === "oauth2" || app.authentication.type === "oauth2-app") {
filled = false
action.auth_type = "oauth2"
}
newaction.steps.push({
"title": "Authenticate app",
"type": "authenticate",
"required": true,
"auth_type": app.authentication.type,
})
if (!filled) {
newaction.must_authenticate = true;
newaction.action_ids.push(action.id);
}
} else if (action.authentication_id !== "" && app.authentication.required === true) {
console.log("Should verify authentication ID ", action.authentication_id)
} else if (action.authentication_id !== undefined && action.authentication_id !== null && action.authentication_id !== "" && app.authentication.required === true) {
console.log("FIXME: Should verify authentication ID ", action.authentication_id)
}
newaction.app = app;
}
if (
action.errors !== undefined &&
action.errors !== null &&
action.errors.length > 0
) {
if (newaction.errors !== undefined && newaction.errors !== null && newaction.errors.length > 0) {
//console.log("Node has errors!: ", action.errors)
}
//console.log(newaction.app_name,"AUTH: ", newaction.must_authenticate, " ACTIVATE: ", newaction.must_activate)
if (newaction.must_authenticate) {
var authenticationOptions = [];
for (let [key,keyval] in Object.entries(appAuthentication)) {
@@ -395,29 +416,29 @@ const ConfigureWorkflow = (props) => {
setRequiredActions(newactions);
}
if (appAuthentication !== undefined && previousAuth !== undefined && appAuthentication.length !== previousAuth.length) {
var newactions = []
for (let [actionkey, actionkeyval] in Object.entries(requiredActions)) {
var newaction = requiredActions[actionkey];
const app = newaction.app;
if (appAuthentication !== undefined && previousAuth !== undefined && appAuthentication.length !== previousAuth.length) {
var newactions = []
for (let [actionkey, actionkeyval] in Object.entries(requiredActions)) {
var newaction = requiredActions[actionkey];
const app = newaction.app;
for (let [key,keyval] in Object.entries(appAuthentication)) {
const auth = appAuthentication[key];
for (let [key,keyval] in Object.entries(appAuthentication)) {
const auth = appAuthentication[key];
// Does this account for all the different ones of the same?
if (auth.app.name === app.name && auth.active === true) {
newaction.auth_done = true;
break;
// Does this account for all the different ones of the same?
if (auth.app.name === app.name && auth.active === true) {
newaction.auth_done = true;
break;
}
}
newactions.push(newaction);
}
newactions.push(newaction);
}
setRequiredActions(newactions);
setPreviousAuth(appAuthentication);
// Set auth done to true
//"auth_done": false
setRequiredActions(newactions);
setPreviousAuth(appAuthentication);
// Set auth done to true
//"auth_done": false
}
const TriggerSection = (props) => {
@@ -610,14 +631,24 @@ const ConfigureWorkflow = (props) => {
const [authFields, setAuthFields] = useState([])
const [sensitiveFields, setSensitiveFields] = useState([])
//console.log("ACTION", action)
useEffect(() => {
if (finalized === true) {
setOpened(false)
setFilled(true)
}
}, [finalized])
if (authFields.length === 0 && opened === true) {
// Loop through fields of the action
var newfields = []
const params = action.action.parameters
var sensitiveIndexes = []
var index = 0
var sensitiveIndexes = []
const params = action.action.parameters
for (let key in params) {
const param = params[key]
@@ -732,9 +763,34 @@ const ConfigureWorkflow = (props) => {
<CheckIcon style={{color: theme.palette.green, marginLeft: 10, marginTop: 10, flex: 1, }} />
: null}
</div>
{opened ?
<div style={{padding: 12, }}>
{authFields.map((field, index) => {
{action.app.authentication.type === "oauth2-app" || action.app.authentication.type === "oauth2" || action.auth_type === "oauth2" ?
<div>
<AuthenticationOauth2
selectedApp={action.app}
selectedAction={{
"app_name": action.app.name,
"app_id": action.app.id,
"app_version": action.app.version,
"large_image": action.app.large_image,
}}
authenticationType={action.app.authentication}
isCloud={isCloud}
authButtonOnly={true}
isLoggedIn={true}
getAppAuthentication={undefined}
setFinalized={setFinalized}
/>
</div>
:
authFields.map((field, index) => {
console.log("THESE FIELDS?: ", field)
var parsedName = field.key
// Remove _basic at the end if it exists
if (parsedName.toLowerCase().endsWith("_basic")) {
@@ -807,25 +863,28 @@ const ConfigureWorkflow = (props) => {
</div>
)
})}
<Button
variant="contained"
color="primary"
style={{
marginTop: 15,
width: 150,
marginLeft: 135,
}}
disabled={!filled || submitted}
onClick={() => {
setSubmitted(true);
// const submitLocalAuth = (app, fields) => {
submitLocalAuth({"id": action.app.id, "name": action.app.name, "version": action.app.version, "large_image": action.large_image, }, authFields);
}}
>
{submitted ? <CircularProgress style={{color: theme.palette.primary.main, }} /> : "Submit"}
</Button>
{action.app.authentication.type !== "oauth2-app" && action.app.authentication.type !== "oauth2" ?
<Button
variant="contained"
color="primary"
style={{
marginTop: 15,
width: 150,
marginLeft: 135,
}}
disabled={!filled || submitted}
onClick={() => {
setSubmitted(true);
// const submitLocalAuth = (app, fields) => {
submitLocalAuth({"id": action.app.id, "name": action.app.name, "version": action.app.version, "large_image": action.large_image, }, authFields);
}}
>
{submitted ? <CircularProgress style={{color: theme.palette.primary.main, }} /> : "Submit"}
</Button>
: null}
</div>
: null}
</div>
@@ -1237,19 +1296,22 @@ const ConfigureWorkflow = (props) => {
return (
<div>
<div style={{margin: setConfigureWorkflowModalOpen !== undefined ? "0px 50px 0px 50px" : "35px 0px 0px", maxHeight: 475, }}>
<div style={{margin: setConfigureWorkflowModalOpen !== undefined ? "0px 50px 0px 50px" : "35px 0px 0px 0px", maxHeight: 475, }}>
{setConfigureWorkflowModalOpen !== undefined ?
<Typography variant="h6">{workflow.name}</Typography>
<Typography variant="h6">
{workflow.name}
</Typography>
: null
}
<Typography variant="body2" style={{}}>
Please configure the following apps for automatic startup of automation:
</Typography>
{requiredActions.length > 0 ? (
<span>
<Typography variant="body2" style={{}}>
Please configure the following steps to help us complete your workflow. This can also be done later.
</Typography>
{setConfigureWorkflowModalOpen !== undefined ?
<Typography variant="body1" style={{ marginTop: 10, }}>
Required Actions
@@ -1258,6 +1320,11 @@ const ConfigureWorkflow = (props) => {
<List style={{paddingBottom: window.location.pathname.includes("/workflows/") ? 0 : 250, }}>
{requiredActions.map((data, index) => {
// AppWrapper = Default in a workflow, only shows with steps
// AppSection =
// AppSectionSelfcontained = default for template generator
return (
<div key={index} style={{marginBottom: 10, }}>
{data.steps !== undefined && data.steps !== null && data.show_steps === true && setConfigureWorkflowModalOpen !== undefined ?
+1 -1
View File
@@ -615,7 +615,7 @@ const Header = (props) => {
<Divider style={{marginBottom: 10, }}/>
<Typography variant="body2" color="textSecondary" align="center" style={{marginTop: 5, marginBottom: 5,}}>
Version: 1.3.2
Version: 1.3.3
</Typography>
</Menu>
</span>
+17 -8
View File
@@ -97,6 +97,8 @@ const AuthenticationOauth2 = (props) => {
autoAuth,
authButtonOnly,
isLoggedIn,
setFinalized,
} = props;
let navigate = useNavigate();
@@ -489,20 +491,27 @@ const AuthenticationOauth2 = (props) => {
var open = true;
const timer = setInterval(() => {
if (newwin.closed) {
console.log("Closing?")
console.log("Closing?")
setButtonClicked(false);
clearInterval(timer);
//alert('"Secure Payment" window closed!');
//
if (getAppAuthentication !== undefined) {
getAppAuthentication(true, true, true);
}
if (getAppAuthentication !== undefined) {
getAppAuthentication(true, true, true);
}
// This is more a guess than anything
// Should be handled in getAppAuthentication()
// in the parent component to make it accurate,
// seeing as we don't know what the parent component
// wants to happen
if (setFinalized !== undefined) {
setFinalized(true)
}
} else {
console.log("Not closed")
}
console.log("Not closed")
}
}, 1000);
//do {
// setTimeout(() => {
+10 -8
View File
@@ -3373,14 +3373,16 @@ const ParsedAction = (props) => {
variant="outlined"
color="secondary"
/>
: null}
<Chip
style={{marginLeft: 0, padding: 0, marginRight: 10, cursor: "pointer",}}
label={data.app.app_version}
variant="outlined"
color="secondary"
/>
{data.label}
: null}
{data.app.app_version !== undefined && data.app.app_version !== null && data.app.app_version !== "" && data.app.app_version !== "undefined" ?
<Chip
style={{marginLeft: 0, padding: 0, marginRight: 10, cursor: "pointer",}}
label={data.app.app_version}
variant="outlined"
color="secondary"
/>
: null}
{data.label}
</MenuItem>
);
})}
+108 -23
View File
@@ -47,6 +47,7 @@ import ReactJson from "react-json-view";
import PaperComponent from "../components/PaperComponent.jsx";
import CodeMirror from '@uiw/react-codemirror';
import { python } from '@codemirror/lang-python';
//import 'codemirror/keymap/sublime';
//import 'codemirror/addon/selection/mark-selection.js'
//import 'codemirror/theme/gruvbox-dark.css';
@@ -212,6 +213,80 @@ const CodeEditor = (props) => {
expectedOutput(localcodedata)
}, [])
useEffect(() => {
expectedOutput(localcodedata)
}, [availableVariables])
var to_be_copied = "";
const HandleJsonCopy = (base, copy, base_node_name) => {
if (typeof copy.name === "string") {
copy.name = copy.name.replaceAll(" ", "_");
}
//lol
if (typeof base === 'object' || typeof base === 'dict') {
base = JSON.stringify(base)
}
if (base_node_name === "execution_argument" || base_node_name === "Execution Argument") {
base_node_name = "exec"
}
console.log("COPY: ", base_node_name, copy);
//var newitem = JSON.parse(base);
var newitem = validateJson(base).result
to_be_copied = "$" + base_node_name.toLowerCase().replaceAll(" ", "_");
for (let copykey in copy.namespace) {
if (copy.namespace[copykey].includes("Results for")) {
continue;
}
if (newitem !== undefined && newitem !== null) {
newitem = newitem[copy.namespace[copykey]];
if (!isNaN(copy.namespace[copykey])) {
to_be_copied += ".#";
} else {
to_be_copied += "." + copy.namespace[copykey];
}
}
}
if (newitem !== undefined && newitem !== null) {
newitem = newitem[copy.name];
if (!isNaN(copy.name)) {
to_be_copied += ".#";
} else {
to_be_copied += "." + copy.name;
}
}
to_be_copied.replaceAll(" ", "_");
const elementName = "copy_element_shuffle";
var copyText = document.getElementById(elementName);
if (copyText !== null && copyText !== undefined) {
console.log("NAVIGATOR: ", navigator);
const clipboard = navigator.clipboard;
if (clipboard === undefined) {
toast("Can only copy over HTTPS (port 3443)");
return;
}
navigator.clipboard.writeText(to_be_copied);
copyText.select();
copyText.setSelectionRange(0, 99999); /* For mobile devices */
/* Copy the text inside the text field */
document.execCommand("copy");
console.log("COPYING!");
toast("Copied JSON path to clipboard.")
} else {
console.log("Couldn't find element ", elementName);
}
}
const aiSubmit = (value, inputAction) => {
if (value === undefined || value === "") {
console.log("No value input!")
@@ -938,10 +1013,10 @@ const CodeEditor = (props) => {
style: {
zIndex: 12501,
color: "white",
minWidth: isMobile ? "100%" : isFileEditor ? 650 : 1200,
maxWidth: isMobile ? "100%" : isFileEditor ? 650 : 1200,
minHeight: isMobile ? "100%" : 720,
maxHeight: isMobile ? "100%" : 720,
minWidth: isMobile ? "100%" : isFileEditor ? 650 : 1100,
maxWidth: isMobile ? "100%" : isFileEditor ? 650 : 1100,
minHeight: isMobile ? "100%" : 620,
maxHeight: isMobile ? "100%" : 620,
border: theme.palette.defaultBorder,
padding: isMobile ? "25px 10px 25px 10px" : 25,
},
@@ -951,8 +1026,8 @@ const CodeEditor = (props) => {
style={{
zIndex: 5000,
position: "absolute",
top: 14,
right: 18,
top: 6,
right: 6,
color: "grey",
}}
onClick={() => {
@@ -1425,22 +1500,26 @@ const CodeEditor = (props) => {
borderRadius: theme.palette.borderRadius,
position: "relative",
paddingTop: 0,
minHeight: 548,
overflow: "hidden",
// minHeight: 548,
// overflow: "hidden",
}}>
<CodeMirror
theme={vscodeDark}
value={localcodedata}
height={isFileEditor ? 450 : 500}
extensions={[python({ py: true })]}
height={isFileEditor ? 450 : 450}
width={isFileEditor ? 650 : 600}
style={{
maxWidth: isFileEditor ? 450 : 600,
maxHeight: 548,
minHeight: 548,
maxHeight: 450,
minHeight: 450,
wordBreak: "break-word",
marginTop: 0,
paddingBottom: 10,
overflow: "hidden",
// overflow: "hidden",
overflowY: "auto",
whiteSpace: "pre-wrap",
wordWrap: "break-word",
}}
onCursorActivity = {(value) => {
console.log("CURSOR: ", value.getCursor())
@@ -1463,8 +1542,9 @@ const CodeEditor = (props) => {
}}
options={{
mode: validation === true ? "json" : "python",
lineWrapping: linewrap,
lineWrapping: true,
theme: vscodeDark,
lineNumbers: true,
}}
/>
</div>
@@ -1604,7 +1684,7 @@ const CodeEditor = (props) => {
color="primary"
style={{
border: `1px solid ${theme.palette.primary.main}`,
marginLeft: 200,
marginLeft: 175,
maxHeight: 35,
minWidth: 70,
}}
@@ -1633,8 +1713,8 @@ const CodeEditor = (props) => {
borderRadius: 5,
border: `2px solid ${theme.palette.inputColor}`,
padding: 10,
maxHeight: 500,
minheight: 500,
maxHeight: 450,
minheight: 450,
overflow: "auto",
}}
collapsed={false}
@@ -1643,7 +1723,12 @@ const CodeEditor = (props) => {
}}
displayDataTypes={false}
onSelect={(select) => {
//HandleJsonCopy(validate.result, select, "exec");
var basename = "exec"
if (selectedAction !== undefined && selectedAction !== null && Object.keys(selectedAction).length !== 0) {
basename = selectedAction.label.toLowerCase().replaceAll(" ", "_")
}
HandleJsonCopy(expOutput, select, basename)
}}
name={"JSON autocompletion"}
/>
@@ -1659,10 +1744,10 @@ const CodeEditor = (props) => {
marginTop: -2,
border: `2px solid ${theme.palette.inputColor}`,
borderRadius: theme.palette.borderRadius,
maxHeight: 500,
minHeight: 500,
minWidth: 580,
maxWidth: 580,
maxHeight: 450,
minHeight: 450,
minWidth: 480,
maxWidth: 480,
overflow: "auto",
whiteSpace: "pre-wrap",
}}
@@ -1689,7 +1774,7 @@ const CodeEditor = (props) => {
}}
displayDataTypes={false}
onSelect={(select) => {
//HandleJsonCopy(validate.result, select, "exec");
//HandleJsonCopy(executionResult.result, select, "exec");
}}
name={"Test result"}
/>
@@ -1725,7 +1810,7 @@ const CodeEditor = (props) => {
</div>
<div style={{display: 'flex',}}>
<div style={{display: 'flex'}}>
<Button
style={{
height: 35,
@@ -43,6 +43,8 @@ const WorkflowTemplatePopup = (props) => {
const [missingSource, setMissingSource] = React.useState(undefined)
const [missingDestination, setMissingDestination] = React.useState(undefined);
const [configurationFinished, setConfigurationFinished] = React.useState(false);
useEffect(() => {
}, [missingSource, missingDestination])
@@ -175,6 +177,92 @@ const WorkflowTemplatePopup = (props) => {
});
}
// Can create and set workflows
const reloadWorkflow = (workflow_id) => {
const new_url = `${globalUrl}/api/v1/workflows/${workflow_id}`
return fetch(new_url, {
method: "GET",
headers: {
"Content-Type": "application/json",
Accept: "application/json",
},
credentials: "include",
})
.then((response) => {
if (response.status !== 200) {
console.log("Status not 200 for workflows :O!");
return;
}
//setSubmitLoading(false);
return response.json();
})
.then((responseJson) => {
if (responseJson.success === false) {
if (responseJson.reason !== undefined) {
toast("Error setting workflow: ", responseJson.reason)
} else {
toast("Error setting workflow.")
}
return
} else if (responseJson.id !== undefined && responseJson.id !== null && responseJson.id !== "") {
setWorkflow(responseJson)
}
return responseJson;
})
.catch((error) => {
toast("Failed reloading configured workflow: ", error.toString());
});
};
// Can create and set workflows
const saveWorkflow = (workflowdata) => {
const new_url = `${globalUrl}/api/v1/workflows?set_auth=true`
return fetch(new_url, {
method: "POST",
headers: {
"Content-Type": "application/json",
Accept: "application/json",
},
body: JSON.stringify(workflowdata),
credentials: "include",
})
.then((response) => {
if (response.status !== 200) {
console.log("Status not 200 for workflows :O!");
return;
}
//setSubmitLoading(false);
return response.json();
})
.then((responseJson) => {
if (responseJson.success === false) {
if (responseJson.reason !== undefined) {
toast("Error setting workflow: ", responseJson.reason)
} else {
toast("Error setting workflow.")
}
return
}
// In case it got a new id, this is to make sure it loads with the correct config
if (responseJson.id !== undefined && responseJson.id !== null && responseJson.id !== "") {
reloadWorkflow(responseJson.id)
}
return responseJson;
})
.catch((error) => {
toast("Failed generating workflow: ", error.toString());
});
};
const getGeneratedWorkflow = () => {
// POST
@@ -221,8 +309,10 @@ const WorkflowTemplatePopup = (props) => {
},
}
//fetch(globalUrl + "/api/v1/workflows/merge", {
fetch("https://shuffler.io/api/v1/workflows/merge", {
const url = isCloud ? `${globalUrl}/api/v1/workflows/merge` : `https://shuffler.io/api/v1/workflows/merge`
//const url = `https://shuffler.io/api/v1/workflows/merge`
fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/json",
@@ -243,13 +333,21 @@ const WorkflowTemplatePopup = (props) => {
if (responseJson.id !== undefined && responseJson.id !== null && responseJson.id !== "" && responseJson.name !== undefined && responseJson.name !== null && responseJson.name !== "") {
console.log("Success in workflow template (prebuilt): ", responseJson);
setWorkflow(responseJson)
// Sets it in the database properly
saveWorkflow(responseJson)
return
}
if (responseJson.success === false) {
//console.log("Error in workflow template: ", responseJson.error);
setErrorMessage("Failed to generate workflow for these tools - the Shuffle team has been notified. Click out of this window to continue. Contact support@shuffler.io for further assistance.")
const defaultMessage = "Failed to generate workflow the workflow - the Shuffle team has been notified. Contact support@shuffler.io for further assistance."
if (responseJson.reason !== undefined && responseJson.reason !== null && responseJson.reason !== "") {
setErrorMessage(defaultMessage + "\n\n" + responseJson.reason)
} else {
setErrorMessage(defaultMessage)
}
setIsActive(true)
//setTimeout(() => {
@@ -419,8 +517,22 @@ const WorkflowTemplatePopup = (props) => {
appAuthentication={appAuthentication}
setAppAuthentication={setAppAuthentication}
apps={apps}
setConfigurationFinished={setConfigurationFinished}
/>
{errorMessage === "" ?
{errorMessage === "" && configurationFinished === true && workflow.id !== undefined && workflowLoading === false ?
<Tooltip title="Workflow generated!" placement="top">
<span style={{display: "flex", }}>
{/*<CheckIcon color="primary" sx={{ borderRadius: 4 }} /> */}
<Typography variant="h6" style={{ marginLeft: 20, }}>
Workflow generated!
</Typography>
</span>
</Tooltip>
: null}
{/*errorMessage === "" ?
<Button
style={{marginTop: 50, }}
variant={isFinished() ? "contained" : "outlined"}
@@ -430,7 +542,7 @@ const WorkflowTemplatePopup = (props) => {
>
Done
</Button>
: null}
: null*/}
</DialogContent>
</Drawer>
)
@@ -537,6 +649,8 @@ const WorkflowTemplatePopup = (props) => {
: ""}
</div>
</div>
</div>
)
}