Added extra authentication checker to workflow configuration popup

frontend/src/components/ConfigureWorkflow.jsx

@@ -2,6 +2,7 @@ import React, {useState} from 'react';
 
 import { InputAdornment, Tooltip, TextField, CircularProgress, ButtonGroup, Button, Avatar, ListItemAvatar, Typography, List, ListItem, ListItemText} from '@material-ui/core';
 import {FavoriteBorder as FavoriteBorderIcon} from '@material-ui/icons';
+import { FixName } from "../views/Apps.jsx";
 
 // Handles workflow updates on first open to highlight the issues of the workflow
 // Variables
@@ -88,8 +89,22 @@ const Workflow = (props) => {
 				newaction.must_activate = true
 			} else {
 				if (action.authentication_id === "" && app.authentication.required === true) {
-					newaction.must_authenticate = true
+					// Check if configuration is filled or not
-					newaction.action_ids.push(action.id)
+					var filled = true 
+					for (var key in 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) {
+								filled = false
+								break
+							}
+						}
+					}
+
+					if (!filled) {
+						newaction.must_authenticate = true
+						newaction.action_ids.push(action.id)
+					}
 				}
 
 				newaction.app = app
@@ -339,7 +354,7 @@ const Workflow = (props) => {
 						</Avatar>
 					</ListItemAvatar>
 					<ListItemText
-						primary={action.app_name}
+						primary={FixName(action.app_name)}
 						secondary={action.app_version}
 						style={{}}
 					/>

frontend/src/views/AngularWorkflow.jsx

@@ -6554,6 +6554,15 @@ const AngularWorkflow = (props) => {
 							</Button> 				
 						</span>
 					</Tooltip>
+					<Tooltip color="secondary" title="Undo" placement="top-start">
+						<span>	
+						<Button disabled={history.length === 0} color="primary" style={{height: 50, marginLeft: 10, }} variant="outlined" onClick={(event) => {
+							handleHistoryUndo(history)
+						}}>
+							<UndoIcon />
+						</Button>
+						</span>	
+					</Tooltip>
 					<Tooltip color="secondary" title="Remove selected item (del)" placement="top-start">
 						<span>
 						<Button color="primary" disabled={workflow.public} style={{height: 50, marginLeft: 10, }} variant="outlined" onClick={() => {
@@ -6575,17 +6584,6 @@ const AngularWorkflow = (props) => {
 					</Tooltip>	
 					{/* <FileMenu />	*/}
 					{workflow.configuration !== null && workflow.configuration !== undefined && workflow.configuration.exit_on_error !== undefined ? <WorkflowMenu />	 : null}
-					{history.length > 0 ?
-						<Tooltip color="secondary" title="Undo" placement="top-start">
-							<span>	
-							<Button color="primary" style={{height: 50, marginLeft: 10, }} variant="outlined" onClick={(event) => {
-								handleHistoryUndo(history)
-							}}>
-								<UndoIcon />
-							</Button>
-							</span>	
-						</Tooltip>
-					: null}
 				</div>
 			</div>
 		)

frontend/src/views/Apps.jsx

@@ -20,6 +20,13 @@ const chipStyle = {
 	backgroundColor: "#3d3f43", height: 30, marginRight: 5, paddingLeft: 5, paddingRight: 5, height: 28, cursor: "pointer", borderColor: "#3d3f43", color: "white",
 }
 
+// Fixes names by making them uppercase and such
+// Used for labels. A lot of places don't use this yet
+export const FixName = (name) => {
+	const newAppname = (name.charAt(0).toUpperCase()+name.substring(1)).replaceAll("_", " ")
+	return newAppname
+}
+
 // Parses JSON data into keys that can be used everywhere :)
 export const GetParsedPaths = (inputdata, basekey) => {
 	const splitkey = " > "