Minor sdk update

frontend/src/components/Header.jsx

@@ -216,44 +216,44 @@ const { globalUrl, setNotifications, notifications, isLoggedIn, removeCookie, ho
 	const NotificationItem = (props) => {
 		const {data} = props
 
-    var image = "";
-    var orgName = "";
-    var orgId = "";
-    if (userdata.orgs !== undefined) {
-      const foundOrg = userdata.orgs.find((org) => org.id === data["org_id"]);
-      if (foundOrg !== undefined && foundOrg !== null) {
-        //position: "absolute", bottom: 5, right: -5,
-        const imageStyle = {
-          width: imagesize,
-          height: imagesize,
-          pointerEvents: "none",
-          marginLeft: data.creator_org !== undefined && data.creator_org.length > 0 ? 20 : 0,
-          borderRadius: 10,
-          border: foundOrg.id === userdata.active_org.id ? `3px solid ${boxColor}` : null,
-          cursor: "pointer",
-          marginRight: 10,
-        };
+		var image = "";
+		var orgName = "";
+		var orgId = "";
+		if (userdata.orgs !== undefined) {
+		  const foundOrg = userdata.orgs.find((org) => org.id === data["org_id"]);
+		  if (foundOrg !== undefined && foundOrg !== null) {
+			//position: "absolute", bottom: 5, right: -5,
+			const imageStyle = {
+			  width: imagesize,
+			  height: imagesize,
+			  pointerEvents: "none",
+			  marginLeft: data.creator_org !== undefined && data.creator_org.length > 0 ? 20 : 0,
+			  borderRadius: 10,
+			  border: foundOrg.id === userdata.active_org.id ? `3px solid ${boxColor}` : null,
+			  cursor: "pointer",
+			  marginRight: 10,
+			};
 
-        image =
-          foundOrg.image === "" ? (
-            <img
-              alt={foundOrg.name}
-              src={theme.palette.defaultImage}
-              style={imageStyle}
-            />
-          ) : (
-            <img
-              alt={foundOrg.name}
-              src={foundOrg.image}
-              style={imageStyle}
-              onClick={() => {}}
-            />
-          );
+			image =
+			  foundOrg.image === "" ? (
+				<img
+				  alt={foundOrg.name}
+				  src={theme.palette.defaultImage}
+				  style={imageStyle}
+				/>
+			  ) : (
+				<img
+				  alt={foundOrg.name}
+				  src={foundOrg.image}
+				  style={imageStyle}
+				  onClick={() => {}}
+				/>
+			  );
 
-        orgName = foundOrg.name;
-        orgId = foundOrg.id;
-      }
-    }
+			orgName = foundOrg.name;
+			orgId = foundOrg.id;
+		  }
+		}
 
 		return (
 			<Paper style={{backgroundColor: theme.palette.surfaceColor, width: notificationWidth, padding: 25, borderBottom: "1px solid rgba(255,255,255,0.4)"}}>

frontend/src/components/NewHeader.jsx

@@ -106,6 +106,8 @@ const Header = (props) => {
 
   const clearNotifications = () => {
     // Don't really care about the logout
+    
+    toast("Clearing notifications")
     fetch(`${globalUrl}/api/v1/notifications/clear`, {
       credentials: "include",
       method: "GET",
@@ -351,7 +353,7 @@ const Header = (props) => {
           setAnchorEl(event.currentTarget);
         }}
       >
-        <Badge badgeContent={notifications.length} color="primary">
+        <Badge badgeContent={notifications.filter((n) => n.read === false).length} color="primary">
           <NotificationsIcon
             color="secondary"
             style={{ height: 30, width: 30 }}
@@ -390,7 +392,7 @@ const Header = (props) => {
         >
           <div style={{ display: "flex", marginBottom: 5 }}>
             <Typography variant="body1">
-              Your Notifications ({notifications.length})
+              Your Notifications ({notifications.filter((data) => !data.read).length})
             </Typography>
             {notifications.length > 1 ? (
               <Button
@@ -412,7 +414,11 @@ const Header = (props) => {
           </Typography>
         </Paper>
         {notifications.map((data, index) => {
-          return <NotificationItem data={data} key={index} />;
+			if (data.read) {
+				return null
+			}
+
+          	return <NotificationItem data={data} key={index} />;
         })}
       </Menu>
     </span>

frontend/src/components/Oauth2Auth.jsx

@@ -375,7 +375,11 @@ const AuthenticationOauth2 = (props) => {
 				"reference_workflow": workflowId,
 		}
 
-		setNewAppAuth(appAuthData, true) 
+	    if (setNewAppAuth !== undefined) {
+			setNewAppAuth(appAuthData, true) 
+		} else {
+			console.log("setNewAppAuth is undefined")
+	    }
 
 		// Wait 1 second, then get app auth with update
 		//if (getAppAuthentication !== undefined) {
@@ -602,7 +606,10 @@ const AuthenticationOauth2 = (props) => {
 
     console.log("FIELDS: ", newFields);
     newAuthOption.fields = newFields;
-    setNewAppAuth(newAuthOption);
+
+	if (setNewAppAuth !== undefined) {
+    	setNewAppAuth(newAuthOption);
+	}
     //appAuthentication.push(newAuthOption)
     //setAppAuthentication(appAuthentication)
     //

frontend/src/components/Priorities.jsx

@@ -1,24 +1,30 @@
 import React, { useState, useEffect } from "react";
 
+import { toast } from "react-toastify";
 import theme from "../theme.jsx";
 import {
 	Paper,
-  Typography,
+	Tooltip,
+  	Typography,
 	Divider,
 	Button,
+	ButtonGroup,
 	Grid,
 	Card,
-  Switch,
+	Chip,
+  	Switch,
 } from "@mui/material";
 
+import { useNavigate, Link } from "react-router-dom";
 import Priority from "../components/Priority.jsx";
 //import { useAlert 
 
 const Priorities = (props) => {
-  const { globalUrl, userdata, serverside, billingInfo, stripeKey, checkLogin, setAdminTab, setCurTab, } = props;
+  const { globalUrl, userdata, serverside, billingInfo, stripeKey, checkLogin, setAdminTab, setCurTab, notifications, setNotifications, } = props;
   const [showDismissed, setShowDismissed] = React.useState(false);
   const [showRead, setShowRead] = React.useState(false);
   const [appFramework, setAppFramework] = React.useState({});
+  let navigate = useNavigate();
 
 	useEffect(() => {
 		getFramework()
@@ -61,6 +67,182 @@ const Priorities = (props) => {
 		})
 	}
 
+	const dismissNotification = (alert_id) => {
+    	// Don't really care about the logout
+    	fetch(`${globalUrl}/api/v1/notifications/${alert_id}/markasread`, {
+    	  credentials: "include",
+    	  method: "GET",
+    	  headers: {
+    	    "Content-Type": "application/json",
+    	  },
+    	})
+	    .then(function (response) {
+	      if (response.status !== 200) {
+	        console.log("Error in response");
+	      }
+
+	      return response.json();
+	    })
+	    .then(function (responseJson) {
+	      if (responseJson.success === true) {
+	        const newNotifications = notifications.filter(
+	      		(data) => data.id !== alert_id
+	        );
+	        console.log("NEW NOTIFICATIONS: ", newNotifications);
+
+			if (setNotifications !== undefined) {
+	        	setNotifications(newNotifications)
+			}
+	      } else {
+	        toast("Failed dismissing notification. Please try again later.");
+	      }
+		})
+	    .catch((error) => {
+	      console.log("error in notification dismissal: ", error);
+	      //removeCookie("session_token", {path: "/"})
+	    })
+	}
+  	
+
+	const notificationWidth = "100%" 
+	const imagesize = 22
+  	const boxColor = "#86c142"
+	const NotificationItem = (props) => {
+		const {data} = props
+
+    	var image = "";
+    	var orgName = "";
+    	var orgId = "";
+    	if (userdata.orgs !== undefined) {
+    	  const foundOrg = userdata.orgs.find((org) => org.id === data["org_id"]);
+    	  if (foundOrg !== undefined && foundOrg !== null) {
+    	    //position: "absolute", bottom: 5, right: -5,
+    	    const imageStyle = {
+    	      width: imagesize,
+    	      height: imagesize,
+    	      pointerEvents: "none",
+    	      marginLeft:
+    	        data.creator_org !== undefined && data.creator_org.length > 0
+    	          ? 20
+    	          : 0,
+    	      borderRadius: 10,
+    	      border:
+    	        foundOrg.id === userdata.active_org.id
+    	          ? `3px solid ${boxColor}`
+    	          : null,
+    	      cursor: "pointer",
+    	      marginRight: 10,
+    	    };
+
+    	    image =
+    	      foundOrg.image === "" ? (
+    	        <img
+    	          alt={foundOrg.name}
+    	          src={theme.palette.defaultImage}
+    	          style={imageStyle}
+    	        />
+    	      ) : (
+    	        <img
+    	          alt={foundOrg.name}
+    	          src={foundOrg.image}
+    	          style={imageStyle}
+    	          onClick={() => {}}
+    	        />
+    	      );
+
+    	    orgName = foundOrg.name;
+    	    orgId = foundOrg.id;
+    	  }
+		}
+
+		return (
+    	  <Paper
+    	    style={{
+    	      backgroundColor: theme.palette.platformColor,
+    	      width: notificationWidth,
+    	      padding: 30,
+    	      borderBottom: "1px solid rgba(255,255,255,0.4)",
+			  marginBottom: 20, 
+    	    }}
+    	  >
+			<div style={{display: "flex", }}>
+				{data.amount === 1 && data.read === false ? 
+					<Chip
+						label={"First seen"}
+						variant="contained"
+						color="primary"
+						style={{marginRight: 15, height: 25, }}
+					  />
+				: null}
+				{data.read === false ?
+					<Chip
+						label={"Unread"}
+						variant="outlined"
+						color="primary"
+						style={{marginRight: 15, height: 25, }}
+					  />
+				: 
+					<Chip
+						label={"Read"}
+						variant="outlined"
+						color="secondary"
+						style={{marginRight: 15, height: 25, }}
+					  />
+				}
+				<Typography variant="body1" color="textPrimary">
+					{data.title}
+				</Typography >
+			</div>
+
+			{data.image !== undefined && data.image !== null && data.image.length > 0 ? 
+				<img alt={data.title} src={data.image} style={{height: 100, width: 100, }} />
+				: 
+				null
+			}
+			<Typography variant="body2" color="textSecondary" style={{marginTop: 10, maxHeight: 200, overflowX: "hidden", overflowY: "auto", }}>
+				{data.description}
+			</Typography >
+    	    <div style={{ display: "flex" }}>
+			  <ButtonGroup>
+			  	<Button
+			  	  color="secondary"
+			  	  variant="outlined"
+			  	  style={{ marginTop: 15 }}
+			  	  disabled={data.reference_url === undefined || data.reference_url === null || data.reference_url.length === 0}
+			  	  onClick={() => {
+					window.open(data.reference_url, "_blank")
+			  	  }}
+			  	>
+			  	 	Explore 
+			  	</Button>
+    	      	{data.read === false ? (
+    	      	  <Button
+    	      	    color="secondary"
+    	      	    variant="outlined"
+    	      	    style={{ marginTop: 15 }}
+    	      	    onClick={() => {
+    	      	      dismissNotification(data.id);
+    	      	    }}
+    	      	  >
+    	      	    Dismiss
+    	      	  </Button>
+    	      	) : null}
+			  </ButtonGroup>
+
+		      <Typography variant="body2" color="textSecondary" style={{marginLeft: 20, marginTop: 20, }}>
+				<b>First seen</b>: {new Date(data.created_at * 1000).toISOString().slice(0, 19)}
+			  </Typography >
+			  <Typography variant="body2" color="textSecondary" style={{marginLeft: 20, marginTop: 20, }}>
+				<b>Last seen</b>: {new Date(data.updated_at * 1000).toISOString().slice(0, 19)}
+			  </Typography >
+			  <Typography variant="body2" color="textSecondary" style={{marginLeft: 20, marginTop: 20, }}>
+				<b>Times seen</b>: {data.amount}
+			  </Typography >
+    	    </div>
+    	  </Paper>
+    	);
+    }
+
 	return (
 		<div style={{maxWidth: 1000, }}>
 			<h2 style={{ display: "inline" }}>Suggestions</h2>
@@ -125,6 +307,20 @@ const Priorities = (props) => {
 					setShowRead(!showRead);
 				}}
 			/>&nbsp; Show read 
+			{notifications === null || notifications === undefined || notifications.length === 0 ? null : 
+				<div>
+					{notifications.map((notification, index) => {
+						if (showRead === false && notification.read === true) {
+							return null
+						}
+
+						return (
+							<NotificationItem data={notification} key={index} />
+						)
+					})}
+				</div>
+			}
+
 		</div>
 	)
 }

frontend/src/components/RuntimeDebugger.jsx

@@ -181,6 +181,7 @@ const RuntimeDebugger = (props) => {
 	}, [])
 
 	const imageSize = 30
+	const timenowUnix = Math.floor(Date.now() / 1000)
 	const columns: GridColDef[] = [
 		{
 			field: 'execution_source',
@@ -319,7 +320,8 @@ const RuntimeDebugger = (props) => {
 		  },
 		{ field: 'startTimestamp', headerName: 'Start time (UTC)', width: 160, 
 			renderCell: (params) => {
-				const hasError = params.row.completed_at-params.row.started_at > 300 
+				const comparisonTimestamp = params.row.completed_at === 0 ? timenowUnix : params.row.completed_at
+				const hasError = comparisonTimestamp-params.row.started_at > 300 
 
 				return (
 					<Tooltip title={hasError ? "More than 5 minutes from start to finish" : ""} placement="top">