chore: migrate useAsync to common

AbhishekA1509 · AbhishekA1509 · commit bd3001237bec · 2023-10-03T17:09:07.000+05:30
diff --git a/src/components/AppSelector/ChartSelector.tsx b/src/components/AppSelector/ChartSelector.tsx
@@ -1,7 +1,8 @@
 import React from 'react';
 import { useParams, useHistory, generatePath, useRouteMatch } from 'react-router';
-import { mapByKey, useAsync } from '../common';
 import Select from 'react-select';
+import { useAsync } from '@devtron-labs/devtron-fe-common-lib';
+import { mapByKey } from '../common';
 import { appSelectorStyle, DropdownIndicator } from './AppSelectorUtil';
 
 interface ChartSelectorType {
diff --git a/src/components/ApplicationGroup/AppGroupDetailsRoute.tsx b/src/components/ApplicationGroup/AppGroupDetailsRoute.tsx
@@ -1,6 +1,5 @@
 import React, { Suspense, useCallback, useRef, useEffect, useState, useMemo } from 'react'
 import { Switch, Route, Redirect, NavLink } from 'react-router-dom'
-import { ErrorBoundary, useAsync, sortOptionsByLabel } from '../common'
 import {
     Progressing,
     BreadCrumb,
@@ -10,7 +9,9 @@ import {
     showError,
     GenericEmptyState,
     ToastBody,
+    useAsync,
 } from '@devtron-labs/devtron-fe-common-lib'
+import { ErrorBoundary, sortOptionsByLabel } from '../common'
 import { useParams, useRouteMatch, useHistory, generatePath, useLocation } from 'react-router'
 import ReactGA from 'react-ga4'
 import { URLS } from '../../config'
diff --git a/src/components/ApplicationGroup/Details/EnvCDDetails/EnvCDDetails.tsx b/src/components/ApplicationGroup/Details/EnvCDDetails/EnvCDDetails.tsx
@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react'
-import { Progressing, showError, sortCallback } from '@devtron-labs/devtron-fe-common-lib'
-import { useAsync, useInterval, mapByKey, asyncWrap } from '../../../common'
+import { Progressing, showError, sortCallback, useAsync } from '@devtron-labs/devtron-fe-common-lib'
+import { useInterval, mapByKey, asyncWrap } from '../../../common'
 import { ModuleNameMap } from '../../../../config'
 import { useHistory, useRouteMatch, useParams, generatePath } from 'react-router'
 import { TriggerOutput } from '../../../app/details/cdDetails/CDDetails'
diff --git a/src/components/ApplicationGroup/Details/EnvCIDetails/EnvCIDetails.tsx b/src/components/ApplicationGroup/Details/EnvCIDetails/EnvCIDetails.tsx
@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react'
 import { generatePath, Route, useHistory, useParams, useRouteMatch } from 'react-router-dom'
-import { Progressing, showError, sortCallback } from '@devtron-labs/devtron-fe-common-lib'
+import { Progressing, showError, sortCallback, useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import { URLS } from '../../../../config'
 import { APP_GROUP_CI_DETAILS } from '../../../../config/constantMessaging'
 import { EmptyView, LogResizeButton } from '../../../app/details/cicdHistory/History.components'
@@ -14,7 +14,7 @@ import {
 import { Details } from '../../../app/details/cIDetails/CIDetails'
 import { CiPipeline } from '../../../app/details/triggerView/types'
 import { getTriggerHistory } from '../../../app/service'
-import { asyncWrap, mapByKey, useAsync, useInterval } from '../../../common'
+import { asyncWrap, mapByKey, useInterval } from '../../../common'
 import { getCIConfigList } from '../../AppGroup.service'
 import { AppGroupDetailDefaultType } from '../../AppGroup.types'
 import { CIPipelineBuildType } from '../../../ciPipeline/types'
diff --git a/src/components/ApplicationGroup/Details/EnvironmentConfig/EnvConfig.tsx b/src/components/ApplicationGroup/Details/EnvironmentConfig/EnvConfig.tsx
@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from 'react'
 import { useHistory, useParams, useRouteMatch } from 'react-router-dom'
-import { Progressing, noop } from '@devtron-labs/devtron-fe-common-lib'
-import { importComponentFromFELibrary, useAsync } from '../../../common'
+import { Progressing, noop, useAsync } from '@devtron-labs/devtron-fe-common-lib'
+import { importComponentFromFELibrary } from '../../../common'
 import EnvironmentOverride from '../../../EnvironmentOverride/EnvironmentOverride'
 import { getConfigAppList } from '../../AppGroup.service'
 import { AppGroupDetailDefaultType, ConfigAppList } from '../../AppGroup.types'
diff --git a/src/components/ApplicationGroup/Details/TriggerView/BulkCITrigger.tsx b/src/components/ApplicationGroup/Details/TriggerView/BulkCITrigger.tsx
@@ -8,8 +8,9 @@ import {
     noop,
     ConsequenceType,
     ConsequenceAction,
+    useAsync,
 } from '@devtron-labs/devtron-fe-common-lib'
-import { importComponentFromFELibrary, useAsync } from '../../../common'
+import { importComponentFromFELibrary } from '../../../common'
 import { ReactComponent as Close } from '../../../../assets/icons/ic-cross.svg'
 import { ReactComponent as PlayIcon } from '../../../../assets/icons/misc/arrow-solid-right.svg'
 import { ReactComponent as Warning } from '../../../../assets/icons/ic-warning.svg'
diff --git a/src/components/ApplicationGroup/List/EnvironmentListView.tsx b/src/components/ApplicationGroup/List/EnvironmentListView.tsx
@@ -1,9 +1,9 @@
 import React, { useState, useEffect } from 'react'
-import { Progressing, toastAccessDenied } from '@devtron-labs/devtron-fe-common-lib'
+import { Progressing, toastAccessDenied, useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import EnvEmptyStates from '../EnvEmptyStates'
 import { ReactComponent as EnvIcon } from '../../../assets/icons/ic-app-group.svg'
 import { NavLink, useHistory, useLocation, useRouteMatch } from 'react-router-dom'
-import { Pagination, useAsync } from '../../common'
+import { Pagination } from '../../common'
 import { toast } from 'react-toastify'
 import { EMPTY_LIST_MESSAGING, GROUP_LIST_HEADER, NO_ACCESS_TOAST_MESSAGE } from '../Constants'
 import { getEnvAppList } from '../AppGroup.service'
diff --git a/src/components/ApplicationGroup/List/EnvironmentsList.tsx b/src/components/ApplicationGroup/List/EnvironmentsList.tsx
@@ -1,11 +1,11 @@
 import React, { useState, useEffect, useContext } from 'react'
-import { Progressing } from '@devtron-labs/devtron-fe-common-lib'
+import { Progressing, useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import { useRouteMatch } from 'react-router'
 import { ReactComponent as Search } from '../../../assets/icons/ic-search.svg'
 import { ReactComponent as Clear } from '../../../assets/icons/ic-error.svg'
 import './EnvironmentsList.scss'
 import PageHeader from '../../common/header/PageHeader'
-import { Filter, FilterOption, useAsync } from '../../common'
+import { Filter, FilterOption } from '../../common'
 import EnvironmentsListView from './EnvironmentListView'
 import { getClusterListMinWithoutAuth } from '../../../services/service'
 import { Cluster } from '../../../services/service.types'
diff --git a/src/components/EnvironmentOverride/DeploymentTemplateOverride.tsx b/src/components/EnvironmentOverride/DeploymentTemplateOverride.tsx
@@ -1,10 +1,10 @@
 import React, { useEffect, useReducer, useContext, Reducer } from 'react'
 import { useParams } from 'react-router'
 import YAML from 'yaml'
-import { showError, Progressing } from '@devtron-labs/devtron-fe-common-lib'
+import { showError, Progressing, useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import { getDeploymentTemplate, chartRefAutocomplete } from './service'
 import { getDeploymentTemplate as getBaseDeploymentTemplate } from '../deploymentConfig/service'
-import { useAsync, importComponentFromFELibrary } from '../common'
+import { importComponentFromFELibrary } from '../common'
 import '../deploymentConfig/deploymentConfig.scss'
 import {
     DeploymentConfigStateAction,
diff --git a/src/components/Jobs/JobList/JobsList.tsx b/src/components/Jobs/JobList/JobsList.tsx
@@ -7,8 +7,9 @@ import {
     showError,
     stopPropagation,
     ServerErrors,
+    useAsync,
 } from '@devtron-labs/devtron-fe-common-lib'
-import { Filter, FilterOption, useAsync } from '../../common'
+import { Filter, FilterOption } from '../../common'
 import HeaderWithCreateButton from '../../common/header/HeaderWithCreateButton/HeaderWithCreateButton'
 import { JobListViewType, JobsFilterTypeText, JobsStatusConstants } from '../Constants'
 import JobListContainer from './JobListContainer'
diff --git a/src/components/app/EventsLogs.tsx b/src/components/app/EventsLogs.tsx
@@ -1,5 +1,5 @@
 import React, { useEffect, useState, useRef } from 'react'
-import { showError, Progressing, get, Host, useSearchString } from '@devtron-labs/devtron-fe-common-lib'
+import { showError, Progressing, get, Host, useSearchString, useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import InfoIcon from '../../assets/icons/appstatus/info-filled.svg'
 import { Spinner } from 'patternfly-react';
 import LogViewer from '../LogViewer/LogViewer'
@@ -23,7 +23,7 @@ import MonacoEditor from 'react-monaco-editor';
 import { editor } from 'monaco-editor';
 import { AutoSizer } from 'react-virtualized'
 import { getSelectedNodeItems } from './details/appDetails/utils';
-import { useAsync, useKeyDown } from '../common';
+import { useKeyDown } from '../common';
 import { SocketConnectionType } from './details/appDetails/appDetails.type';
 
 const commandLineParser = require('command-line-parser')
diff --git a/src/components/app/Overview/Overview.tsx b/src/components/app/Overview/Overview.tsx
@@ -3,14 +3,13 @@ import moment from 'moment'
 import { Link, useParams } from 'react-router-dom'
 import { ModuleNameMap, Moment12HourFormat, URLS } from '../../../config'
 import { getAppOtherEnvironment, getJobCIPipeline, getTeamList } from '../../../services/service'
+import { showError, Progressing, TagType, stopPropagation, useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import {
     handleUTCTime,
     importComponentFromFELibrary,
     processDeployedTime,
     sortOptionsByValue,
-    useAsync,
 } from '../../common'
-import { showError, Progressing, TagType, stopPropagation } from '@devtron-labs/devtron-fe-common-lib'
 import { AppDetails, AppOverviewProps, JobPipeline } from '../types'
 import { ReactComponent as EditIcon } from '../../../assets/icons/ic-pencil.svg'
 import { ReactComponent as WorkflowIcon } from '../../../assets/icons/ic-workflow.svg'
diff --git a/src/components/app/details/appDetails/AppDetails.tsx b/src/components/app/details/appDetails/AppDetails.tsx
@@ -8,9 +8,9 @@ import {
     stopPropagation,
     multiSelectStyles,
     useEffectAfterMount,
-    Drawer,
     DeploymentAppTypes,
     useSearchString,
+    useAsync,
 } from '@devtron-labs/devtron-fe-common-lib'
 import { fetchAppDetailsInTime, fetchResourceTreeInTime } from '../../service'
 import {
@@ -29,7 +29,6 @@ import {
     useAppContext,
     useEventSource,
     FragmentHOC,
-    useAsync,
     ScanDetailsModal,
 } from '../../../common'
 import { CustomValueContainer, groupHeaderStyle, GroupHeading, Option } from './../../../v2/common/ReactSelect.utils'
diff --git a/src/components/app/details/appDetails/AppMetrics.tsx b/src/components/app/details/appDetails/AppMetrics.tsx
@@ -1,18 +1,16 @@
 import React, { useState, useEffect } from 'react';
 import { useParams } from 'react-router';
+import { not, Progressing, useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import { getIframeSrc, ThroughputSelect, getCalendarValue, isK8sVersionValid, LatencySelect } from './utils';
-import { ChartTypes, AppMetricsTab, AppMetricsTabType, ChartType, StatusTypes, StatusType, CalendarFocusInput, CalendarFocusInputType } from './appDetails.type';
-import { AppDetailsPathParams } from './appDetails.type';
+import { ChartTypes, AppMetricsTab, AppMetricsTabType, ChartType, StatusTypes, StatusType, CalendarFocusInput, CalendarFocusInputType, AppDetailsPathParams } from './appDetails.type';
 import { GraphModal } from './GraphsModal';
-import { DatePickerType2 as DateRangePicker, useAsync } from '../../../common';
-import { not, Progressing } from '@devtron-labs/devtron-fe-common-lib'
+import { DatePickerType2 as DateRangePicker } from '../../../common';
 import { ReactComponent as GraphIcon } from '../../../../assets/icons/ic-graph.svg';
 import { ReactComponent as Fullscreen } from '../../../../assets/icons/ic-fullscreen-2.svg';
 import { ReactComponent as OpenInNew } from '../../../../assets/icons/ic-open-in-new.svg'
-import { getAppComposeURL, APP_COMPOSE_STAGE, DOCUMENTATION, DEFAULTK8SVERSION, ModuleNameMap } from '../../../../config';
+import { getAppComposeURL, APP_COMPOSE_STAGE, DOCUMENTATION, DEFAULTK8SVERSION, ModuleNameMap, URLS } from '../../../../config';
 import { Link, NavLink } from 'react-router-dom';
 import { isDatasourceConfigured, isDatasourceHealthy } from './appDetails.service';
-import { URLS } from '../../../../config';
 import { getHostURLConfiguration } from '../../../../services/service';
 import { toast } from 'react-toastify'
 import PrometheusErrorImage from '../../../../assets/img/ic-error-prometheus.png';
diff --git a/src/components/app/details/cIDetails/CIDetails.tsx b/src/components/app/details/cIDetails/CIDetails.tsx
@@ -1,7 +1,7 @@
 import React, { useState, useEffect, useMemo } from 'react'
-import { showError, Progressing, Reload, GenericEmptyState } from '@devtron-labs/devtron-fe-common-lib'
+import { showError, Progressing, Reload, GenericEmptyState, useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import { getCIPipelines, getCIHistoricalStatus, getTriggerHistory, getArtifact, getTagDetails } from '../../service'
-import { useScrollable, useAsync, useInterval, mapByKey, asyncWrap } from '../../../common'
+import { useScrollable, useInterval, mapByKey, asyncWrap } from '../../../common'
 import { URLS, ModuleNameMap } from '../../../../config'
 import { NavLink, Switch, Route, Redirect } from 'react-router-dom'
 import { useRouteMatch, useParams, useHistory, generatePath } from 'react-router'
diff --git a/src/components/app/details/cdDetails/CDDetails.tsx b/src/components/app/details/cdDetails/CDDetails.tsx
@@ -6,10 +6,10 @@ import {
     UserApprovalMetadataType,
     GenericEmptyState,
     DeploymentAppTypes,
+    useAsync,
 } from '@devtron-labs/devtron-fe-common-lib'
 import { getAppOtherEnvironmentMin, getCDConfig as getCDPipelines } from '../../../../services/service'
 import {
-    useAsync,
     useInterval,
     useScrollable,
     mapByKey,
diff --git a/src/components/app/details/testViewer/TestRunDetails.tsx b/src/components/app/details/testViewer/TestRunDetails.tsx
@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useMemo } from 'react';
-import { useAsync, useDebouncedEffect } from '../../../common/';
-import { Progressing, Drawer } from '@devtron-labs/devtron-fe-common-lib'
+import { Progressing, Drawer, useAsync } from '@devtron-labs/devtron-fe-common-lib'
+import { useDebouncedEffect } from '../../../common/';
 import { useParams } from 'react-router';
 import './TestRunDetails.scss';
 import List from './List';
@@ -14,8 +14,7 @@ import { ReactComponent as FileIcon } from '../../../../assets/icons/ic-file.svg
 import { ReactComponent as Cross } from '../../../../assets/icons/ic-close.svg';
 import { ReactComponent as Question } from '../../../../assets/icons/ic-question.svg';
 import { getTestSuites, getTestCase, getSuiteDetail } from './service';
-import { PieChart, Pie, Cell } from 'recharts';
-import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer } from 'recharts';
+import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, PieChart, Pie, Cell } from 'recharts'
 import {SelectedNames} from './Test.types'
 
 const computeHistogram = require('compute-histogram');
diff --git a/src/components/app/details/testViewer/TestRunList.tsx b/src/components/app/details/testViewer/TestRunList.tsx
@@ -1,7 +1,7 @@
 import React, {useState, useMemo} from 'react'
-import {useAsync, mapByKey, Td, DropdownIcon, DatePicker} from '../../../common'
-import { Progressing, multiSelectStyles, Option } from '@devtron-labs/devtron-fe-common-lib'
 import {useParams, useRouteMatch, generatePath, useHistory, Route, Switch} from 'react-router'
+import { Progressing, multiSelectStyles, Option, useAsync } from '@devtron-labs/devtron-fe-common-lib'
+import { mapByKey, Td, DropdownIcon, DatePicker } from '../../../common'
 import {getCIPipelines } from '../../service'
 import Select, {components} from 'react-select';
 import {getTriggerList, getFilters} from './service'
diff --git a/src/components/app/list-new/AppList.tsx b/src/components/app/list-new/AppList.tsx
@@ -1,14 +1,15 @@
 import React, { useState, useEffect, useContext } from 'react'
 import { useLocation, useHistory, useParams } from 'react-router'
 import { Switch, Route } from 'react-router-dom'
-import { Filter, FilterOption, handleUTCTime, useAsync } from '../../common'
 import {
     showError,
     Progressing,
     ErrorScreenManager,
     stopPropagation,
     ServerErrors,
+    useAsync,
 } from '@devtron-labs/devtron-fe-common-lib'
+import { Filter, FilterOption, handleUTCTime } from '../../common'
 import { ReactComponent as Search } from '../../../assets/icons/ic-search.svg'
 import { getInitData, buildClusterVsNamespace, getNamespaces } from './AppListService'
 import { AppListViewType } from '../config'
diff --git a/src/components/chartRepo/ChartRepo.tsx b/src/components/chartRepo/ChartRepo.tsx
@@ -1,13 +1,16 @@
 import React, { useState } from 'react'
-import { useForm, useAsync, getNonEditableChartRepoText } from '../common'
 import {
     showError,
     Progressing,
     ToastBody,
     ErrorScreenNotAuthorized,
     Checkbox,
     CHECKBOX_VALUE,
+    useAsync,
+    RadioGroup, 
+    RadioGroupItem,
 } from '@devtron-labs/devtron-fe-common-lib'
+import { useForm, getNonEditableChartRepoText } from '../common'
 import { toast } from 'react-toastify'
 import { List, CustomInput, ProtectedInput } from '../globalConfigurations/GlobalConfiguration'
 import Tippy from '@tippyjs/react';
@@ -20,7 +23,6 @@ import { ValidateForm, VALIDATION_STATUS } from '../common/ValidateForm/Validate
 import './chartRepo.scss'
 import DeleteComponent from '../../util/DeleteComponent'
 import {DC_CHART_REPO_CONFIRMATION_MESSAGE, DeleteComponentsName} from '../../config/constantMessaging'
-import { RadioGroup, RadioGroupItem } from '@devtron-labs/devtron-fe-common-lib'
 import { ChartFormFields } from './ChartRepoType'
 import {ChartRepoType} from "./chartRepo.types";
 import { NavLink } from 'react-router-dom'
diff --git a/src/components/charts/AdvancedConfig.tsx b/src/components/charts/AdvancedConfig.tsx
@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useMemo } from 'react'
-import { Select, mapByKey, useAsync, useKeyDown, Info, Pencil } from '../common'
-import { showError, Progressing, VisibleModal } from '@devtron-labs/devtron-fe-common-lib'
+import { showError, Progressing, VisibleModal, useAsync } from '@devtron-labs/devtron-fe-common-lib'
+import { Select, mapByKey, useKeyDown, Info, Pencil } from '../common'
 import CodeEditor from '../CodeEditor/CodeEditor'
 import { getEnvironmentListMin } from '../../services/service'
 import { ChartGroupEntry, AdvancedConfigHelpers, ChartValuesNativeType, ChartVersionType } from './charts.types'
diff --git a/src/components/charts/ChartGroupDetails.tsx b/src/components/charts/ChartGroupDetails.tsx
@@ -1,11 +1,18 @@
-import React, { useState, useEffect } from 'react'
+import React, { useState } from 'react'
 import { useParams, useHistory, useRouteMatch } from 'react-router'
+import {
+    showError,
+    Progressing,
+    BreadCrumb,
+    useBreadcrumb,
+    ConditionalWrap,
+    useAsync,
+} from '@devtron-labs/devtron-fe-common-lib'
 import ChartGroupDeployments from './ChartGroupDeployments'
 import MultiChartSummary from './MultiChartSummary'
 import useChartGroup from './useChartGroup'
 import { URLS } from '../../config'
-import { Pencil, useAsync } from '../common'
-import { showError, Progressing, BreadCrumb, useBreadcrumb, ConditionalWrap } from '@devtron-labs/devtron-fe-common-lib'
+import { Pencil } from '../common'
 import { getDeployableChartsFromConfiguredCharts } from './list/DiscoverCharts'
 import {
     deployChartGroup,
diff --git a/src/components/charts/list/ChartGroup.tsx b/src/components/charts/list/ChartGroup.tsx
@@ -1,6 +1,5 @@
 import React from 'react'
-import { useAsync } from '../../common'
-import { Progressing, BreadCrumb, useBreadcrumb } from '@devtron-labs/devtron-fe-common-lib'
+import { Progressing, BreadCrumb, useBreadcrumb, useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import { getChartGroups } from '../charts.service'
 import ChartGroupCard from '../util/ChartGroupCard'
 import { useRouteMatch, useHistory, useLocation, Switch } from 'react-router'
diff --git a/src/components/cluster/ClusterForm.tsx b/src/components/cluster/ClusterForm.tsx
@@ -11,11 +11,12 @@ import {
     Toggle,
     GenericEmptyState,
     ResizableTextarea,
+    useAsync,
 } from '@devtron-labs/devtron-fe-common-lib'
 import { ReactComponent as Edit } from '../../assets/icons/ic-pencil.svg'
 import { ReactComponent as ErrorIcon } from '../../assets/icons/ic-warning-y6.svg'
 import YAML from 'yaml'
-import { useForm, CustomPassword, useAsync, importComponentFromFELibrary } from '../common'
+import { useForm, CustomPassword, importComponentFromFELibrary } from '../common'
 import { ModuleStatus } from '../v2/devtronStackManager/DevtronStackManager.type'
 import { CustomInput } from '../globalConfigurations/GlobalConfiguration'
 import NoResults from '../../assets/img/empty-noresult@2x.png'
diff --git a/src/components/common/FloatingVariablesSuggestions/FloatingVariablesSuggestions.tsx b/src/components/common/FloatingVariablesSuggestions/FloatingVariablesSuggestions.tsx
@@ -1,7 +1,7 @@
 import React, { useState, useRef, useMemo, useCallback, memo, useEffect } from 'react'
+import { useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import Draggable from 'react-draggable'
 import { useWindowSize } from '../helpers/UseWindowSize'
-import { useAsync } from '../helpers/Helpers'
 import Suggestions from './Suggestions'
 import { getScopedVariables } from './service'
 import { FloatingVariablesSuggestionsProps } from './types'
diff --git a/src/components/common/FloatingVariablesSuggestions/__tests__/FloatingVariablesSuggestions.test.tsx b/src/components/common/FloatingVariablesSuggestions/__tests__/FloatingVariablesSuggestions.test.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import { render, screen, fireEvent } from '@testing-library/react'
+import { useAsync } from '@devtron-labs/devtron-fe-common-lib'
 import FloatingVariablesSuggestions from '../FloatingVariablesSuggestions'
-import { useAsync } from '../../helpers/Helpers'
 
 // Mocking suggestions items since its already tested
 jest.mock(
@@ -12,7 +12,7 @@ jest.mock(
         },
 )
 
-jest.mock('../../helpers/Helpers', () => ({
+jest.mock('@devtron-labs/devtron-fe-common-lib', () => ({
     useAsync: jest.fn(),
 }))
 
diff --git a/src/components/common/helpers/Helpers.tsx b/src/components/common/helpers/Helpers.tsx
diff --git a/src/components/common/navigation/NavigationRoutes.tsx b/src/components/common/navigation/NavigationRoutes.tsx
diff --git a/src/components/deploymentConfig/DeploymentConfig.tsx b/src/components/deploymentConfig/DeploymentConfig.tsx
diff --git a/src/components/deploymentGroups/BulkActionDetails.tsx b/src/components/deploymentGroups/BulkActionDetails.tsx
diff --git a/src/components/deploymentGroups/BulkActionEdit.tsx b/src/components/deploymentGroups/BulkActionEdit.tsx
diff --git a/src/components/dockerRegistry/Docker.tsx b/src/components/dockerRegistry/Docker.tsx
diff --git a/src/components/gitProvider/GitProvider.tsx b/src/components/gitProvider/GitProvider.tsx
diff --git a/src/components/scopedVariables/ScopedVariables.tsx b/src/components/scopedVariables/ScopedVariables.tsx
diff --git a/src/components/scopedVariables/__tests__/ScopedVariables.test.tsx b/src/components/scopedVariables/__tests__/ScopedVariables.test.tsx
diff --git a/src/components/userGroups/UserGroup.tsx b/src/components/userGroups/UserGroup.tsx
diff --git a/src/components/v2/appDetails/sourceInfo/environmentStatus/EnvironmentStatus.component.tsx b/src/components/v2/appDetails/sourceInfo/environmentStatus/EnvironmentStatus.component.tsx
