Merge pull request #2766 from devtron-labs/fix/online-connectivity-36

chore: online & cluster selector fix

Author: shivani170

src/components/ResourceBrowser/ResourceList/ClusterSelector.tsx

@@ -114,25 +114,27 @@ const ClusterSelector: React.FC<ClusterSelectorType> = ({
 
             {defaultOption?.isProd && <span className="px-6 py-2 br-4 bcb-1 cb-7 fs-12 lh-16 fw-5">Production</span>}
 
-            <PopupMenu autoClose>
-                <PopupMenu.Button rootClassName="flex ml-auto p-4 border__secondary" isKebab>
-                    <MenuDots className="icon-dim-16 fcn-7" data-testid="popup-menu-button" />
-                </PopupMenu.Button>
-
-                <PopupMenu.Body rootClassName="dc__border p-4">
-                    <div className="w-150 flexbox-col">
-                        <button
-                            type="button"
-                            className="dc__outline-none flexbox dc__gap-8 dc__transparent dc__hover-n50 px-12 py-6 dc__align-items-center"
-                            onClick={handleOpenDeleteModal}
-                            data-testid="delete_cluster_button"
-                        >
-                            <Icon name="ic-delete" color="R500" />
-                            <span className="fs-14 lh-1-5 cr-5">Delete</span>
-                        </button>
-                    </div>
-                </PopupMenu.Body>
-            </PopupMenu>
+            {defaultOption?.value !== String(DEFAULT_CLUSTER_ID) && (
+                <PopupMenu autoClose>
+                    <PopupMenu.Button rootClassName="flex ml-auto p-4 border__secondary" isKebab>
+                        <MenuDots className="icon-dim-16 fcn-7" data-testid="popup-menu-button" />
+                    </PopupMenu.Button>
+
+                    <PopupMenu.Body rootClassName="dc__border p-4">
+                        <div className="w-150 flexbox-col">
+                            <button
+                                type="button"
+                                className="dc__outline-none flexbox dc__gap-8 dc__transparent dc__hover-n50 px-12 py-6 dc__align-items-center"
+                                onClick={handleOpenDeleteModal}
+                                data-testid="delete_cluster_button"
+                            >
+                                <Icon name="ic-delete" color="R500" />
+                                <span className="fs-14 lh-1-5 cr-5">Delete</span>
+                            </button>
+                        </div>
+                    </PopupMenu.Body>
+                </PopupMenu>
+            )}
 
             {openDeleteClusterModal && (
                 <DeleteClusterConfirmationModal

src/components/common/hooks/useOnline/useOnline.ts

@@ -1,53 +1,21 @@
-import { useEffect, useRef, useState } from 'react'
+import { useEffect, useState } from 'react'
 
 import { noop, useMainContext } from '@devtron-labs/devtron-fe-common-lib'
 
-import { getInternetConnectivity } from '@Services/service'
-
-import { INTERNET_CONNECTIVITY_INTERVAL } from '../constants'
-
 export const useOnline = ({ onOnline = noop, onOffline = noop }: { onOnline?: () => void; onOffline?: () => void }) => {
     const [online, setOnline] = useState(structuredClone(navigator.onLine))
-    const abortControllerRef = useRef<AbortController>(new AbortController())
-    const timeoutRef = useRef<NodeJS.Timeout>(null)
     const { isAirgapped } = useMainContext()
 
-    const checkConnectivity = async () => {
-        if (isAirgapped) return
-        // Cancel any pending request
-        if (abortControllerRef.current) {
-            abortControllerRef.current.abort()
-        }
-
-        const controller = new AbortController()
-        abortControllerRef.current = controller
-
-        try {
-            await getInternetConnectivity(abortControllerRef.current)
-            setOnline(true)
-            if (online) {
-                onOnline()
-            }
-        } catch {
-            setOnline(false)
-        } finally {
-            timeoutRef.current = setTimeout(checkConnectivity, INTERNET_CONNECTIVITY_INTERVAL)
-        }
-    }
     const handleOffline = () => {
-        if (timeoutRef.current) {
-            clearTimeout(timeoutRef.current)
-        }
-        abortControllerRef.current.abort()
         setOnline(false)
         if (onOffline) {
             onOffline()
         }
     }
 
-    const handleOnline = async () => {
-        // Verify connectivity when browser reports online
-        await checkConnectivity()
+    const handleOnline = () => {
+        setOnline(navigator.onLine)
+        onOnline()
     }
 
     useEffect(() => {
@@ -56,12 +24,8 @@ export const useOnline = ({ onOnline = noop, onOffline = noop }: { onOnline?: ()
         window.addEventListener('offline', handleOffline)
 
         return () => {
-            if (timeoutRef.current) {
-                clearTimeout(timeoutRef.current)
-            }
             window.removeEventListener('offline', handleOffline)
             window.removeEventListener('online', handleOnline)
-            abortControllerRef.current.abort()
         }
     }, [isAirgapped])