Fixed frontend vulnerabilities

frontend/package.json

@@ -36,7 +36,7 @@
     "react-alert": "^5.5.0",
     "react-alert-template-basic": "^1.0.0",
     "react-beforeunload": "^2.2.1",
-    "react-chartjs-2": "^2.8.0",
+    "react-chartjs-2": "^2.11.1",
     "react-cookie": "^4.0.1",
     "react-cytoscapejs": "^1.2.0",
     "react-device-detect": "^1.9.10",
@@ -52,7 +52,7 @@
     "react-powerhooks": "0.0.7",
     "react-router": "^4.3.1",
     "react-router-dom": "^4.3.1",
-    "react-scripts": "^3.4.1",
+    "react-scripts": "^4.0.1",
     "reactstrap": "^7.1.0",
     "shellwords": "^0.1.1",
     "simplebar": "^4.2.3",

frontend/src/views/AppCreator.jsx

@@ -1702,7 +1702,7 @@ const AppCreator = (props) => {
 			<FormControl style={{backgroundColor: surfaceColor, color: "white",}}>
 				<DialogTitle><div style={{color: "white"}}>New action</div></DialogTitle>
 				<DialogContent>
-					<a target="_blank" href="https://shuffler.io/docs/apps#actions" style={{textDecoration: "none", color: "#f85a3e"}}>Learn more about actions</Link>
+					<a target="_blank" href="https://shuffler.io/docs/workflows#conditions" style={{textDecoration: "none", color: "#f85a3e"}}>Learn more about actions</a>
 					<div style={{marginTop: "15px"}}/>
 					Name
 					<TextField
@@ -2033,7 +2033,7 @@ const AppCreator = (props) => {
 		<div style={{color: "white"}}>
 			<h2>Actions ({actions.length})</h2>
 			Actions are the tasks performed by an app. Read more about actions and apps
-			<a target="_blank" href="https://shuffler.io/docs/apps#actions" style={{textDecoration: "none", color: "#f85a3e"}}> here</Link>.
+			<a target="_blank" src="https://shuffler.io/docs/apps#actions" style={{textDecoration: "none", color: "#f85a3e"}}> here</a>.
 			<div>
 				{loopActions}
 				<div style={{display: "flex"}}>

frontend/src/views/Apps.jsx

@@ -168,6 +168,10 @@ const Apps = (props) => {
 	})
 
 	function sortByKey(array, key) {
+		if (array === undefined || array === null) {
+			return []
+		}
+
     return array.sort(function(a, b) {
         var x = a[key];
         var y = b[key];
@@ -222,6 +226,7 @@ const Apps = (props) => {
 			return response.json()
 		})
     .then((responseJson) => {
+			console.log("Apps: ", responseJson)
 			responseJson = sortByKey(responseJson, "large_image")
 
 			setApps(responseJson)