updates

dashboard/src/main/home/cluster-dashboard/expanded-chart/ExpandedChart.tsx

@@ -462,7 +462,7 @@ const ExpandedChart: React.FC<Props> = (props) => {
 
     // Filter tabs if previewing an old revision or updating the chart version
     if (isPreview) {
-      let liveTabs = ["status", "settings", "deploy", "metrics"];
+      let liveTabs = ["status", "events", "settings", "deploy", "metrics"];
       rightTabOptions = rightTabOptions.filter(
         (tab: any) => !liveTabs.includes(tab.value)
       );

dashboard/src/main/home/cluster-dashboard/expanded-chart/events/EventsTab.tsx

@@ -33,6 +33,7 @@ const REFRESH_TIME = 15000;
 const EventsTab: React.FunctionComponent<Props> = (props) => {
   const { currentCluster, currentProject } = useContext(Context);
   const [isLoading, setIsLoading] = useState(true);
+  const [isError, setIsError] = useState(false);
   const [shouldRequest, setShouldRequest] = useState(true);
   const [eventData, setEventData] = useState<EventContainer[]>([]); // most recent event is last
   const [selectedEvent, setSelectedEvent] = useState<number | null>(null);
@@ -83,36 +84,50 @@ const EventsTab: React.FunctionComponent<Props> = (props) => {
   };
 
   useEffect(() => {
-    const id = window.setInterval(() => {
+    const getData = () => {
       if (!shouldRequest) return;
       setShouldRequest(false);
       api
-        .getReleaseSteps(
-          "<token>",
-          {
-            cluster_id: currentCluster.id,
-            namespace: props.currentChart.namespace,
-          },
-          {
-            id: currentProject.id,
-            name: props.currentChart.name,
-          }
-        )
-        .then((data) => {
-          setIsLoading(false);
-          filterData(data.data);
-        })
-        .catch((err) => {})
-        .finally(() => {
-          setShouldRequest(true);
-        });
-    }, REFRESH_TIME);
+          .getReleaseSteps(
+              "<token>",
+              {
+                cluster_id: currentCluster.id,
+                namespace: props.currentChart.namespace,
+              },
+              {
+                id: currentProject.id,
+                name: props.currentChart.name,
+              }
+          )
+          .then((data) => {
+            setIsLoading(false);
+            filterData(data.data);
+          })
+          .catch((err) => {
+            setIsError(true);
+          })
+          .finally(() => {
+            setShouldRequest(true);
+          });
+    };
+
+    getData();
+    const id = window.setInterval(getData, REFRESH_TIME);
+
     return () => {
       setIsLoading(true);
       window.clearInterval(id);
     };
   }, [currentProject, currentCluster, props.currentChart]);
 
+  if (isError) {
+    return (
+        <Placeholder>
+          Error loading events.
+        </Placeholder>
+    )
+  }
+
   if (isLoading) {
     return (
       <Placeholder>