marker/shuffle-cracked
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

BUG: Fixed app dragging and hovering stopper in workflow

Browse Source
This commit is contained in:
frikky
2021-12-16 00:55:39 +01:00
parent d6c29ebc6d
commit ae9bc32a47
4 changed files with 201 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/ParsedAction.jsx
+43 -24
View File
@@ -2486,7 +2486,7 @@ const ParsedAction = (props) => {
</div> </div>
) : null} ) : null}
{showEnvironment !== undefined && showEnvironment ? ( {showEnvironment !== undefined && showEnvironment && environments.length > 1 ? (
<div style={{ marginTop: "20px" }}> <div style={{ marginTop: "20px" }}>
<Typography>Environment</Typography> <Typography>Environment</Typography>
<Select <Select
@@ -2515,13 +2515,14 @@ const ParsedAction = (props) => {
borderRadius: theme.palette.borderRadius, borderRadius: theme.palette.borderRadius,
}} }}
> >
{environments.map((data) => { {environments.map((data, index) => {
if (data.archived) { if (data.archived === true) {
return null; return null;
} }
return ( return (
<MenuItem <MenuItem
key={index}
key={data.Name} key={data.Name}
style={{ style={{
backgroundColor: theme.palette.inputColor, backgroundColor: theme.palette.inputColor,
@@ -2663,6 +2664,16 @@ const ParsedAction = (props) => {
newActionname = data.label; newActionname = data.label;
} }
var newActiondescription = data.description;
console.log("DESC: ", newActiondescription)
if (
data.description === undefined || data.description === null
) {
newActiondescription = "Description: No description defined for this action"
} else {
newActiondescription = "Description: "+newActiondescription
}
const iconInfo = GetIconInfo({ name: data.name }); const iconInfo = GetIconInfo({ name: data.name });
const useIcon = iconInfo.originalIcon; const useIcon = iconInfo.originalIcon;
@@ -2671,32 +2682,40 @@ const ParsedAction = (props) => {
newActionname.substring(1) newActionname.substring(1)
).replaceAll("_", " "); ).replaceAll("_", " ");
return ( return (
<div style={{ display: "flex" }}> <Tooltip
<span color="secondary"
style={{ title={newActiondescription}
marginRight: 10, placement="left"
marginTop: "auto", >
marginBottom: "auto", <div style={{ display: "flex" }}>
}} <span
> style={{
{useIcon} marginRight: 10,
</span> marginTop: "auto",
<span style={{}}>{newActionname}</span> marginBottom: "auto",
</div> }}
>
{useIcon}
</span>
<span style={{}}>{newActionname}</span>
</div>
</Tooltip>
); );
}} }}
renderInput={(params) => { renderInput={(params) => {
return ( return (
<TextField <TextField
style={{ style={{
backgroundColor: theme.palette.inputColor, backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius, borderRadius: theme.palette.borderRadius,
}} }}
{...params} {...params}
label="Find Actions" label="Find Actions"
variant="outlined" variant="outlined"
/> />
); );
}} }}
/> />
frontend/src/views/AngularWorkflow.jsx
+38 -13
View File
@@ -2132,6 +2132,7 @@ const AngularWorkflow = (props) => {
if (data.id !== undefined && data.app_name !== undefined) { if (data.id !== undefined && data.app_name !== undefined) {
//newapps.push(data) //newapps.push(data)
workflow.actions.push(data) workflow.actions.push(data)
setWorkflow(workflow)
curaction = data curaction = data
} else { } else {
alert.error("Action not found. Please remake it."); alert.error("Action not found. Please remake it.");
@@ -2257,10 +2258,16 @@ const AngularWorkflow = (props) => {
cy.on("free", "node", (e) => onNodeDragStop(e, curaction)); cy.on("free", "node", (e) => onNodeDragStop(e, curaction));
} }
if (environments !== undefined && environments !== null) { console.log("Object: ", environments)
var env = environments.find((a) => a.Name === curaction.environment); if (environments !== undefined && environments !== null && (typeof environments === "array" || typeof environments === "object")) {
var parsedenv = environments
if (typeof environments === "object") {
parsedenv = [environments]
}
var env = parsedenv.find((a) => a.Name === curaction.environment);
if (!env || env === undefined) { if (!env || env === undefined) {
env = environments[defaultEnvironmentIndex]; env = parsedenv[defaultEnvironmentIndex];
} }
setSelectedActionEnvironment(env); setSelectedActionEnvironment(env);
@@ -2384,7 +2391,13 @@ const AngularWorkflow = (props) => {
// Finds the FIRST json only // Finds the FIRST json only
if (jsonvalid) { if (jsonvalid) {
exampledata = JSON.parse(foundResult.result); try {
exampledata = JSON.parse(foundResult.result)
} catch (e) {
console.log("Result: ", exampledata)
}
break; break;
} }
} }
@@ -2596,10 +2609,17 @@ const AngularWorkflow = (props) => {
} }
} }
const eventTarget = event.target.target()
console.log("BUTTON! Find parent from: ", eventTarget)
if (eventTarget.data("isButton") === true) {
console.log("ACTUALLY A BUTTON!")
}
if ( if (
event.target.target().data("isButton") === true || eventTarget.data("isDescriptor") === true ||
event.target.target().data("isDescriptor") === true eventTarget.data("type") === "COMMENT"
) { ) {
console.log("Removing because of descriptor or comment")
event.target.remove(); event.target.remove();
return; return;
} }
@@ -3152,9 +3172,9 @@ const AngularWorkflow = (props) => {
if (response.status !== 200) { if (response.status !== 200) {
console.log("Status not 200 for apps :O!"); console.log("Status not 200 for apps :O!");
if (isCloud) { if (isCloud) {
setEnvironments({ name: "Cloud", type: "cloud" }); setEnvironments([{ Name: "Cloud", Type: "cloud" }]);
} else { } else {
setEnvironments({ name: "Onprem", type: "onprem" }); setEnvironments([{ Name: "Onprem", Type: "onprem" }]);
} }
return; return;
@@ -3191,7 +3211,7 @@ const AngularWorkflow = (props) => {
// FIXME: Don't allow multiple in cloud yet. Cloud -> Onprem isn't stable. // FIXME: Don't allow multiple in cloud yet. Cloud -> Onprem isn't stable.
if (isCloud) { if (isCloud) {
setEnvironments({ name: "Cloud", type: "cloud" }); setEnvironments([{ Name: "Cloud", Type: "cloud" }]);
} else { } else {
setEnvironments(responseJson); setEnvironments(responseJson);
} }
@@ -3505,9 +3525,11 @@ const AngularWorkflow = (props) => {
const onNodeHover = (event) => { const onNodeHover = (event) => {
const nodedata = event.target.data(); const nodedata = event.target.data();
if (nodedata.finished === false) {
return; //console.log("NODE: ", nodedata)
} //if (nodedata.finished === false) {
// return;
//}
//var parentNode = cy.$("#" + event.target.data("id")); //var parentNode = cy.$("#" + event.target.data("id"));
//if (parentNode.data("isButton") || parentNode.data("buttonId")) return; //if (parentNode.data("isButton") || parentNode.data("buttonId")) return;
@@ -10141,6 +10163,9 @@ const AngularWorkflow = (props) => {
/* Copy the text inside the text field */ /* Copy the text inside the text field */
document.execCommand("copy"); document.execCommand("copy");
console.log("COPYING!");
alert.info("Copied value to clipboard, NOT json path.")
} else { } else {
console.log("Failed to copy from " + elementName + ": ", copyText); console.log("Failed to copy from " + elementName + ": ", copyText);
} }
@@ -10208,7 +10233,7 @@ const AngularWorkflow = (props) => {
/* Copy the text inside the text field */ /* Copy the text inside the text field */
document.execCommand("copy"); document.execCommand("copy");
console.log("COPYING!"); console.log("COPYING!");
alert.info("Copied value to clipboard.") alert.info("Copied JSON path to clipboard.")
} else { } else {
console.log("Couldn't find element ", elementName); console.log("Couldn't find element ", elementName);
} }
frontend/src/views/AppCreator.jsx
+115 -109
View File
@@ -1332,6 +1332,7 @@ const AppCreator = (props) => {
} }
} }
if (data.servers !== undefined && data.servers.length > 0) { if (data.servers !== undefined && data.servers.length > 0) {
var firstUrl = data.servers[0].url; var firstUrl = data.servers[0].url;
if ( if (
@@ -1366,123 +1367,128 @@ const AppCreator = (props) => {
//console.log("SECURITY: ", securitySchemes) //console.log("SECURITY: ", securitySchemes)
//if (Object.entries(securitySchemes) > 1 && //if (Object.entries(securitySchemes) > 1 &&
var newauth = []; var newauth = [];
for (const [key, value] of Object.entries(securitySchemes)) { try {
console.log(key, value); for (const [key, value] of Object.entries(securitySchemes)) {
if (key === "jwt") { console.log(key, value);
setAuthenticationOption("JWT"); if (key === "jwt") {
setAuthenticationRequired(true); setAuthenticationOption("JWT");
setAuthenticationRequired(true);
if ( if (
value.in !== undefined && value.in !== undefined &&
value.in !== null && value.in !== null &&
value.in.length > 0 value.in.length > 0
) { ) {
setParameterName(value.in); setParameterName(value.in);
} }
} else if (value.scheme === "bearer") { } else if (value.scheme === "bearer") {
setAuthenticationOption("Bearer auth"); setAuthenticationOption("Bearer auth");
setAuthenticationRequired(true); setAuthenticationRequired(true);
} else if (key === "Oauth2" || key === "Oauth2c") { } else if (key === "Oauth2" || key === "Oauth2c") {
//alert.info("Can't handle Oauth2 auth yet.") //alert.info("Can't handle Oauth2 auth yet.")
setAuthenticationOption("Oauth2"); setAuthenticationOption("Oauth2");
setAuthenticationRequired(true); setAuthenticationRequired(true);
//console.log("FLOW-1: ", value) //console.log("FLOW-1: ", value)
const flowkey = value.flow === undefined ? "flows" : "flow"; const flowkey = value.flow === undefined ? "flows" : "flow";
//console.log("FLOW: ", value[flowkey]) //console.log("FLOW: ", value[flowkey])
const basekey = const basekey =
value[flowkey].authorizationCode !== undefined value[flowkey].authorizationCode !== undefined
? "authorizationCode" ? "authorizationCode"
: "implicit"; : "implicit";
//console.log("FLOW2: ", value[flowkey][basekey]) //console.log("FLOW2: ", value[flowkey][basekey])
if ( if (
value[flowkey] !== undefined && value[flowkey] !== undefined &&
value[flowkey][basekey] !== undefined value[flowkey][basekey] !== undefined
) { ) {
if ( if (
value[flowkey][basekey].authorizationUrl !== undefined && value[flowkey][basekey].authorizationUrl !== undefined &&
parameterName.length === 0 parameterName.length === 0
) { ) {
setParameterName(value[flowkey][basekey].authorizationUrl); setParameterName(value[flowkey][basekey].authorizationUrl);
} }
var tokenUrl = ""; var tokenUrl = "";
if (value[flowkey][basekey].tokenUrl !== undefined) { if (value[flowkey][basekey].tokenUrl !== undefined) {
setParameterLocation(value[flowkey][basekey].tokenUrl); setParameterLocation(value[flowkey][basekey].tokenUrl);
tokenUrl = value[flowkey][basekey].tokenUrl; tokenUrl = value[flowkey][basekey].tokenUrl;
} else { } else {
setParameterLocation(""); setParameterLocation("");
} }
if (value[flowkey][basekey].refreshUrl !== undefined) { if (value[flowkey][basekey].refreshUrl !== undefined) {
setRefreshUrl(value[flowkey][basekey].refreshUrl); setRefreshUrl(value[flowkey][basekey].refreshUrl);
} else if (tokenUrl.length > 0) { } else if (tokenUrl.length > 0) {
setRefreshUrl(tokenUrl); setRefreshUrl(tokenUrl);
} }
if ( if (
value[flowkey][basekey].scopes !== undefined && value[flowkey][basekey].scopes !== undefined &&
value[flowkey][basekey].scopes !== null value[flowkey][basekey].scopes !== null
) { ) {
if (value[flowkey][basekey].scopes.length > 0) { if (value[flowkey][basekey].scopes.length > 0) {
setOauth2Scopes(value[flowkey][basekey].scopes); setOauth2Scopes(value[flowkey][basekey].scopes);
} else { } else {
var newscopes = []; var newscopes = [];
for (let [scopekey, scopevalue] of Object.entries( for (let [scopekey, scopevalue] of Object.entries(
value[flowkey][basekey].scopes value[flowkey][basekey].scopes
)) { )) {
if (scopekey.startsWith("http")) { if (scopekey.startsWith("http")) {
const scopekeysplit = scopekey.split("/"); const scopekeysplit = scopekey.split("/");
if (scopekeysplit.length < 5) { if (scopekeysplit.length < 5) {
console.log("Skipping scope: ", scopekey); console.log("Skipping scope: ", scopekey);
alert.info("Skipping scope: " + scopekey); alert.info("Skipping scope: " + scopekey);
continue; continue;
} }
//console.log("Checking scope for: ", scopekey, scopekeysplit.length) //console.log("Checking scope for: ", scopekey, scopekeysplit.length)
} }
newscopes.push(scopekey); newscopes.push(scopekey);
} }
setOauth2Scopes(newscopes); setOauth2Scopes(newscopes);
} }
} }
} else { } else {
console.log( console.log(
"Bad flowkey and basekey for oauth2: ", "Bad flowkey and basekey for oauth2: ",
flowkey, flowkey,
basekey basekey
); );
} }
} else if (key === "ApiKeyAuth") { } else if (key === "ApiKeyAuth" || key === "Token") {
setAuthenticationOption("API key"); setAuthenticationOption("API key");
value.in = value.in.charAt(0).toUpperCase() + value.in.slice(1); value.in = value.in.charAt(0).toUpperCase() + value.in.slice(1);
setParameterLocation(value.in); setParameterLocation(value.in);
if (!apikeySelection.includes(value.in)) { if (!apikeySelection.includes(value.in)) {
console.log("APIKEY SELECT: ", apikeySelection); console.log("APIKEY SELECT: ", apikeySelection);
alert.error("Might be error in setting up API key authentication"); alert.error("Might be error in setting up API key authentication");
} }
console.log("PARAM NAME: ", value.name); console.log("PARAM NAME: ", value.name);
setParameterName(value.name); setParameterName(value.name);
setAuthenticationRequired(true); setAuthenticationRequired(true);
} else if (value.scheme === "basic") { } else if (value.scheme === "basic") {
setAuthenticationOption("Basic auth"); setAuthenticationOption("Basic auth");
setAuthenticationRequired(true); setAuthenticationRequired(true);
} else if (value.scheme === "oauth2") { } else if (value.scheme === "oauth2") {
setAuthenticationOption("Oauth2"); setAuthenticationOption("Oauth2");
setAuthenticationRequired(true); setAuthenticationRequired(true);
} else { } else {
alert.error("Couldn't handle AUTH type: ", key); alert.error("Couldn't handle AUTH type: ", key);
//newauth.push({ //newauth.push({
// "name": key, // "name": key,
// "type": value.in, // "type": value.in,
// "example": "", // "example": "",
//}) //})
} }
} }
} catch (e) {
alert.error("Failed to handle auth")
console.log("Error: ", e)
}
if (newauth.length > 0) { if (newauth.length > 0) {
setExtraAuth(newauth); setExtraAuth(newauth);
@@ -2192,7 +2198,7 @@ const AppCreator = (props) => {
//console.log("Location: ", parameterLocation) //console.log("Location: ", parameterLocation)
//console.log("Name: ", parameterName) //console.log("Name: ", parameterName)
const extraKeys = ( const extraKeys = (
<div style={{ marginTop: 50 }}> <div style={{ marginTop: 50, marginRight: 25, }}>
<div style={{ display: "flex" }}> <div style={{ display: "flex" }}>
<Typography variant="body1">Extra authentication</Typography> <Typography variant="body1">Extra authentication</Typography>
{extraAuth.length === 0 ? ( {extraAuth.length === 0 ? (
@@ -4394,7 +4400,7 @@ const AppCreator = (props) => {
const imageInfo = ( const imageInfo = (
<img <img
crossorigin="anonymous" crossOrigin="anonymous"
src={imageData} src={imageData}
id="logo" id="logo"
style={{ style={{
frontend/src/views/Docs.jsx
+5 -2
View File
@@ -18,8 +18,8 @@ import {
import { Link as LinkIcon, Edit as EditIcon } from "@material-ui/icons"; import { Link as LinkIcon, Edit as EditIcon } from "@material-ui/icons";
const Body = { const Body = {
maxWidth: "1000px", maxWidth: 1000,
minWidth: "768px", minWidth: 768,
margin: "auto", margin: "auto",
display: "flex", display: "flex",
height: "100%", height: "100%",
@@ -81,6 +81,9 @@ const Docs = (props) => {
maxWidth: 250, maxWidth: 250,
flex: 1, flex: 1,
position: "fixed", position: "fixed",
maxHeight: "83vh",
overflowX: "hidden",
overflowY: "auto",
}; };
const fetchDocList = () => { const fetchDocList = () => {