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

Fixed most of the textfield and button problems from mui 18. Next is autocomplete

Browse Source
This commit is contained in:
Frikky
2023-08-15 21:58:00 +02:00
parent 2c140d23bd
commit bb8b14be64
4 changed files with 158 additions and 259 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/EditWorkflow.jsx
+53 -40
View File
@@ -26,6 +26,7 @@ import {
Typography,
Zoom,
CircularProgress,
Drawer,
Dialog,
DialogTitle,
DialogActions,
@@ -58,6 +59,7 @@ const EditWorkflow = (props) => {
const { globalUrl, workflow, setWorkflow, modalOpen, setModalOpen, showUpload, usecases, setNewWorkflow, appFramework, isEditing, userdata, } = props
const [_, setUpdate] = React.useState(""); // Used for rendering, don't remove
const [submitLoading, setSubmitLoading] = React.useState(false);
const [showMoreClicked, setShowMoreClicked] = React.useState(false);
const [innerWorkflow, setInnerWorkflow] = React.useState(workflow)
@@ -144,18 +146,17 @@ const EditWorkflow = (props) => {
var total_count = 0
return (
<Dialog
<Drawer
open={modalOpen}
onClose={() => {
setModalOpen(false);
}}
PaperProps={{
style: {
backgroundColor: theme.palette.surfaceColor,
color: "white",
minWidth: isMobile ? "90%" : 550,
maxWidth: isMobile ? "90%" : 550,
minHeight: 400,
minHeight: 400,
//minWidth: isMobile ? "90%" : newWorkflow === true ? 1000 : 550,
//maxWidth: isMobile ? "90%" : newWorkflow === true ? 1000 : 550,
},
@@ -220,11 +221,11 @@ const EditWorkflow = (props) => {
</DialogTitle>
<FormControl>
<DialogContent style={{paddingTop: 10, display: "flex", minHeight: 350, zIndex: 1001, }}>
<div style={{minWidth: newWorkflow ? 450 : 500, maxWidth: newWorkflow ? 450 : 500, }}>
<div style={{minWidth: newWorkflow ? 450 : 500, maxWidth: newWorkflow ? 450 : 500, }}>
<TextField
onBlur={(event) => {
setName(event.target.value)
}}
onChange={(event) => {
setName(event.target.value)
}}
InputProps={{
style: {
color: "white",
@@ -261,7 +262,7 @@ const EditWorkflow = (props) => {
</div>
<div style={{display: "flex", marginTop: 10, }}>
<MuiChipsInput
style={{ flex: 1, maxHeight: 40, marginTop: 12, overflow: "auto", }}
style={{ flex: 1, maxHeight: 40, }}
InputProps={{
style: {
color: "white",
@@ -271,6 +272,11 @@ const EditWorkflow = (props) => {
color="primary"
fullWidth
value={newWorkflowTags}
onChange={(chip) => {
console.log("Chip: ", chip)
//newWorkflowTags.push(chip);
setNewWorkflowTags(chip);
}}
onAdd={(chip) => {
newWorkflowTags.push(chip);
setNewWorkflowTags(newWorkflowTags);
@@ -486,41 +492,48 @@ const EditWorkflow = (props) => {
<Button
variant="contained"
style={{}}
disabled={name.length === 0}
disabled={name.length === 0 || submitLoading === true}
onClick={() => {
innerWorkflow.name = name
innerWorkflow.description = description
if (newWorkflowTags.length > 0) {
innerWorkflow.tags = newWorkflowTags
}
setSubmitLoading(true)
if (selectedUsecases.length > 0) {
innerWorkflow.usecase_ids = selectedUsecases
}
innerWorkflow.name = name
innerWorkflow.description = description
if (newWorkflowTags.length > 0) {
innerWorkflow.tags = newWorkflowTags
}
if (dueDate > 0) {
innerWorkflow.due_date = new Date(`${dueDate["$y"]}-${dueDate["$M"]+1}-${dueDate["$D"]}`).getTime()/1000
}
if (selectedUsecases.length > 0) {
innerWorkflow.usecase_ids = selectedUsecases
}
if (setNewWorkflow !== undefined) {
setNewWorkflow(
innerWorkflow.name,
innerWorkflow.description,
innerWorkflow.tags,
innerWorkflow.default_return_value,
innerWorkflow,
newWorkflow,
innerWorkflow.usecase_ids,
innerWorkflow.blogpost,
innerWorkflow.status,
)
setWorkflow({})
} else {
setWorkflow(innerWorkflow)
console.log("editing workflow: ", innerWorkflow)
}
setModalOpen(false)
if (dueDate > 0) {
innerWorkflow.due_date = new Date(`${dueDate["$y"]}-${dueDate["$M"]+1}-${dueDate["$D"]}`).getTime()/1000
}
if (setNewWorkflow !== undefined) {
setNewWorkflow(
innerWorkflow.name,
innerWorkflow.description,
innerWorkflow.tags,
innerWorkflow.default_return_value,
innerWorkflow,
newWorkflow,
innerWorkflow.usecase_ids,
innerWorkflow.blogpost,
innerWorkflow.status,
)
setWorkflow({})
} else {
setWorkflow(innerWorkflow)
console.log("editing workflow: ", innerWorkflow)
}
setSubmitLoading(true)
// If new workflow, don't close it
if (isEditing) {
setModalOpen(false)
}
}}
color="primary"
>
@@ -528,7 +541,7 @@ const EditWorkflow = (props) => {
</Button>
</DialogActions>
</FormControl>
</Dialog>
</Drawer>
)
}
frontend/src/theme.jsx
+2 -1
View File
@@ -17,8 +17,8 @@ const theme = createTheme(adaptV4Theme({
secondary: "rgba(255,255,255,0.7)",
},
type: "dark",
surfaceColor: "#27292d",
inputColor: "#383B40",
surfaceColor: "#27292d",
platformColor: "#1c1c1d",
backgroundColor: "#1a1a1a",
borderRadius: 5,
@@ -34,6 +34,7 @@ const theme = createTheme(adaptV4Theme({
borderRadius: 5,
},
innerTextfieldStyle: {
// Removed since upgrading to mui 18
//color: "white",
//minHeight: 50,
//marginLeft: "5px",
frontend/src/views/AngularWorkflow.jsx
+102 -217
View File
@@ -22,6 +22,8 @@ import algoliasearch from 'algoliasearch/lite';
import {
Zoom,
Fade,
Avatar,
Popover,
TextField,
@@ -46,7 +48,6 @@ import {
IconButton,
Menu,
Input,
Fade,
FormGroup,
FormControlLabel,
Typography,
@@ -221,9 +222,6 @@ export const triggers = [
];
// is_valid: cloudSyncEnabled || isCloud ? true : false,
const surfaceColor = "#27292D";
const inputColor = "#383B40";
// http://apps.cytoscape.org/apps/yfileslayoutalgorithms
cytoscape.use(edgehandles);
//cytoscape.use(clipboard);
@@ -5899,7 +5897,7 @@ const AngularWorkflow = (defaultprops) => {
maxWidth: isMobile ? 50 : "100%",
marginTop: "5px",
color: "white",
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
cursor: "pointer",
display: "flex",
};
@@ -5912,7 +5910,7 @@ const AngularWorkflow = (defaultprops) => {
maxWidth: "100%",
marginTop: "5px",
color: "white",
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
cursor: "pointer",
display: "flex",
};
@@ -6014,7 +6012,7 @@ const AngularWorkflow = (defaultprops) => {
open={open}
PaperProps={{
style: {
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
},
}}
onClose={() => {
@@ -6024,7 +6022,7 @@ const AngularWorkflow = (defaultprops) => {
>
<MenuItem
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
color: "white",
}}
onClick={() => {
@@ -6050,7 +6048,7 @@ const AngularWorkflow = (defaultprops) => {
</MenuItem>
<MenuItem
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
color: "white",
}}
onClick={() => {
@@ -6259,7 +6257,7 @@ const AngularWorkflow = (defaultprops) => {
<Grid item>
<FavoriteBorderIcon style={iconStyle} />
</Grid>
{isMobile ? null : <Grid item>Variables</Grid>}
{isMobile ? null : <Grid item>Vars</Grid>}
</Grid>
}
style={tabStyle}
@@ -6992,10 +6990,6 @@ const AngularWorkflow = (defaultprops) => {
style={{ backgroundColor: theme.palette.inputColor, borderRadius: theme.palette.borderRadius, maxWidth: leftBarSize - 20, }}
InputProps={{
style: {
color: "white",
fontSize: "1em",
height: 50,
margin: 0,
},
startAdornment: (
<InputAdornment position="start">
@@ -7202,18 +7196,13 @@ const AngularWorkflow = (defaultprops) => {
<div style={{ flex: "1" }}>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
marginTop: 5,
marginRight: 10,
}}
InputProps={{
style: {
color: "white",
minHeight: 50,
marginLeft: "5px",
maxWidth: "95%",
fontSize: "1em",
},
endAdornment: (
<InputAdornment position="end">
@@ -7254,11 +7243,13 @@ const AngularWorkflow = (defaultprops) => {
delay += 75
return (
runDelay ?
<Zoom key={index} in={true} style={{ transitionDelay: `${delay}ms` }}>
<span>
{/*<Zoom key={index} in={true} style={{ transitionDelay: `${delay}ms` }}>*/}
<div>
<ParsedAppPaper key={index} app={app} />
</div>
</Zoom>
{/*</Zoom>*/}
</span>
:
<div key={index}>
{extraMessage}
@@ -7902,16 +7893,11 @@ const AngularWorkflow = (defaultprops) => {
var datafield = (
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
minHeight: 50,
marginLeft: "5px",
maxWidth: "95%",
fontSize: "1em",
},
}}
fullWidth
@@ -8068,7 +8054,7 @@ const AngularWorkflow = (defaultprops) => {
return (
<MenuItem
key={data.name}
style={{ backgroundColor: inputColor, color: "white" }}
style={{ backgroundColor: theme.palette.inputColor, color: "white" }}
value={data}
onMouseOver={() => {
if (data.type === "Execution Argument") {
@@ -8106,7 +8092,7 @@ const AngularWorkflow = (defaultprops) => {
const menuItemStyle = {
color: "white",
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
};
const conditionsModal = (
@@ -8122,7 +8108,7 @@ const AngularWorkflow = (defaultprops) => {
PaperProps={{
style: {
pointerEvents: "auto",
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
color: "white",
minWidth: isMobile ? "90%" : 800,
border: theme.palette.defaultBorder,
@@ -8227,7 +8213,7 @@ const AngularWorkflow = (defaultprops) => {
anchorEl={variableAnchorEl}
PaperProps={{
style: {
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
},
}}
onClose={() => {
@@ -8460,7 +8446,7 @@ const AngularWorkflow = (defaultprops) => {
maxWidth: "100%",
marginTop: "5px",
color: "white",
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
cursor: "pointer",
display: "flex",
};
@@ -8571,7 +8557,7 @@ const AngularWorkflow = (defaultprops) => {
open={open}
PaperProps={{
style: {
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
},
}}
onClose={() => {
@@ -8580,7 +8566,7 @@ const AngularWorkflow = (defaultprops) => {
}}
>
<MenuItem
style={{ backgroundColor: inputColor, color: "white" }}
style={{ backgroundColor: theme.palette.inputColor, color: "white" }}
onClick={() => {
duplicateCondition(index);
}}
@@ -8589,7 +8575,7 @@ const AngularWorkflow = (defaultprops) => {
{"Duplicate"}
</MenuItem>
<MenuItem
style={{ backgroundColor: inputColor, color: "white" }}
style={{ backgroundColor: theme.palette.inputColor, color: "white" }}
onClick={() => {
setOpen(false);
deleteCondition(index);
@@ -9158,7 +9144,7 @@ const AngularWorkflow = (defaultprops) => {
<option
key={folder.displayName}
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
fontSize: "1.2em",
}}
value={folder.displayName}
@@ -9259,16 +9245,11 @@ const AngularWorkflow = (defaultprops) => {
<div>Name</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -9281,16 +9262,11 @@ const AngularWorkflow = (defaultprops) => {
Environment:
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
required
@@ -10019,16 +9995,11 @@ const AngularWorkflow = (defaultprops) => {
<Typography>Name</Typography>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -10049,11 +10020,7 @@ const AngularWorkflow = (defaultprops) => {
<TextField
style={{
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
color: "white",
width: 50,
height: 50,
fontSize: "1em",
maxWidth: 50,
}}
InputProps={{
style: theme.palette.innerTextfieldStyle,
@@ -10378,10 +10345,6 @@ const AngularWorkflow = (defaultprops) => {
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
fontSize: "1em",
},
endAdornment: (
<InputAdornment position="end">
@@ -10440,11 +10403,6 @@ const AngularWorkflow = (defaultprops) => {
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
fontSize: "1em",
height: 50,
},
}}
fullWidth
@@ -10525,15 +10483,11 @@ const AngularWorkflow = (defaultprops) => {
<div>Name</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
fontSize: "1em",
},
}}
multiline
@@ -10552,16 +10506,11 @@ const AngularWorkflow = (defaultprops) => {
<div>Height</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -10578,16 +10527,11 @@ const AngularWorkflow = (defaultprops) => {
<div>Width</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -10606,16 +10550,11 @@ const AngularWorkflow = (defaultprops) => {
<div>Background</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -10632,16 +10571,11 @@ const AngularWorkflow = (defaultprops) => {
<div>Text Color</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -10658,16 +10592,11 @@ const AngularWorkflow = (defaultprops) => {
<div style={{ marginTop: 15, }}>Background-Image</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -10769,16 +10698,11 @@ const AngularWorkflow = (defaultprops) => {
<div>Name</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -10800,7 +10724,7 @@ const AngularWorkflow = (defaultprops) => {
},
}}
filterOptions={(options, { inputValue }) => {
//console.log("Option contains?: ", inputValue, options)
console.log("Option contains?: ", inputValue, options)
const lowercaseValue = inputValue.toLowerCase()
options = options.filter(x => x.name.replaceAll("_", " ").toLowerCase().includes(lowercaseValue) || x.description.toLowerCase().includes(lowercaseValue))
@@ -10928,7 +10852,7 @@ const AngularWorkflow = (defaultprops) => {
setUpdate(Math.random());
}}
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
color: "white",
height: 50,
}}
@@ -10941,7 +10865,7 @@ const AngularWorkflow = (defaultprops) => {
return (
<MenuItem
key={data}
style={{ backgroundColor: inputColor, color: "white" }}
style={{ backgroundColor: theme.palette.inputColor, color: "white" }}
value={data}
>
{data}
@@ -10984,7 +10908,7 @@ const AngularWorkflow = (defaultprops) => {
</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
id="webhook_uri_field"
@@ -11009,11 +10933,6 @@ const AngularWorkflow = (defaultprops) => {
}
InputProps={{
style: {
color: "white",
height: 50,
marginLeft: "5px",
maxWidth: "95%",
fontSize: "1em",
},
endAdornment:
<InputAdornment position="end">
@@ -11121,17 +11040,13 @@ const AngularWorkflow = (defaultprops) => {
<div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
id="webhook_uri_header"
onClick={() => { }}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
fontSize: "1em",
},
}}
fullWidth
@@ -11178,17 +11093,13 @@ const AngularWorkflow = (defaultprops) => {
<div style={{ marginBottom: 20, }}>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
id="webhook_uri_header"
onClick={() => { }}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
fontSize: "1em",
},
}}
fullWidth
@@ -11213,7 +11124,7 @@ const AngularWorkflow = (defaultprops) => {
</div>
{isCloud && workflow.triggers[selectedTriggerIndex].parameters.length > 4 ?
<FormGroup
style={{ paddingLeft: 10, backgroundColor: inputColor, marginBottom: 50, }}
style={{ paddingLeft: 10, backgroundColor: theme.palette.inputColor, marginBottom: 50, }}
row
>
<FormControlLabel
@@ -11589,16 +11500,11 @@ const AngularWorkflow = (defaultprops) => {
<div>Name</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -11611,7 +11517,7 @@ const AngularWorkflow = (defaultprops) => {
Environment:
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
@@ -11663,16 +11569,11 @@ const AngularWorkflow = (defaultprops) => {
</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
marginTop: "3px",
fontSize: "1em",
},
}}
fullWidth
@@ -11708,7 +11609,7 @@ const AngularWorkflow = (defaultprops) => {
</div>
</div>
<FormGroup
style={{ paddingLeft: 10, backgroundColor: inputColor }}
style={{ paddingLeft: 10, backgroundColor: theme.palette.inputColor }}
row
>
<FormControlLabel
@@ -11844,7 +11745,7 @@ const AngularWorkflow = (defaultprops) => {
workflow.triggers[selectedTriggerIndex].parameters[2].value.includes("email") ? (
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
marginTop: 10,
}}
@@ -11877,17 +11778,12 @@ const AngularWorkflow = (defaultprops) => {
].parameters[2].value.includes("sms") ? (
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
marginTop: 10,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -11967,16 +11863,11 @@ const AngularWorkflow = (defaultprops) => {
<div>Name</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -12016,7 +11907,7 @@ const AngularWorkflow = (defaultprops) => {
setUpdate(Math.random());
}}
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
color: "white",
height: 50,
}}
@@ -12029,7 +11920,7 @@ const AngularWorkflow = (defaultprops) => {
return (
<MenuItem
key={data}
style={{ backgroundColor: inputColor, color: "white" }}
style={{ backgroundColor: theme.palette.inputColor, color: "white" }}
value={data}
>
{data}
@@ -12071,16 +11962,11 @@ const AngularWorkflow = (defaultprops) => {
</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
height: 50,
marginLeft: "5px",
maxWidth: "95%",
fontSize: "1em",
},
}}
fullWidth
@@ -12126,16 +12012,11 @@ const AngularWorkflow = (defaultprops) => {
</div>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
marginTop: "3px",
fontSize: "1em",
},
}}
disabled={
@@ -12562,9 +12443,6 @@ const AngularWorkflow = (defaultprops) => {
id="execution_argument_input_field"
style={theme.palette.textFieldStyle}
disabled={workflow.public}
InputProps={{
style: theme.palette.innerTextfieldStyle,
}}
color="secondary"
placeholder={"Execution Argument"}
defaultValue={executionText}
@@ -12986,11 +12864,12 @@ const AngularWorkflow = (defaultprops) => {
{defaultReturn}
</SwipeableDrawer>
:
<Fade in={true} style={{ transitionDelay: `$0ms` }}>
<span>
{/*<Fade in={true} style={{ transitionDelay: `$0ms` }}>*/}
<div id="rightside_actions" style={rightsidebarStyle}>
{defaultReturn}
</div>
</Fade>
</span>
);
//return null;
@@ -13316,11 +13195,11 @@ const AngularWorkflow = (defaultprops) => {
color: "white",
marginBottom: 10,
padding: 5,
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
cursor: "pointer",
display: "flex",
minHeight: 40,
maxHeight: 40,
minHeight: 50,
maxHeight: 50,
};
const parsedExecutionArgument = () => {
@@ -13766,7 +13645,6 @@ const AngularWorkflow = (defaultprops) => {
overflow: "auto",
minWidth: isMobile ? "100%" : 420,
maxWidth: isMobile ? "100%" : 420,
backgroundColor: "#1F2023",
color: "white",
fontSize: 18,
zIndex: 10005,
@@ -13864,7 +13742,8 @@ const AngularWorkflow = (defaultprops) => {
}
return (
<Zoom key={index} in={true} style={{ transitionDelay: `${executionDelay}ms` }}>
<span>
{/*<Zoom key={index} in={true} style={{ transitionDelay: `${executionDelay}ms` }}>*/}
<div>
<Tooltip
key={data.execution_id}
@@ -14020,16 +13899,32 @@ const AngularWorkflow = (defaultprops) => {
</Paper>
</Tooltip>
</div>
</Zoom>
</span>
);
})}
</div>
) : (
<div>There are no executions yet, or they are not loaded.</div>
<div>
<Typography>
There are no executions yet, or they are not loaded.
</Typography>
<Button
variant="contained"
style={{
marginTop: 30,
marginLeft: 50,
}}
onClick={() => {
executeWorkflow(executionText, workflow.start, lastSaved);
}}
>
Test Workflow <PlayArrowIcon style={{marginLeft: 15, }} />
</Button>
</div>
)}
</div>
) : (
<div style={{ padding: isMobile ? "0px 10px 25px 10px" : "25px 15px 25px 15px", maxWidth: isMobile ? "100%" : 365, overflowX: "hidden" }}>
<div style={{ padding: isMobile ? "0px 10px 25px 10px" : "25px 15px 25px 15px", maxWidth: isMobile ? "100%" : 400, overflowX: "hidden" }}>
<Breadcrumbs
aria-label="breadcrumb"
separator="›"
@@ -14071,7 +13966,7 @@ const AngularWorkflow = (defaultprops) => {
}}
/>
<div style={{ display: "flex", marginLeft: 10, }}>
<h2>Execution info</h2>
<h2>Details</h2>
<Tooltip
color="primary"
title="Rerun workflow"
@@ -14206,7 +14101,7 @@ const AngularWorkflow = (defaultprops) => {
style={{
backgroundColor: "rgba(255,255,255,0.6)",
marginTop: 15,
marginBottom: 30,
marginBottom: 20,
}}
/>
{executionData.results !== undefined &&
@@ -14241,14 +14136,14 @@ const AngularWorkflow = (defaultprops) => {
executionData.status !== "FAILURE" &&
executionData.status !== "WAITING" &&
!(executionData.results === undefined || executionData.results === null || (executionData.results.length === 0 && executionData.status === "EXECUTING")) ? (
<div style={{ display: "flex" }}>
<CircularProgress style={{ height: 45, width: 45, marginLeft: 20, marginRight: 20, }} onClick={() => {
console.log(environments, defaultEnvironmentIndex, nonskippedResults)
}} />
<div style={{}}>
<CircularProgress style={{marginLeft: 145, marginBottom: 10, }} onClick={() => {
console.log(environments, defaultEnvironmentIndex, nonskippedResults)
}} />
{environments.length > 0 && defaultEnvironmentIndex < environments.length && nonskippedResults.length === 0 && environments[defaultEnvironmentIndex].Name !== "Cloud" ?
<Typography variant="body2" color="textSecondary" style={{}}>
No results yet. Is Orborus running for the "{environments[defaultEnvironmentIndex].Name}" environment? <a href="/admin?tab=environments" rel="noopener noreferrer" target="_blank" style={{ textDecoration: "none", color: "#f86a3e" }}>Learn more</a>. If the Workflow doesn't start within 30 seconds with Orborus running, contact support: <a href="mailto:support@shuffler.io" rel="noopener noreferrer" target="_blank" style={{ textDecoration: "none", color: "#f86a3e" }}>support@shuffler.io</a>
No results yet. Is Orborus running for the "{environments[defaultEnvironmentIndex].Name}" environment? <a href="/admin?tab=environments" rel="noopener noreferrer" target="_blank" style={{ textDecoration: "none", color: "#f86a3e" }}>Find out here</a>. If the Workflow doesn't start within 30 seconds with Orborus running, contact support: <a href="mailto:support@shuffler.io" rel="noopener noreferrer" target="_blank" style={{ textDecoration: "none", color: "#f86a3e" }}>support@shuffler.io</a>
</Typography>
: null}
</div>
@@ -14256,12 +14151,12 @@ const AngularWorkflow = (defaultprops) => {
</div>
</div>
{
executionData.results === undefined ||
executionData.results === undefined ||
executionData.results === null ||
(executionData.results.length === 0 && executionData.status === "EXECUTING") ? (
<div style={{ display: "flex" }}>
<CircularProgress style={{ height: 45, width: 45, marginLeft: 20, marginRight: 20, }} />
<div style={{}}>
<CircularProgress style={{marginLeft: 145, marginBottom: 10, }} />
{environments.length > 0 && defaultEnvironmentIndex < environments.length && nonskippedResults.length === 0 && environments[defaultEnvironmentIndex].Name !== "Cloud" ?
<Typography variant="body2" color="textSecondary" style={{}}>
No results yet. Is Orborus running for the "{environments[defaultEnvironmentIndex].Name}" environment? <a href="/admin?tab=environments" rel="noopener noreferrer" target="_blank" style={{ textDecoration: "none", color: "#f86a3e" }}>Learn more</a>. If the Workflow doesn't start within 30 seconds with Orborus running, contact support: <a href="mailto:support@shuffler.io" rel="noopener noreferrer" target="_blank" style={{ textDecoration: "none", color: "#f86a3e" }}>support@shuffler.io</a>
@@ -14755,7 +14650,7 @@ const AngularWorkflow = (defaultprops) => {
PaperProps={{
style: {
pointerEvents: "auto",
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
color: "white",
minWidth: isMobile ? "90%" : 650,
padding: 30,
@@ -15066,7 +14961,8 @@ const AngularWorkflow = (defaultprops) => {
</Typography>
</div>
) : (
<Fade in={true} timeout={1000} style={{ transitionDelay: `${150}ms` }}>
<span>
{/*<Fade in={true} timeout={1000} style={{ transitionDelay: `${150}ms` }}>*/}
<CytoscapeComponent
elements={elements}
minZoom={0.35}
@@ -15075,7 +14971,7 @@ const AngularWorkflow = (defaultprops) => {
style={{
width: cytoscapeWidth,
height: bodyHeight - appBarSize - 5,
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
}}
stylesheet={cystyle}
boxSelectionEnabled={true}
@@ -15089,7 +14985,7 @@ const AngularWorkflow = (defaultprops) => {
setCy(incy);
}}
/>
</Fade>
</span>
)}
</div>
{executionModal}
@@ -15165,7 +15061,7 @@ const AngularWorkflow = (defaultprops) => {
PaperProps={{
style: {
pointerEvents: "auto",
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
color: "white",
border: theme.palette.defaultBorder,
maxWidth: isMobile ? bodyWidth - 100 : 800,
@@ -15343,7 +15239,7 @@ const AngularWorkflow = (defaultprops) => {
PaperProps={{
style: {
pointerEvents: "auto",
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
color: "white",
border: theme.palette.defaultBorder,
maxWidth: isMobile ? bodyWidth - 100 : "100%",
@@ -15632,16 +15528,11 @@ const AngularWorkflow = (defaultprops) => {
<b>Name - what is this used for?</b>
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -15714,16 +15605,11 @@ const AngularWorkflow = (defaultprops) => {
) : (
<TextField
style={{
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
borderRadius: theme.palette.borderRadius,
}}
InputProps={{
style: {
color: "white",
marginLeft: "5px",
maxWidth: "95%",
height: 50,
fontSize: "1em",
},
}}
fullWidth
@@ -15780,7 +15666,6 @@ const AngularWorkflow = (defaultprops) => {
open={configureWorkflowModalOpen}
PaperProps={{
style: {
backgroundColor: surfaceColor,
color: "white",
minWidth: 650,
border: theme.palette.defaultBorder,
@@ -15844,7 +15729,7 @@ const AngularWorkflow = (defaultprops) => {
PaperProps={{
style: {
pointerEvents: "auto",
backgroundColor: surfaceColor,
backgroundColor: theme.palette.surfaceColor,
color: "white",
minWidth: 1100,
minHeight: 700,
@@ -15965,7 +15850,7 @@ const AngularWorkflow = (defaultprops) => {
<div
style={{
flex: 3,
borderLeft: `1px solid ${inputColor}`,
borderLeft: `1px solid ${theme.palette.inputColor}`,
padding: "70px 30px 30px 30px",
maxHeight: 630,
minHeight: 630,
@@ -15987,7 +15872,7 @@ const AngularWorkflow = (defaultprops) => {
style={{
marginTop: 25,
marginBottom: 25,
backgroundColor: inputColor,
backgroundColor: theme.palette.inputColor,
}}
/>
<Typography variant="h6">
@@ -16721,7 +16606,7 @@ const AngularWorkflow = (defaultprops) => {
: null}
{/*selectionOpen === true ?
<div style={{ borderRadius: theme.palette.borderRadius, backgroundColor: surfaceColor, zIndex: 12501,position:"fixed", left: 190, bottom: 20,top:70, width: 950, overflowY: "scroll"}}>
<div style={{ borderRadius: theme.palette.borderRadius, backgroundColor: theme.palette.surfaceColor, zIndex: 12501,position:"fixed", left: 190, bottom: 20,top:70, width: 950, overflowY: "scroll"}}>
<div>
<IconButton
style={{
frontend/src/views/Workflows.jsx
+1 -1
View File
@@ -1263,12 +1263,12 @@ const Workflows = (props) => {
overflow: "hidden",
width: "100%",
color: "white",
backgroundColor: theme.palette.surfaceColor,
padding: "12px 12px 0px 15px",
borderRadius: 5,
display: "flex",
boxSizing: "border-box",
position: "relative",
backgroundColor: theme.palette.surfaceColor,
};
const gridContainer = {