finish event charts and health charts test

Author: curiousyang

app/components/TransferColumns.tsx

@@ -1,5 +1,4 @@
 import React, { useState, useContext, useEffect, useRef } from 'react';
-import { useIsMount } from '../context/helpers';
 import { useParams } from 'react-router-dom';
 import 'antd/dist/antd.less';
 import { Switch, Table, Tag, Transfer, Button } from 'antd';

app/containers/EventContainer.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState, useContext } from 'react';
-//import EventContext, EventChart
+import { useParams } from 'react-router-dom';
 import { EventContext } from '../context/EventContext';
 import { QueryContext } from '../context/QueryContext';
 import EventChart from '../charts/EventChart';
@@ -21,10 +21,12 @@ const EventContainer: React.FC<EventContainerProps> = React.memo(props => {
   const { selectedMetrics } = useContext(QueryContext);
   const eventDataList : any[] = eventData.eventDataList;
   const eventTimeList : any[] = eventData.eventTimeList;
+  const { service } = useParams<any>();
+
 
   useEffect(() => {
     const temp : JSX.Element[] = [];
-
+    console.log("service in event container", service);
     if (eventData && eventDataList.length > 0 && eventTimeList.length >0) {
       // console.log("eventDataList in EventContainer:");
       // console.log(JSON.stringify(eventDataList));
@@ -62,7 +64,7 @@ const EventContainer: React.FC<EventContainerProps> = React.memo(props => {
       }); 
       setEventChartsArr(temp);
     }
-  }, [eventData]);
+  }, [eventData, service]);
 
   const getSingleTimeList = (metricName: string) => {
     //[{metric1: [3,6,8...]}, {metric2: [3,6,8...]}]  
@@ -81,7 +83,7 @@ const EventContainer: React.FC<EventContainerProps> = React.memo(props => {
 
   };
 
-  return <div>{eventChartsArr}</div>;
+  return <div>{service.includes('kafkametrics')? eventChartsArr : []}</div>;
 });
 
 export default EventContainer;

app/containers/HealthContainer.tsx

@@ -3,6 +3,7 @@ import { HealthContext } from '../context/HealthContext';
 import { QueryContext } from '../context/QueryContext';
 import HealthChart from '../charts/HealthChart';
 import { getTime } from '../context/helpers';
+import { useParams } from 'react-router-dom';
 
 interface HealthContainerProps {
   sizing: string;
@@ -18,7 +19,7 @@ const HealthContainer: React.FC<HealthContainerProps> = React.memo(props => {
   const {selectedMetrics} = useContext(QueryContext);
   const [healthChartsArr, setHealthChartsArr] = useState<JSX.Element[]>([]);
   const { category } = props;
-
+  const { service } = useParams<any>();
 
   // console.log("HC-healthData in HealthContainer:", JSON.stringify(healthData));
   // console.log("HC-datalist in HealthContainer:", JSON.stringify(healthData.healthDataList));
@@ -98,7 +99,7 @@ const HealthContainer: React.FC<HealthContainerProps> = React.memo(props => {
 
   }, [healthData, category]); //add category here
 
-  return <div>{healthChartsArr}</div>;
+  return <div>{service !== 'kafkametrics' ? healthChartsArr : []}</div>;
 });
 
 export default HealthContainer;

app/context/helpers.js

@@ -113,11 +113,4 @@ export function getTime(timeList, currService, metric, category) {
     }
   });
   return res;
-}
-export const useIsMount = () => {
-  const isMountRef = useRef(true);
-  useEffect(() => {
-    isMountRef.current = false;
-  }, []);
-  return isMountRef.current;
-};
+}