clusteer stattus update

kloudlite · Sep 5, 2024 · 1aa7b16 · 1aa7b16
1 parent 3d035b3
commit 1aa7b16
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 33 deletions.
diff --git a/src/apps/console/hooks/use-cluster-status-v2.tsx b/src/apps/console/hooks/use-cluster-status-v2.tsx
@@ -6,6 +6,7 @@ import {
   createContext,
   useCallback,
   useContext,
+  useEffect,
   useMemo,
   useState,
 } from 'react';
@@ -36,10 +37,13 @@ const ClusterStatusProvider = ({ children }: { children: ReactNode }) => {
   const listCluster = useCallback(async () => {
     try {
       const cl = await api.listAllClusters();
-      const parsed = parseNodes(cl.data).reduce((acc, c) => {
-        acc[c.metadata.name] = c;
-        return acc;
-      }, {} as { [key: string]: ExtractNodeType<IByocClusters> });
+      const parsed = parseNodes(cl.data).reduce(
+        (acc, c) => {
+          acc[c.metadata.name] = c;
+          return acc;
+        },
+        {} as { [key: string]: ExtractNodeType<IByocClusters> },
+      );
       setClusters(parsed);
       return clusters;
     } catch (err) {
@@ -48,23 +52,36 @@ const ClusterStatusProvider = ({ children }: { children: ReactNode }) => {
     }
   }, []);
 
+  useEffect(() => {
+    const interval = setInterval(() => {
+      listCluster();
+    }, 30 * 1000);
+    return () => {
+      clearInterval(interval);
+    };
+  }, []);
+
   useDebounce(
     () => {
       listCluster();
     },
     3000,
-    [update]
+    [update],
   );
 
   useSocketWatch(() => {
     setUpdate((p) => !p);
   }, topic);
 
+  useEffect(() => {
+    console.log('helre', topic);
+  }, [topic]);
+
   return (
     <ClusterStatusContext.Provider
       value={useMemo(
         () => ({ clusters, setClusters }),
-        [clusters, setClusters]
+        [clusters, setClusters],
       )}
     >
       {children}

diff --git a/src/apps/console/routes/_main+/$account+/environments/environment-resources-v2.tsx b/src/apps/console/routes/_main+/$account+/environments/environment-resources-v2.tsx
@@ -195,16 +195,16 @@ const ListView = ({ items, onAction }: IResource) => {
   const { account } = useParams();
   const { clusters } = useClusterStatusV2();
 
-  const [clusterOnlineStatus, setClusterOnlineStatus] = useState<
-    Record<string, boolean>
-  >({});
-  useEffect(() => {
-    const states: Record<string, boolean> = {};
-    Object.entries(clusters).forEach(([key, value]) => {
-      states[key] = findClusterStatus(value);
-    });
-    setClusterOnlineStatus(states);
-  }, [clusters]);
+  // const [clusterOnlineStatus, setClusterOnlineStatus] = useState<
+  //   Record<string, boolean>
+  // >({});
+  // useEffect(() => {
+  //   const states: Record<string, boolean> = {};
+  //   Object.entries(clusters).forEach(([key, value]) => {
+  //     states[key] = findClusterStatus(value);
+  //   });
+  //   setClusterOnlineStatus(states);
+  // }, [clusters]);
 
   return (
     <ListV2.Root
@@ -244,7 +244,7 @@ const ListView = ({ items, onAction }: IResource) => {
         ],
         rows: items.map((i) => {
           const { name, id, updateInfo } = parseItem(i);
-          const isClusterOnline = clusterOnlineStatus[i.clusterName];
+          const isClusterOnline = findClusterStatus(clusters[i.clusterName]);
 
           return {
             columns: {
@@ -312,7 +312,7 @@ const EnvironmentResourcesV2 = ({ items = [] }: { items: BaseType[] }) => {
   useWatchReload(
     items.map((i) => {
       return `account:${parseName(account)}.environment:${parseName(i)}`;
-    })
+    }),
   );
 
   const suspendEnvironment = async (item: BaseType, suspend: boolean) => {
@@ -338,7 +338,7 @@ const EnvironmentResourcesV2 = ({ items = [] }: { items: BaseType[] }) => {
           suspend
             ? 'Environment suspended successfully'
             : 'Environment resumed successfully'
-        }`
+        }`,
       );
       reloadPage();
     } catch (err) {
@@ -347,7 +347,7 @@ const EnvironmentResourcesV2 = ({ items = [] }: { items: BaseType[] }) => {
   };
 
   const [showDeleteDialog, setShowDeleteDialog] = useState<BaseType | null>(
-    null
+    null,
   );
   const [visible, setVisible] = useState<BaseType | null>(null);
 

diff --git a/src/apps/console/routes/_main+/$account+/managed-services/backend-services-resources-V2.tsx b/src/apps/console/routes/_main+/$account+/managed-services/backend-services-resources-V2.tsx
@@ -165,16 +165,16 @@ const ListView = ({ items, templates, onAction }: IResource) => {
   const { account } = useOutletContext<IAccountContext>();
   const { clusters } = useClusterStatusV2();
 
-  const [clusterOnlineStatus, setClusterOnlineStatus] = useState<
-    Record<string, boolean>
-  >({});
-  useEffect(() => {
-    const states: Record<string, boolean> = {};
-    Object.entries(clusters).forEach(([key, value]) => {
-      states[key] = findClusterStatus(value);
-    });
-    setClusterOnlineStatus(states);
-  }, [clusters]);
+  // const [clusterOnlineStatus, setClusterOnlineStatus] = useState<
+  //   Record<string, boolean>
+  // >({});
+  // useEffect(() => {
+  //   const states: Record<string, boolean> = {};
+  //   Object.entries(clusters).forEach(([key, value]) => {
+  //     states[key] = findClusterStatus(value);
+  //   });
+  //   setClusterOnlineStatus(states);
+  // }, [clusters]);
 
   return (
     <ListV2.Root
@@ -213,7 +213,7 @@ const ListView = ({ items, templates, onAction }: IResource) => {
           },
         ],
         rows: items.map((i) => {
-          const isClusterOnline = clusterOnlineStatus[i.clusterName];
+          const isClusterOnline = clusters[i.clusterName];
           const { name, id, logo, updateInfo } = parseItem(i, templates);
           return {
             columns: {
@@ -282,11 +282,11 @@ const BackendServicesResourcesV2 = ({
       return `account:${parseName(account)}.cluster:${
         i.clusterName
       }.cluster_managed_service:${parseName(i)}`;
-    })
+    }),
   );
 
   const [showDeleteDialog, setShowDeleteDialog] = useState<BaseType | null>(
-    null
+    null,
   );
   const [visible, setVisible] = useState<BaseType | null>(null);
   const api = useConsoleApi();