Pass controllers to events tab

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

@@ -1,11 +1,22 @@
-import React, { useCallback, useContext, useEffect, useMemo, useState } from "react";
+import React, {
+  useCallback,
+  useContext,
+  useEffect,
+  useMemo,
+  useState,
+} from "react";
 import styled from "styled-components";
 import yaml from "js-yaml";
 import backArrow from "assets/back_arrow.png";
 import _ from "lodash";
 import loadingSrc from "assets/loading.gif";
 
-import { ChartType, ClusterType, ResourceType, StorageType } from "shared/types";
+import {
+  ChartType,
+  ClusterType,
+  ResourceType,
+  StorageType,
+} from "shared/types";
 import { Context } from "shared/Context";
 import api from "shared/api";
 import StatusIndicator from "components/StatusIndicator";
@@ -421,7 +432,13 @@ const ExpandedChart: React.FC<Props> = (props) => {
           />
         );
       case "events":
-        return <EventsTab />;
+        const parsedControllers = Object.values(controllers).map((c) => {
+          return {
+            name: c?.metadata?.name,
+            type: c?.kind,
+          };
+        });
+        return <EventsTab controllers={parsedControllers} />;
       default:
     }
   };

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

@@ -4,22 +4,39 @@ import styled from "styled-components";
 import EventLogs from "components/events/EventLogs";
 import EventsList from "components/events/EventsList";
 import EventsContextProvider, {
-  Event,
   EventContext,
   EventsContextType,
 } from "components/events/EventsContext";
-import Loading from "components/Loading";
 import loadingSrc from "assets/loading.gif";
 
-type EventsTabProps = {};
+type EventsTabProps = {
+  controllers: { type: string; name: string }[];
+};
 
-const EventsTab: React.FunctionComponent<EventsTabProps> = () => {
+const EventsTab: React.FunctionComponent<EventsTabProps> = ({
+  controllers,
+}) => {
   const renderContent = ({
     isLoading,
     isPorterAgentInstalled,
+    isPorterAgentInstalling,
     selectedEvent,
     installPorterAgent,
   }: EventsContextType) => {
+    if (isPorterAgentInstalling) {
+      return (
+        <Placeholder>
+          <div>
+            <Header>
+              <Spinner src={loadingSrc} /> Installing porter agent
+            </Header>
+            This should be quick, if it takes too long please contact the porter
+            team.
+          </div>
+        </Placeholder>
+      );
+    }
+
     if (isLoading) {
       return (
         <Placeholder>
@@ -55,7 +72,7 @@ const EventsTab: React.FunctionComponent<EventsTabProps> = () => {
 
   return (
     <EventsPageWrapper>
-      <EventsContextProvider controllers={[]} enableNodeEvents={false}>
+      <EventsContextProvider controllers={controllers} enableNodeEvents={false}>
         <EventContext.Consumer>
           {(context) => renderContent(context)}
         </EventContext.Consumer>