chore: code refactroing

Author: shivani170

src/components/common/hooks/constants.ts

@@ -33,4 +33,4 @@ export const FILE_READING_FAILED_STATUS = {
 }
 
 export const ONLINE_BANNER_TIMEOUT = 3000
-export const INTERNET_CONNECTIVITY_INTERVAL = 20000
+export const INTERNET_CONNECTIVITY_INTERVAL = 30000

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

@@ -3,47 +3,27 @@ import { Routes } from '@Config/constants'
 import { INTERNET_CONNECTIVITY_INTERVAL } from '../constants'
 import { CheckConnectivityParamsType, FetchConnectivityParamsType } from './types'
 
-const fetchWithTimeout = ({
-    url,
-    options,
-    controller,
-    setTimeoutRef,
-    checkConnectivity,
-}: FetchConnectivityParamsType): Promise<any> => {
+const fetchWithTimeout = ({ url, options, controller }: FetchConnectivityParamsType): Promise<any> => {
     const timeoutId = setTimeout(() => controller.abort(), INTERNET_CONNECTIVITY_INTERVAL)
 
     return fetch(url, { ...options, signal: controller.signal }).finally(() => {
         clearTimeout(timeoutId)
-        const nextRef = setTimeout(checkConnectivity, INTERNET_CONNECTIVITY_INTERVAL)
-        setTimeoutRef(nextRef)
     })
 }
 
-export const getFallbackInternetConnectivity = ({
-    controller,
-    setTimeoutRef,
-    checkConnectivity,
-}: CheckConnectivityParamsType): Promise<any> =>
+export const getFallbackInternetConnectivity = ({ controller }: CheckConnectivityParamsType): Promise<any> =>
     fetchWithTimeout({
         url: 'https://www.google.com/favicon.ico',
         options: {
             method: 'HEAD',
             mode: 'no-cors',
         },
         controller,
-        setTimeoutRef,
-        checkConnectivity,
     })
 
-export const getInternetConnectivity = ({
-    controller,
-    setTimeoutRef,
-    checkConnectivity,
-}: CheckConnectivityParamsType): Promise<any> => {
+export const getInternetConnectivity = ({ controller }: CheckConnectivityParamsType): Promise<any> => {
     const baseUrl = window._env_?.CENTRAL_API_ENDPOINT ?? 'https://api.devtron.ai'
     const url = `${baseUrl}/${Routes.HEALTH}`
 
-    return fetchWithTimeout({ url, options: {}, controller, setTimeoutRef, checkConnectivity }).then((res) =>
-        res.json(),
-    )
+    return fetchWithTimeout({ url, options: {}, controller })
 }

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

@@ -2,9 +2,6 @@ export interface FetchConnectivityParamsType {
     url: string
     options: RequestInit
     controller: AbortController
-    setTimeoutRef: (ref: NodeJS.Timeout) => void
-    checkConnectivity: () => void
 }
 
-export interface CheckConnectivityParamsType
-    extends Pick<FetchConnectivityParamsType, 'controller' | 'setTimeoutRef' | 'checkConnectivity'> {}
+export interface CheckConnectivityParamsType extends Pick<FetchConnectivityParamsType, 'controller'> {}

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

@@ -1,6 +1,6 @@
 import { useEffect, useRef, useState } from 'react'
 
-import { getIsRequestAborted, noop, useMainContext } from '@devtron-labs/devtron-fe-common-lib'
+import { noop, useMainContext } from '@devtron-labs/devtron-fe-common-lib'
 
 import { INTERNET_CONNECTIVITY_INTERVAL } from '../constants'
 import { getFallbackInternetConnectivity, getInternetConnectivity } from './service'
@@ -18,18 +18,12 @@ export const useOnline = ({ onOnline = noop }: { onOnline?: () => void }) => {
         abortControllerRef.current.abort()
     }
 
-    const onConnectivitySuccess = () => {
+    const onConnectivitySuccess = (checkConnectivity) => {
         setOnline((prev) => {
             if (!prev) onOnline()
             return true
         })
-    }
-
-    const setTimeoutRef = (ref: NodeJS.Timeout) => {
-        if (timeoutRef.current) {
-            clearTimeout(timeoutRef.current)
-        }
-        timeoutRef.current = ref
+        timeoutRef.current = setTimeout(checkConnectivity, INTERNET_CONNECTIVITY_INTERVAL)
     }
 
     const checkConnectivity = async () => {
@@ -42,26 +36,28 @@ export const useOnline = ({ onOnline = noop }: { onOnline?: () => void }) => {
         try {
             await getFallbackInternetConnectivity({
                 controller: abortControllerRef.current,
-                setTimeoutRef,
-                checkConnectivity,
             })
-            onConnectivitySuccess()
-        } catch (error) {
-            if (getIsRequestAborted(error)) return
+            onConnectivitySuccess(checkConnectivity)
+        } catch {
+            if (abortControllerRef.current.signal.aborted) {
+                if (timeoutRef.current) {
+                    timeoutRef.current = setTimeout(checkConnectivity, INTERNET_CONNECTIVITY_INTERVAL)
+                }
+                return
+            }
             const fallbackController = new AbortController()
             abortControllerRef.current = fallbackController
             try {
                 await getInternetConnectivity({
                     controller: abortControllerRef.current,
-                    setTimeoutRef,
-                    checkConnectivity,
                 })
-                onConnectivitySuccess()
-            } catch (fallbackError) {
-                if (!getIsRequestAborted(fallbackError)) {
+                onConnectivitySuccess(checkConnectivity)
+            } catch {
+                if (!abortControllerRef.current.signal.aborted) {
                     setOnline(false)
+                } else if (timeoutRef.current) {
+                    timeoutRef.current = setTimeout(checkConnectivity, INTERNET_CONNECTIVITY_INTERVAL)
                 }
-                timeoutRef.current = setTimeout(checkConnectivity, INTERNET_CONNECTIVITY_INTERVAL)
             }
         }
     }