Merge pull request #43 from zenml-io/talha/feedback-fixes

fixed polling for pipeline and stackComponents

Author: danialraza03

src/ui/layouts/pipelines/Pipelines/useService.ts

@@ -39,6 +39,15 @@ export const useService = (): ServiceInterface => {
       }),
     );
   }, []);
+  useEffect(() => {
+    const intervalId = setInterval(() => {
+      //assign interval to a variable to clear it.
+      dispatch(runsActions.allRuns({}));
+      dispatch(pipelinesActions.getMy());
+    }, 10000);
+
+    return () => clearInterval(intervalId); //This is important
+  });
 
   const setFetching = (fetching: boolean) => {
     dispatch(pipelinePagesActions.setFetching({ fetching }));

src/ui/layouts/pipelines/useService.ts

@@ -1,27 +1,19 @@
-import { useEffect } from 'react';
-import { pipelinesActions, runsActions } from '../../../redux/actions';
+// import { useEffect } from 'react';
+// import { pipelinesActions, runsActions } from '../../../redux/actions';
 import { organizationSelectors } from '../../../redux/selectors';
-import { useSelector, useDispatch } from '../../hooks';
+import { useSelector } from '../../hooks';
 
 interface ServiceInterface {
   organization: TOrganization | null;
 }
 
 export const useService = (): ServiceInterface => {
   const organization = useSelector(organizationSelectors.myOrganization);
-  const dispatch = useDispatch();
+  // const dispatch = useDispatch();
   // useEffect(() => {
   //   dispatch(pipelinesActions.getMy());
   // }, []);
-  useEffect(() => {
-    const intervalId = setInterval(() => {
-      //assign interval to a variable to clear it.
-      dispatch(runsActions.allRuns({}));
-      dispatch(pipelinesActions.getMy());
-    }, 10000);
 
-    return () => clearInterval(intervalId); //This is important
-  });
   return {
     organization,
   };

src/ui/layouts/stackComponents/Stacks/useService.ts

@@ -47,6 +47,20 @@ export const useService = (): ServiceInterface => {
     );
   }, [locationPath]);
 
+  useEffect(() => {
+    const intervalId = setInterval(() => {
+      //assign interval to a variable to clear it.
+      dispatch(
+        stackComponentsActions.getMy({
+          // id: currentWorkspace.id,
+          type: locationPath.split('/')[2],
+        }),
+      );
+    }, 10000);
+
+    return () => clearInterval(intervalId);
+  });
+
   const setFetching = (fetching: boolean) => {
     dispatch(stackPagesActions.setFetching({ fetching }));
   };

src/ui/layouts/stackComponents/useService.ts

@@ -1,9 +1,8 @@
-import { useEffect } from 'react';
-import { stackComponentsActions } from '../../../redux/actions';
+// import { useEffect } from 'react';
+// import { stackComponentsActions } from '../../../redux/actions';
 import { organizationSelectors } from '../../../redux/selectors';
 import {
-  useDispatch,
-  useLocationPath,
+  // useLocationPath,
   // useRequestOnMount,
   useSelector,
 } from '../../hooks';
@@ -13,24 +12,10 @@ interface ServiceInterface {
 }
 
 export const useService = (): ServiceInterface => {
-  const locationPath = useLocationPath();
+  // const locationPath = useLocationPath();
   // const currentWorkspace = useSelector(stackPagesSelectors.currentWorkspace);
 
-  const dispatch = useDispatch();
   const organization = useSelector(organizationSelectors.myOrganization);
-  useEffect(() => {
-    const intervalId = setInterval(() => {
-      //assign interval to a variable to clear it.
-      dispatch(
-        stackComponentsActions.getMy({
-          // id: currentWorkspace.id,
-          type: locationPath.split('/')[2],
-        }),
-      );
-    }, 10000);
-
-    return () => clearInterval(intervalId);
-  });
 
   return {
     organization,