Merge branch 'release-v1.0.5' into web/ref

src/apps/console/components/sync-status.tsx

@@ -7,7 +7,6 @@ import {
   CircleFill,
   WarningCircleFill,
 } from '~/console/components/icons';
-import Tooltip from '~/components/atoms/tooltip';
 import {
   Github__Com___Kloudlite___Api___Pkg___Types__SyncState as ISyncState,
   Github__Com___Kloudlite___Api___Pkg___Types__SyncAction as ISyncAction,
@@ -217,7 +216,7 @@ const parseOverallState = (item: IStatusMetaV2): OverallStates => {
     {
       value: 'idle',
       progress: 'init',
-    },
+    }
   );
 
   return (mainStatus?.value as OverallStates) || 'idle';
@@ -286,82 +285,84 @@ export const SyncStatusV2 = ({
       return [];
     }
 
-    const items = checkList?.reduce(
-      (acc, curr) => {
-        const k = checks[curr.name];
-        if (acc.progress === 'done') {
-          acc.items.push({
-            ...curr,
-            result: 'idle',
-            message: '',
-          });
-          return acc;
-        }
+    const items = checkList
+      ?.filter((cl) => !cl.hide)
+      .reduce(
+        (acc, curr) => {
+          const k = checks[curr.name];
+          if (acc.progress === 'done') {
+            acc.items.push({
+              ...curr,
+              result: 'idle',
+              message: '',
+            });
+            return acc;
+          }
 
-        const res = ((): {
-          value: OverallStates;
-          progress: string;
-          message: string;
-        } => {
-          if (k) {
-            if (acc.value === 'idle' && k.state === 'yet-to-be-reconciled') {
-              return {
-                value: 'idle',
-                message: k.message,
-                progress: 'done',
-              };
+          const res = ((): {
+            value: OverallStates;
+            progress: string;
+            message: string;
+          } => {
+            if (k) {
+              if (acc.value === 'idle' && k.state === 'yet-to-be-reconciled') {
+                return {
+                  value: 'idle',
+                  message: k.message,
+                  progress: 'done',
+                };
+              }
+
+              if (k.state === 'under-reconcilation') {
+                return {
+                  value: 'in-progress',
+
+                  message: k.message,
+                  progress: 'done',
+                };
+              }
+
+              if (k.state === 'errored-during-reconcilation') {
+                return {
+                  value: 'error',
+                  message: k.message,
+                  progress: 'done',
+                };
+              }
+
+              if (k.state === 'finished-reconcilation') {
+                return {
+                  value: 'ready',
+                  message: k.message,
+                  progress: 'init',
+                };
+              }
             }
 
-            if (k.state === 'under-reconcilation') {
-              return {
-                value: 'in-progress',
-
-                message: k.message,
-                progress: 'done',
-              };
-            }
+            return acc;
+          })();
 
-            if (k.state === 'errored-during-reconcilation') {
-              return {
-                value: 'error',
-                message: k.message,
-                progress: 'done',
-              };
-            }
+          acc.items.push({
+            ...curr,
+            result: res?.value,
+            message: res.message,
+          });
 
-            if (k.state === 'finished-reconcilation') {
-              return {
-                value: 'ready',
-                message: k.message,
-                progress: 'init',
-              };
-            }
-          }
+          acc.value = res.value;
+          acc.progress = res.progress;
 
           return acc;
-        })();
-
-        acc.items.push({
-          ...curr,
-          result: res?.value,
-          message: res.message,
-        });
-
-        acc.value = res.value;
-        acc.progress = res.progress;
-
-        return acc;
-      },
-      {
-        value: 'idle' as OverallStates,
-        items: [] as ({
-          result: OverallStates;
-          message: string;
-        } & ICheckList)[],
-        message: '',
-        progress: 'init',
-      },
-    );
+        },
+        {
+          value: 'idle' as OverallStates,
+          items: [] as ({
+            result: OverallStates;
+            message: string;
+          } & ICheckList)[],
+          message: '',
+          progress: 'init',
+        }
+      );
 
     return items?.items;
   };

src/apps/console/hooks/use-cluster-status.tsx

@@ -0,0 +1,51 @@
+import { useCallback, useEffect, useState } from 'react';
+import { useConsoleApi } from '../server/gql/api-provider';
+import { parseNodes } from '../server/r-utils/common';
+
+const findClusterStatus = (item?: { lastOnlineAt?: string }): boolean => {
+  if (!item || !item.lastOnlineAt) {
+    return false;
+  }
+
+  const lastTime = new Date(item.lastOnlineAt);
+  const currentTime = new Date();
+
+  const timeDifference =
+    (currentTime.getTime() - lastTime.getTime()) / (1000 * 60);
+
+  switch (true) {
+    case timeDifference <= 2:
+      return true;
+    default:
+      return false;
+  }
+};
+
+const useClusterStatus = () => {
+  const api = useConsoleApi();
+
+  const [clusters, setClusters] = useState<any[]>([]);
+  const [loading, setLoading] = useState(false);
+
+  const listCluster = useCallback(async () => {
+    setLoading(true);
+    try {
+      const clusters = await api.listAllClusters();
+      setClusters(parseNodes(clusters.data) || []);
+      return clusters;
+    } catch (err) {
+      console.error(err);
+      return false;
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    listCluster();
+  }, []);
+
+  return { findClusterStatus, clusters, loading };
+};
+
+export default useClusterStatus;

src/apps/console/page-components/handle-environment.tsx

@@ -1,13 +1,11 @@
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import Popup from '~/components/molecule/popup';
 import { toast } from '~/components/molecule/toast';
 import { useReload } from '~/root/lib/client/helpers/reloader';
 import useForm, { dummyEvent } from '~/root/lib/client/hooks/use-form';
 import Yup from '~/root/lib/server/helpers/yup';
 import { handleError } from '~/root/lib/utils/common';
-import useCustomSwr from '~/root/lib/client/hooks/use-custom-swr';
 import Select from '~/components/atoms/select';
-import { useAppend, useMapper } from '~/components/utils';
 import { IDialog } from '../components/types.d';
 import { useConsoleApi } from '../server/gql/api-provider';
 import { DIALOG_TYPE } from '../utils/commons';
@@ -36,53 +34,30 @@ const HandleEnvironment = ({ show, setShow }: IDialog<IEnvironment | null>) => {
   const api = useConsoleApi();
   const reloadPage = useReload();
 
-  const { data: clustersData, isLoading: cIsLoading } = useCustomSwr(
-    'clusters',
-    async () =>
-      api.listClusters({
-        pagination: {
-          first: 100,
-        },
-      }),
-    true
-  );
-
-  const { data: byokClustersData, isLoading: byokCIsLoading } = useCustomSwr(
-    'byokclusters',
-    async () =>
-      api.listByokClusters({
-        pagination: {
-          first: 100,
-        },
-      }),
-    true
-  );
-
-  const cData = useMapper(parseNodes(clustersData), (item) => {
-    return {
-      label: item.displayName,
-      value: parseName(item),
-      ready: item.status?.isReady,
-      render: () => (
-        <ClusterSelectItem label={item.displayName} value={parseName(item)} />
-      ),
-    };
-  });
+  const [clusterList, setClusterList] = useState<any[]>([]);
 
-  const bCData = useMapper(parseNodes(byokClustersData), (item) => {
-    return {
-      label: item.displayName,
-      value: parseName(item),
-      ready: true,
-      render: () => (
-        <ClusterSelectItem label={item.displayName} value={parseName(item)} />
-      ),
-    };
-  });
+  const getClusters = useCallback(async () => {
+    try {
+      const byokClusters = await api.listByokClusters({});
+      const data = parseNodes(byokClusters.data).map((c) => ({
+        label: c.displayName,
+        value: parseName(c),
+        ready: true,
+        render: () => (
+          <ClusterSelectItem label={c.displayName} value={parseName(c)} />
+        ),
+      }));
+      setClusterList(data);
+    } catch (err) {
+      handleError(err);
+    }
+  }, []);
 
-  const clusterList = useAppend(cData, bCData);
+  useEffect(() => {
+    getClusters();
+  }, []);
 
-  const [validationSchema, setValidationSchema] = useState<any>(
+  const [validationSchema] = useState<any>(
     Yup.object({
       displayName: Yup.string().required(),
       name: Yup.string().required(),
@@ -154,18 +129,13 @@ const HandleEnvironment = ({ show, setShow }: IDialog<IEnvironment | null>) => {
   });
 
   useEffect(() => {
-    if (show && show.type === DIALOG_TYPE.EDIT) {
+    if (clusterList.length > 0) {
       setValues((v) => ({
         ...v,
-        displayName: show.data?.displayName || '',
+        clusterName: clusterList.find((c) => c.ready)?.value || '',
       }));
-      setValidationSchema(
-        Yup.object({
-          displayName: Yup.string().trim().required(),
-        })
-      );
     }
-  }, [show]);
+  }, [clusterList, show]);
 
   return (
     <Popup.Root
@@ -208,7 +178,6 @@ const HandleEnvironment = ({ show, setShow }: IDialog<IEnvironment | null>) => {
               label="Select Cluster"
               size="lg"
               value={values.clusterName}
-              disabled={cIsLoading}
               placeholder="Select a Cluster"
               options={async () => [
                 ...((clusterList &&
@@ -222,7 +191,6 @@ const HandleEnvironment = ({ show, setShow }: IDialog<IEnvironment | null>) => {
               }}
               error={!!errors.clusterName}
               message={errors.clusterName}
-              loading={cIsLoading || byokCIsLoading}
             />
 
             {/* <Checkbox */}