#133: Added first part of example and body parser

frontend/src/views/AngularWorkflow.jsx

@@ -845,7 +845,7 @@ const AngularWorkflow = (props) => {
 
 			return response.json()
 		})
-    	.then((responseJson) => {
+    .then((responseJson) => {
 			// FIXME - handle versions on left bar
 			//handleAppVersioning(responseJson)
 			//var tmpapps = []
@@ -2872,8 +2872,64 @@ const AngularWorkflow = (props) => {
 							placeholder = data.example
 						}
 
+						var disabled = false
+						var rows = "5"
+						var openApiHelperText = "This is an OpenAPI specific field"
+						if (selectedApp.generated && selectedApp.activated && data.name === "body") {
+							const regex = /\${(\w+)}/g
+							const found = placeholder.match(regex)
+							console.log("THERE MAY BE THINGS INSIDE THE BODY, NO: ", found)
+							if (found === null) {
+								//setExtraBodyFields([])
+							} else {
+								rows = "1"
+								disabled = true
+								openApiHelperText = "OpenAPI spec: fill the following fields."
+								console.log("SHOULD ADD TO selectedActionParameters!: ", found, selectedActionParameters)
+								var changed = false
+								for (var specKey in found) {
+									const tmpitem = found[specKey]
+									var skip = false
+									for (var innerkey in selectedActionParameters) {
+										if (selectedActionParameters[innerkey].name === tmpitem) {
+											skip = true
+											break
+										}
+									}
+
+									if (skip) {
+										console.log("SKIPPING ", tmpitem)
+										continue 
+									}
+
+									changed = true 
+									selectedActionParameters.push({
+										action_field: "",
+										configuration: false,
+										description: "Generated by OpenAPI body example",
+										example: "",
+										id: "",
+										multiline: false,
+										name: tmpitem,
+										options: null,
+										required: false,
+										schema: {type: "string"},
+										skip_multicheck: false,
+										tags: null,
+										value: "",
+										variant: "STATIC_VALUE",
+									})
+								}
+
+								if (changed) {
+									setSelectedActionParameters(selectedActionParameters)
+								}
+							}
+						}
+
 						var datafield = 
 							<TextField
+								disabled={disabled}
 								style={{backgroundColor: inputColor, borderRadius: borderRadius,}} 
 								InputProps={{
 									style:{
@@ -2901,7 +2957,7 @@ const AngularWorkflow = (props) => {
 								}}
 								fullWidth
 								multiline={multiline}
-								rows="5"
+								rows={rows}
 								color="primary"
 								defaultValue={data.value}
 								type={placeholder.includes("***") ? "password" : "text"}
@@ -2909,6 +2965,13 @@ const AngularWorkflow = (props) => {
 								onChange={(event) => {
 									changeActionParameter(event, count)
 								}}
+								helperText={selectedApp.generated && selectedApp.activated && data.name === "body" ? 
+									<span style={{color:"white", marginBottom: 5,}}>
+										{openApiHelperText}
+									</span>
+									: 
+									null
+								}
 								onBlur={(event) => {
 									// Super basic check
 									//if (event.target.value.startsWith("{")) {
@@ -3303,7 +3366,7 @@ const AngularWorkflow = (props) => {
 									<div style={{width: 17, height: 17, borderRadius: 17 / 2, backgroundColor: itemColor, marginRight: 10}}/>
 								}
 								<div style={{flex: "10"}}> 
-									<b>{data.name} </b> 
+									<b>{data.name.charAt(0).toUpperCase()+data.name.substring(1)} </b> 
 								</div>
 
 								{selectedActionParameters[count].options !== undefined && selectedActionParameters[count].options !== null && selectedActionParameters[count].options.length > 0  ? null : 
@@ -3685,7 +3748,7 @@ const AngularWorkflow = (props) => {
 					{selectedAction.description}
 				</div> : null}
 				<div style={{marginTop: "10px", borderColor: "white", borderWidth: "2px", marginBottom: 200}}>
-						<AppActionArguments key={selectedAction.id} selectedAction={selectedAction} />
+					<AppActionArguments key={selectedAction.id} selectedAction={selectedAction} />
 
 				</div>
 				<div style={{}}>
@@ -6253,6 +6316,11 @@ const AngularWorkflow = (props) => {
 			getAppAuthentication() 
 			setUpdate(authenticationOption.id)
 
+			/*
+				{selectedAction.authentication.map(data => (
+				<MenuItem key={data.id} style={{backgroundColor: inputColor, color: "white"}} value={data}>
+			*/
+
 		}
 
 		return (