use precise imports of react-use

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

.changeset/short-sloths-tell.md

@@ -0,0 +1,55 @@
+---
+'@backstage/cli': patch
+'@backstage/core-app-api': patch
+'@backstage/core-components': patch
+'@backstage/dev-utils': patch
+'@backstage/plugin-allure': patch
+'@backstage/plugin-apache-airflow': patch
+'@backstage/plugin-azure-devops': patch
+'@backstage/plugin-badges': patch
+'@backstage/plugin-bazaar': patch
+'@backstage/plugin-bitrise': patch
+'@backstage/plugin-catalog': patch
+'@backstage/plugin-catalog-graph': patch
+'@backstage/plugin-catalog-import': patch
+'@backstage/plugin-catalog-react': patch
+'@backstage/plugin-circleci': patch
+'@backstage/plugin-cloudbuild': patch
+'@backstage/plugin-code-coverage': patch
+'@backstage/plugin-config-schema': patch
+'@backstage/plugin-cost-insights': patch
+'@backstage/plugin-explore': patch
+'@backstage/plugin-firehydrant': patch
+'@backstage/plugin-fossa': patch
+'@backstage/plugin-gcp-projects': patch
+'@backstage/plugin-git-release-manager': patch
+'@backstage/plugin-github-actions': patch
+'@backstage/plugin-github-deployments': patch
+'@backstage/plugin-gitops-profiles': patch
+'@backstage/plugin-graphiql': patch
+'@backstage/plugin-home': patch
+'@backstage/plugin-ilert': patch
+'@backstage/plugin-jenkins': patch
+'@backstage/plugin-kafka': patch
+'@backstage/plugin-kubernetes': patch
+'@backstage/plugin-lighthouse': patch
+'@backstage/plugin-newrelic': patch
+'@backstage/plugin-newrelic-dashboard': patch
+'@backstage/plugin-org': patch
+'@backstage/plugin-pagerduty': patch
+'@backstage/plugin-permission-react': patch
+'@backstage/plugin-rollbar': patch
+'@backstage/plugin-scaffolder': patch
+'@backstage/plugin-search': patch
+'@backstage/plugin-sentry': patch
+'@backstage/plugin-shortcuts': patch
+'@backstage/plugin-sonarqube': patch
+'@backstage/plugin-splunk-on-call': patch
+'@backstage/plugin-tech-insights': patch
+'@backstage/plugin-tech-radar': patch
+'@backstage/plugin-techdocs': patch
+'@backstage/plugin-user-settings': patch
+'@backstage/plugin-xcmetrics': patch
+---
+
+Internal refactor of the `react-use` imports to use `react-use/lib/*` instead.

contrib/docs/tutorials/quickstart-app-plugin/ExampleFetchComponent.md

@@ -4,7 +4,7 @@ ExampleFetchComponent.tsx reference
 
 ```tsx
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import Alert from '@material-ui/lab/Alert';
 import { githubAuthApiRef, useApi } from '@backstage/core-plugin-api';
 import { Table, TableColumn, Progress } from '@backstage/core-components';

docs/tutorials/quickstart-app-plugin.md

@@ -135,7 +135,7 @@ changes, let's start by wiping this component clean.
 
 ```tsx
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import Alert from '@material-ui/lab/Alert';
 import { Table, TableColumn, Progress } from '@backstage/core-components';
 import { githubAuthApiRef, useApi } from '@backstage/core-plugin-api';

packages/cli/templates/default-plugin/src/components/ExampleFetchComponent/ExampleFetchComponent.tsx.hbs

@@ -2,7 +2,7 @@ import React from 'react';
 import { makeStyles } from '@material-ui/core/styles';
 import { Table, TableColumn, Progress } from '@backstage/core-components';
 import Alert from '@material-ui/lab/Alert';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 
 const useStyles = makeStyles({
   avatar: {

packages/core-app-api/src/app/AppManager.tsx

@@ -24,7 +24,7 @@ import React, {
   useState,
 } from 'react';
 import { Route, Routes } from 'react-router-dom';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import {
   ApiProvider,
   ApiRegistry,

packages/core-app-api/src/app/AppThemeProvider.tsx

@@ -16,7 +16,7 @@
 
 import React, { useMemo, useEffect, useState, PropsWithChildren } from 'react';
 import { useApi, appThemeApiRef, AppTheme } from '@backstage/core-plugin-api';
-import { useObservable } from 'react-use';
+import useObservable from 'react-use/lib/useObservable';
 
 // This tries to find the most accurate match, but also falls back to less
 // accurate results in order to avoid errors.

packages/core-components/src/components/CopyTextButton/CopyTextButton.test.tsx

@@ -19,7 +19,7 @@ import { act, fireEvent } from '@testing-library/react';
 import { renderInTestApp, TestApiProvider } from '@backstage/test-utils';
 import { CopyTextButton } from './CopyTextButton';
 import { errorApiRef } from '@backstage/core-plugin-api';
-import { useCopyToClipboard } from 'react-use';
+import useCopyToClipboard from 'react-use/lib/useCopyToClipboard';
 
 jest.mock('popper.js', () => {
   const PopperJS = jest.requireActual('popper.js');
@@ -32,14 +32,12 @@ jest.mock('popper.js', () => {
   };
 });
 
-jest.mock('react-use', () => {
-  const original = jest.requireActual('react-use');
+jest.mock('react-use/lib/useCopyToClipboard', () => {
+  const original = jest.requireActual('react-use/lib/useCopyToClipboard');
 
   return {
-    ...original,
-    useCopyToClipboard: jest
-      .fn()
-      .mockImplementation(original.useCopyToClipboard),
+    __esModule: true,
+    default: jest.fn().mockImplementation(original.default),
   };
 });
 

packages/core-components/src/components/CopyTextButton/CopyTextButton.tsx

@@ -19,7 +19,7 @@ import IconButton from '@material-ui/core/IconButton';
 import Tooltip from '@material-ui/core/Tooltip';
 import CopyIcon from '@material-ui/icons/FileCopy';
 import React, { MouseEventHandler, useEffect, useState } from 'react';
-import { useCopyToClipboard } from 'react-use';
+import useCopyToClipboard from 'react-use/lib/useCopyToClipboard';
 
 /**
  * Properties for {@link CopyTextButton}

packages/core-components/src/components/DismissableBanner/DismissableBanner.tsx

@@ -16,7 +16,7 @@
 
 import React, { ReactNode, useState, useEffect } from 'react';
 import { useApi, storageApiRef } from '@backstage/core-plugin-api';
-import { useObservable } from 'react-use';
+import useObservable from 'react-use/lib/useObservable';
 import classNames from 'classnames';
 import { makeStyles } from '@material-ui/core/styles';
 import { BackstageTheme } from '@backstage/theme';

packages/core-components/src/components/LogViewer/useLogViewerSearch.tsx

@@ -15,7 +15,7 @@
  */
 
 import { useMemo, useState } from 'react';
-import { useToggle } from 'react-use';
+import useToggle from 'react-use/lib/useToggle';
 import { AnsiLine } from './AnsiProcessor';
 
 export function applySearchFilter(lines: AnsiLine[], searchText: string) {

packages/core-components/src/components/LogViewer/useLogViewerSelection.tsx

@@ -16,7 +16,7 @@
 
 import { errorApiRef, useApi } from '@backstage/core-plugin-api';
 import { useEffect, useState } from 'react';
-import { useCopyToClipboard } from 'react-use';
+import useCopyToClipboard from 'react-use/lib/useCopyToClipboard';
 import { AnsiLine } from './AnsiProcessor';
 
 export function useLogViewerSelection(lines: AnsiLine[]) {

packages/core-components/src/components/OAuthRequestDialog/OAuthRequestDialog.tsx

@@ -22,7 +22,7 @@ import DialogTitle from '@material-ui/core/DialogTitle';
 import List from '@material-ui/core/List';
 import Button from '@material-ui/core/Button';
 import React, { useMemo, useState } from 'react';
-import { useObservable } from 'react-use';
+import useObservable from 'react-use/lib/useObservable';
 import LoginRequestListItem from './LoginRequestListItem';
 import { useApi, oauthRequestApiRef } from '@backstage/core-plugin-api';
 

packages/core-components/src/components/OverflowTooltip/OverflowTooltip.tsx

@@ -18,7 +18,7 @@ import { makeStyles } from '@material-ui/core/styles';
 import Tooltip, { TooltipProps } from '@material-ui/core/Tooltip';
 import React, { useState } from 'react';
 import TextTruncate, { TextTruncateProps } from 'react-text-truncate';
-import { useMountedState } from 'react-use';
+import useMountedState from 'react-use/lib/useMountedState';
 
 type Props = {
   text: TextTruncateProps['text'];

packages/core-components/src/components/Tabs/Tabs.tsx

@@ -21,7 +21,7 @@ import { makeStyles } from '@material-ui/core/styles';
 import NavigateBeforeIcon from '@material-ui/icons/NavigateBefore';
 import NavigateNextIcon from '@material-ui/icons/NavigateNext';
 import { chunkArray } from './utils';
-import { useWindowSize } from 'react-use';
+import useWindowSize from 'react-use/lib/useWindowSize';
 
 /* Import Components */
 

packages/core-components/src/hooks/useQueryParamState.ts

@@ -18,7 +18,7 @@ import { isEqual } from 'lodash';
 import qs from 'qs';
 import { useEffect, useState } from 'react';
 import { useSearchParams } from 'react-router-dom';
-import { useDebounce } from 'react-use';
+import useDebounce from 'react-use/lib/useDebounce';
 
 function stringify(queryParams: any): string {
   // Even though these setting don't look nice (e.g. escaped brackets), we should keep

packages/core-components/src/layout/Sidebar/Intro.tsx

@@ -21,7 +21,7 @@ import { makeStyles } from '@material-ui/core/styles';
 import Typography from '@material-ui/core/Typography';
 import CloseIcon from '@material-ui/icons/Close';
 import React, { useContext, useState } from 'react';
-import { useLocalStorage } from 'react-use';
+import useLocalStorage from 'react-use/lib/useLocalStorage';
 import {
   sidebarConfig,
   SidebarContext,

packages/core-components/src/layout/SignInPage/SignInPage.tsx

@@ -25,7 +25,7 @@ import Button from '@material-ui/core/Button';
 import Grid from '@material-ui/core/Grid';
 import Typography from '@material-ui/core/Typography';
 import React, { useState } from 'react';
-import { useMount } from 'react-use';
+import useMount from 'react-use/lib/useMount';
 import { Progress } from '../../components/Progress';
 import { Content } from '../Content/Content';
 import { ContentHeader } from '../ContentHeader/ContentHeader';

packages/dev-utils/src/devApp/SidebarThemeSwitcher.tsx

@@ -18,7 +18,7 @@ import { appThemeApiRef, useApi } from '@backstage/core-plugin-api';
 import { ListItemIcon, ListItemText, Menu, MenuItem } from '@material-ui/core';
 import AutoIcon from '@material-ui/icons/BrightnessAuto';
 import React, { cloneElement, useCallback, useState } from 'react';
-import { useObservable } from 'react-use';
+import useObservable from 'react-use/lib/useObservable';
 
 type ThemeIconProps = {
   active?: boolean;

plugins/allure/src/components/AllureReportComponent/AllureReportComponent.tsx

@@ -26,7 +26,7 @@ import {
   MissingAnnotationEmptyState,
   Progress,
 } from '@backstage/core-components';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { Entity } from '@backstage/catalog-model';
 
 const AllureReport = (props: { entity: Entity }) => {

plugins/apache-airflow/src/components/DagTableComponent/DagTableComponent.tsx

@@ -31,7 +31,7 @@ import Typography from '@material-ui/core/Typography';
 import OpenInBrowserIcon from '@material-ui/icons/OpenInBrowser';
 import Alert from '@material-ui/lab/Alert';
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { apacheAirflowApiRef } from '../../api';
 import { Dag } from '../../api/types';
 import { ScheduleIntervalLabel } from '../ScheduleIntervalLabel';

plugins/apache-airflow/src/components/StatusComponent/StatusComponent.tsx

@@ -22,7 +22,7 @@ import {
 import { useApi } from '@backstage/core-plugin-api';
 import Alert from '@material-ui/lab/Alert';
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { apacheAirflowApiRef } from '../../api';
 import { InstanceStatus } from '../../api/types';
 

plugins/apache-airflow/src/components/VersionComponent/VersionComponent.tsx

@@ -22,7 +22,7 @@ import {
 import { useApi } from '@backstage/core-plugin-api';
 import Alert from '@material-ui/lab/Alert';
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { apacheAirflowApiRef } from '../../api';
 import { InstanceVersion } from '../../api/types';
 

plugins/azure-devops/src/hooks/useAllTeams.ts

@@ -17,7 +17,7 @@
 import { Team } from '@backstage/plugin-azure-devops-common';
 import { azureDevOpsApiRef } from '../api';
 import { useApi } from '@backstage/core-plugin-api';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 
 export function useAllTeams(): {
   teams?: Team[];

plugins/azure-devops/src/hooks/useDashboardPullRequests.ts

@@ -15,7 +15,8 @@
  */
 
 import { errorApiRef, useApi } from '@backstage/core-plugin-api';
-import { useAsyncRetry, useInterval } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
+import useInterval from 'react-use/lib/useInterval';
 
 import { DashboardPullRequest } from '@backstage/plugin-azure-devops-common';
 import { azureDevOpsApiRef } from '../api';

plugins/azure-devops/src/hooks/usePullRequests.ts

@@ -24,7 +24,7 @@ import { AZURE_DEVOPS_DEFAULT_TOP } from '../constants';
 import { Entity } from '@backstage/catalog-model';
 import { azureDevOpsApiRef } from '../api';
 import { useApi } from '@backstage/core-plugin-api';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { useProjectRepoFromEntity } from './useProjectRepoFromEntity';
 
 export function usePullRequests(

plugins/azure-devops/src/hooks/useRepoBuilds.ts

@@ -23,7 +23,7 @@ import { AZURE_DEVOPS_DEFAULT_TOP } from '../constants';
 import { Entity } from '@backstage/catalog-model';
 import { azureDevOpsApiRef } from '../api';
 import { useApi } from '@backstage/core-plugin-api';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { useProjectRepoFromEntity } from './useProjectRepoFromEntity';
 
 export function useRepoBuilds(

plugins/badges/src/components/EntityBadgesDialog.tsx

@@ -27,7 +27,7 @@ import {
   useTheme,
 } from '@material-ui/core';
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { badgesApiRef } from '../api';
 
 import {

plugins/bazaar/src/components/EntityBazaarInfoCard/EntityBazaarInfoCard.tsx

@@ -15,7 +15,7 @@
  */
 
 import React, { useState, useEffect } from 'react';
-import { useAsyncFn } from 'react-use';
+import useAsyncFn from 'react-use/lib/useAsyncFn';
 import { useApi } from '@backstage/core-plugin-api';
 import { stringifyEntityRef } from '@backstage/catalog-model';
 import { useEntity } from '@backstage/plugin-catalog-react';

plugins/bazaar/src/components/EntityBazaarInfoContent/EntityBazaarInfoContent.tsx

@@ -30,7 +30,7 @@ import { useApi, identityApiRef } from '@backstage/core-plugin-api';
 import { BazaarProject, Member } from '../../types';
 import { bazaarApiRef } from '../../api';
 import { Alert } from '@material-ui/lab';
-import { useAsyncFn } from 'react-use';
+import useAsyncFn from 'react-use/lib/useAsyncFn';
 import ExitToAppIcon from '@material-ui/icons/ExitToApp';
 import { parseEntityRef } from '@backstage/catalog-model';
 import { ConfirmationDialog } from '../ConfirmationDialog';

plugins/bazaar/src/components/HomePageBazaarInfoCard/HomePageBazaarInfoCard.tsx

@@ -37,7 +37,7 @@ import {
 import { Member, BazaarProject } from '../../types';
 import { bazaarApiRef } from '../../api';
 import { Alert } from '@material-ui/lab';
-import { useAsyncFn } from 'react-use';
+import useAsyncFn from 'react-use/lib/useAsyncFn';
 import {
   catalogApiRef,
   catalogRouteRef,

plugins/bazaar/src/components/SortView/SortView.tsx

@@ -19,7 +19,7 @@ import { Content, SupportButton } from '@backstage/core-components';
 import { AddProjectDialog } from '../AddProjectDialog';
 import { ProjectPreview } from '../ProjectPreview/ProjectPreview';
 import { Button, makeStyles } from '@material-ui/core';
-import { useAsyncFn } from 'react-use';
+import useAsyncFn from 'react-use/lib/useAsyncFn';
 import { Entity, stringifyEntityRef } from '@backstage/catalog-model';
 import { useApi } from '@backstage/core-plugin-api';
 import { catalogApiRef } from '@backstage/plugin-catalog-react';

plugins/bitrise/src/components/useBitriseArtifactDetails.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { BitriseBuildArtifactDetails } from '../api/bitriseApi.model';
 import { bitriseApiRef } from '../plugin';
 import { useApi } from '@backstage/core-plugin-api';

plugins/bitrise/src/components/useBitriseArtifacts.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { BitriseBuildArtifact } from '../api/bitriseApi.model';
 import { bitriseApiRef } from '../plugin';
 import { useApi } from '@backstage/core-plugin-api';

plugins/bitrise/src/hooks/useBitriseBuildWorkflows.ts

@@ -14,9 +14,8 @@
  * limitations under the License.
  */
 
-import { useAsync } from 'react-use';
+import useAsync, { AsyncState } from 'react-use/lib/useAsync';
 import { bitriseApiRef } from '../plugin';
-import { AsyncState } from 'react-use/lib/useAsync';
 import { BitriseApp } from '../api/bitriseApi.model';
 import { useApi } from '@backstage/core-plugin-api';
 

plugins/bitrise/src/hooks/useBitriseBuilds.ts

@@ -14,14 +14,13 @@
  * limitations under the License.
  */
 
-import { useAsync } from 'react-use';
+import useAsync, { AsyncState } from 'react-use/lib/useAsync';
 import {
   BitriseApp,
   BitriseBuildListResponse,
   BitriseQueryParams,
 } from '../api/bitriseApi.model';
 import { bitriseApiRef } from '../plugin';
-import { AsyncState } from 'react-use/lib/useAsync';
 import { useApi } from '@backstage/core-plugin-api';
 
 export const useBitriseBuilds = (

plugins/catalog-graph/src/components/CatalogGraphPage/useCatalogGraphPage.ts

@@ -28,7 +28,7 @@ import {
   useState,
 } from 'react';
 import { useLocation } from 'react-router';
-import { usePrevious } from 'react-use';
+import usePrevious from 'react-use/lib/usePrevious';
 import { Direction } from '../EntityRelationsGraph';
 
 export type CatalogGraphPageValue = {

plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityRelationNodesAndEdges.ts

@@ -18,7 +18,7 @@ import {
   stringifyEntityRef,
 } from '@backstage/catalog-model';
 import { MouseEvent, useState } from 'react';
-import { useDebounce } from 'react-use';
+import useDebounce from 'react-use/lib/useDebounce';
 import { RelationPairs, ALL_RELATION_PAIRS } from './relations';
 import { EntityEdge, EntityNode } from './types';
 import { useEntityRelationGraph } from './useEntityRelationGraph';

plugins/catalog-graph/src/components/EntityRelationsGraph/useEntityStore.ts

@@ -18,7 +18,7 @@ import { useApi } from '@backstage/core-plugin-api';
 import { catalogApiRef } from '@backstage/plugin-catalog-react';
 import limiterFactory from 'p-limit';
 import { Dispatch, useCallback, useRef, useState } from 'react';
-import { useAsyncFn } from 'react-use';
+import useAsyncFn from 'react-use/lib/useAsyncFn';
 
 // TODO: This is a good use case for a graphql API, once it is available in the
 // future.

plugins/catalog-import/src/components/StepPrepareCreatePullRequest/StepPrepareCreatePullRequest.tsx

@@ -25,7 +25,7 @@ import { Box, FormHelperText, Grid, Typography } from '@material-ui/core';
 import { makeStyles } from '@material-ui/core/styles';
 import React, { useCallback, useEffect, useState } from 'react';
 import { UnpackNestedValue, UseFormReturn } from 'react-hook-form';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import YAML from 'yaml';
 import { AnalyzeResult, catalogImportApiRef } from '../../api';
 import { PartialEntity } from '../../types';

plugins/catalog-react/src/components/EntitySearchBar/EntitySearchBar.tsx

@@ -25,7 +25,7 @@ import {
 import Clear from '@material-ui/icons/Clear';
 import Search from '@material-ui/icons/Search';
 import React, { useState } from 'react';
-import { useDebounce } from 'react-use';
+import useDebounce from 'react-use/lib/useDebounce';
 import { useEntityListProvider } from '../../hooks/useEntityListProvider';
 import { EntityTextFilter } from '../../filters';
 

plugins/catalog-react/src/components/UnregisterEntityDialog/useUnregisterEntityDialogState.ts

@@ -22,7 +22,7 @@ import {
 } from '@backstage/catalog-model';
 import { catalogApiRef } from '../../api';
 import { useCallback } from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { useApi } from '@backstage/core-plugin-api';
 
 /**

plugins/catalog-react/src/hooks/useEntity.tsx

@@ -28,7 +28,7 @@ import React, {
   Context,
 } from 'react';
 import { useNavigate } from 'react-router';
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { catalogApiRef } from '../api';
 import { useEntityCompoundName } from './useEntityCompoundName';
 

plugins/catalog-react/src/hooks/useEntityKinds.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { useApi } from '@backstage/core-plugin-api';
 import { catalogApiRef } from '../api';
 

plugins/catalog-react/src/hooks/useEntityListProvider.tsx

@@ -25,7 +25,9 @@ import React, {
   useMemo,
   useState,
 } from 'react';
-import { useAsyncFn, useDebounce, useMountedState } from 'react-use';
+import useAsyncFn from 'react-use/lib/useAsyncFn';
+import useDebounce from 'react-use/lib/useDebounce';
+import useMountedState from 'react-use/lib/useMountedState';
 import { catalogApiRef } from '../api';
 import {
   EntityKindFilter,

plugins/catalog-react/src/hooks/useEntityOwnership.ts

@@ -30,7 +30,7 @@ import {
 } from '@backstage/core-plugin-api';
 import jwtDecoder from 'jwt-decode';
 import { useMemo } from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { catalogApiRef } from '../api';
 import { getEntityRelations } from '../utils/getEntityRelations';
 

plugins/catalog-react/src/hooks/useEntityTypeFilter.tsx

@@ -15,7 +15,7 @@
  */
 
 import { useEffect, useMemo, useRef, useState } from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import isEqual from 'lodash/isEqual';
 import { useApi } from '@backstage/core-plugin-api';
 import { catalogApiRef } from '../api';

plugins/catalog-react/src/hooks/useOwnUser.ts

@@ -15,8 +15,7 @@
  */
 
 import { UserEntity } from '@backstage/catalog-model';
-import { useAsync } from 'react-use';
-import { AsyncState } from 'react-use/lib/useAsync';
+import useAsync, { AsyncState } from 'react-use/lib/useAsync';
 import { catalogApiRef } from '../api';
 import { identityApiRef, useApi } from '@backstage/core-plugin-api';
 

plugins/catalog-react/src/hooks/useOwnedEntities.ts

@@ -21,7 +21,7 @@ import {
 import { identityApiRef, useApi } from '@backstage/core-plugin-api';
 import { Entity, RELATION_OWNED_BY } from '@backstage/catalog-model';
 import { CatalogListResponse } from '@backstage/catalog-client';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { useMemo } from 'react';
 
 /**

plugins/catalog-react/src/hooks/useRelatedEntities.ts

@@ -16,7 +16,7 @@
 import { Entity, EntityRelation } from '@backstage/catalog-model';
 import { useApi } from '@backstage/core-plugin-api';
 import { chunk, groupBy } from 'lodash';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { catalogApiRef } from '../api';
 
 const BATCH_SIZE = 20;

plugins/catalog-react/src/hooks/useStarredEntities.ts

@@ -21,7 +21,7 @@ import {
 } from '@backstage/catalog-model';
 import { useApi } from '@backstage/core-plugin-api';
 import { useCallback } from 'react';
-import { useObservable } from 'react-use';
+import useObservable from 'react-use/lib/useObservable';
 import { starredEntitiesApiRef } from '../apis';
 
 function getEntityRef(entityOrRef: Entity | EntityName | string): string {

plugins/catalog/src/components/EntityProcessingErrorsPanel/EntityProcessingErrorsPanel.tsx

@@ -33,7 +33,7 @@ import {
   ENTITY_STATUS_CATALOG_PROCESSING_TYPE,
 } from '@backstage/catalog-client';
 import { useApi, ApiHolder } from '@backstage/core-plugin-api';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { SerializedError } from '@backstage/errors';
 
 const errorFilter = (i: UNSTABLE_EntityStatusItem) =>

plugins/catalog/src/components/EntitySwitch/EntitySwitch.tsx

@@ -23,7 +23,7 @@ import {
   useElementFilter,
   ApiHolder,
 } from '@backstage/core-plugin-api';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 
 const ENTITY_SWITCH_KEY = 'core.backstage.entitySwitch';
 

plugins/catalog/src/components/SystemDiagramCard/SystemDiagramCard.tsx

@@ -32,7 +32,7 @@ import {
 import { Box, makeStyles, Typography, useTheme } from '@material-ui/core';
 import ZoomOutMap from '@material-ui/icons/ZoomOutMap';
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { BackstageTheme } from '@backstage/theme';
 
 import {

plugins/circleci/src/state/useBuildWithSteps.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import { useCallback, useMemo } from 'react';
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { circleCIApiRef } from '../api';
 import { useAsyncPolling } from './useAsyncPolling';
 import { useProjectSlugFromEntity, mapVcsType } from './useBuilds';

plugins/circleci/src/state/useBuilds.ts

@@ -18,7 +18,7 @@ import { useEntity } from '@backstage/plugin-catalog-react';
 import { BuildSummary, GitType } from 'circleci-api';
 import { getOr } from 'lodash/fp';
 import { useCallback, useEffect, useState } from 'react';
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { circleCIApiRef } from '../api';
 import type { CITableBuildInfo } from '../components/BuildsPage/lib/CITable';
 import { CIRCLECI_ANNOTATION } from '../constants';

plugins/cloudbuild/src/components/WorkflowRunDetails/useWorkflowRunJobs.ts

@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { ActionsListWorkflowRunsForRepoResponseData } from '../../api/types';
 
 export const useWorkflowRunJobs = (jobsUrl?: string) => {

plugins/cloudbuild/src/components/WorkflowRunDetails/useWorkflowRunsDetails.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import { useParams } from 'react-router-dom';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { cloudbuildApiRef } from '../../api';
 import { useApi } from '@backstage/core-plugin-api';
 

plugins/cloudbuild/src/components/useProjectName.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { Entity } from '@backstage/catalog-model';
 
 export const CLOUDBUILD_ANNOTATION = 'google.com/cloudbuild-project-slug';

plugins/cloudbuild/src/components/useWorkflowRuns.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import { useState } from 'react';
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { cloudbuildApiRef } from '../api/CloudbuildApi';
 import {
   ActionsListWorkflowRunsForRepoResponseData,

plugins/code-coverage/src/components/CoverageHistoryChart/CoverageHistoryChart.tsx

@@ -30,7 +30,7 @@ import TrendingUpIcon from '@material-ui/icons/TrendingUp';
 import { Alert } from '@material-ui/lab';
 import { ClassNameMap } from '@material-ui/styles';
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import {
   CartesianGrid,
   Legend,

plugins/code-coverage/src/components/FileExplorer/FileContent.tsx

@@ -18,7 +18,7 @@ import { useEntity } from '@backstage/plugin-catalog-react';
 import { makeStyles, Paper } from '@material-ui/core';
 import { Alert } from '@material-ui/lab';
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { codeCoverageApiRef } from '../../api';
 import { FileEntry } from '../../types';
 import { CodeRow } from './CodeRow';

plugins/code-coverage/src/components/FileExplorer/FileExplorer.tsx

@@ -26,7 +26,7 @@ import {
 import DescriptionIcon from '@material-ui/icons/Description';
 import { Alert } from '@material-ui/lab';
 import React, { Fragment, useEffect, useState } from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { codeCoverageApiRef } from '../../api';
 import { FileEntry } from '../../types';
 import { FileContent } from './FileContent';

plugins/config-schema/src/components/ConfigSchemaPage/ConfigSchemaPage.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import React, { useMemo } from 'react';
-import { useObservable } from 'react-use';
+import useObservable from 'react-use/lib/useObservable';
 import { configSchemaApiRef } from '../../api';
 import { SchemaViewer } from '../SchemaViewer';
 import { Typography } from '@material-ui/core';

plugins/cost-insights/src/components/CopyUrlToClipboard/CopyUrlToClipboard.tsx

@@ -16,7 +16,7 @@
 
 import React, { useEffect, useState } from 'react';
 import { useLocation } from 'react-router-dom';
-import { useCopyToClipboard } from 'react-use';
+import useCopyToClipboard from 'react-use/lib/useCopyToClipboard';
 import { Tooltip, IconButton } from '@material-ui/core';
 import AssignmentOutlinedIcon from '@material-ui/icons/AssignmentOutlined';
 import AssignmentTurnedInOutlinedIcon from '@material-ui/icons/AssignmentTurnedInOutlined';

plugins/explore/src/components/DomainExplorerContent/DomainExplorerContent.tsx

@@ -17,7 +17,7 @@ import { DomainEntity } from '@backstage/catalog-model';
 import { catalogApiRef } from '@backstage/plugin-catalog-react';
 import { Button } from '@material-ui/core';
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { DomainCard } from '../DomainCard';
 
 import {

plugins/explore/src/components/GroupsExplorerContent/GroupsDiagram.tsx

@@ -39,7 +39,7 @@ import { makeStyles, Typography, useTheme } from '@material-ui/core';
 import ZoomOutMap from '@material-ui/icons/ZoomOutMap';
 import classNames from 'classnames';
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 
 const useStyles = makeStyles((theme: BackstageTheme) => ({
   graph: {

plugins/explore/src/components/ToolExplorerContent/ToolExplorerContent.tsx

@@ -16,7 +16,7 @@
 
 import { exploreToolsConfigRef } from '@backstage/plugin-explore-react';
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { ToolCard } from '../ToolCard';
 
 import {

plugins/firehydrant/src/components/serviceAnalytics.ts

@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { fireHydrantApiRef } from '../api';
 import { errorApiRef, useApi } from '@backstage/core-plugin-api';
 

plugins/firehydrant/src/components/serviceDetails.ts

@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { fireHydrantApiRef } from '../api';
 import { errorApiRef, useApi } from '@backstage/core-plugin-api';
 

plugins/fossa/src/components/FossaCard/FossaCard.tsx

@@ -19,7 +19,7 @@ import { Grid, Tooltip } from '@material-ui/core';
 import { makeStyles } from '@material-ui/core/styles';
 import { DateTime } from 'luxon';
 import React, { PropsWithChildren } from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { fossaApiRef } from '../../api';
 import {
   FOSSA_PROJECT_NAME_ANNOTATION,

plugins/fossa/src/components/FossaPage/FossaPage.tsx

@@ -31,7 +31,8 @@ import { Skeleton } from '@material-ui/lab';
 import { DateTime } from 'luxon';
 import * as React from 'react';
 import { useMemo, useState } from 'react';
-import { useAsync, useDeepCompareEffect } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
+import useDeepCompareEffect from 'react-use/lib/useDeepCompareEffect';
 import { FindingSummary, fossaApiRef } from '../../api';
 import { getProjectName } from '../getProjectName';
 

plugins/gcp-projects/src/components/ProjectDetailsPage/ProjectDetailsPage.tsx

@@ -27,7 +27,7 @@ import {
   Typography,
 } from '@material-ui/core';
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { gcpApiRef } from '../../api';
 
 import {

plugins/gcp-projects/src/components/ProjectListPage/ProjectListPage.tsx

@@ -18,7 +18,7 @@
 import { Button, LinearProgress, Tooltip, Typography } from '@material-ui/core';
 import React from 'react';
 
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { gcpApiRef, Project } from '../../api';
 
 import {

plugins/git-release-manager/src/GitReleaseManager.tsx

@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { Alert } from '@material-ui/lab';
 import { Box } from '@material-ui/core';
 import { useApi } from '@backstage/core-plugin-api';

plugins/git-release-manager/src/features/CreateReleaseCandidate/hooks/useCreateReleaseCandidate.ts

@@ -15,7 +15,8 @@
  */
 
 import { useEffect, useState } from 'react';
-import { useAsync, useAsyncFn } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
+import useAsyncFn from 'react-use/lib/useAsyncFn';
 import {
   GetLatestReleaseResult,
   GetRepositoryResult,

plugins/git-release-manager/src/features/Patch/PatchBody.tsx

@@ -15,7 +15,7 @@
  */
 
 import React, { useState } from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { Alert, AlertTitle } from '@material-ui/lab';
 import {
   Box,

plugins/git-release-manager/src/features/Patch/hooks/usePatch.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { useEffect, useState } from 'react';
 
 import {

plugins/git-release-manager/src/features/Patch/hooks/usePatchDryRun.tsx

@@ -15,7 +15,8 @@
  */
 
 import { useApi } from '@backstage/core-plugin-api';
-import { useAsync, useAsyncFn } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
+import useAsyncFn from 'react-use/lib/useAsyncFn';
 import React from 'react';
 
 import { CalverTagParts } from '../../../helpers/tagParts/getCalverTagParts';

plugins/git-release-manager/src/features/PromoteRc/hooks/usePromoteRc.ts

@@ -15,7 +15,8 @@
  */
 
 import { useState, useEffect } from 'react';
-import { useAsync, useAsyncFn } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
+import useAsyncFn from 'react-use/lib/useAsyncFn';
 import {
   CardHook,
   ComponentConfig,

plugins/git-release-manager/src/features/RepoDetailsForm/Owner.tsx

@@ -16,7 +16,7 @@
 
 import React from 'react';
 import { useNavigate } from 'react-router';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import {
   FormControl,
   FormHelperText,

plugins/git-release-manager/src/features/RepoDetailsForm/Repo.tsx

@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { useNavigate } from 'react-router';
 import {
   FormControl,

plugins/git-release-manager/src/features/Stats/Info/hooks/useGetReleaseTimes.tsx

@@ -15,7 +15,8 @@
  */
 
 import { useEffect, useState } from 'react';
-import { useAsync, useAsyncFn } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
+import useAsyncFn from 'react-use/lib/useAsyncFn';
 import { DateTime } from 'luxon';
 import { getReleaseCommitPairs } from '../helpers/getReleaseCommitPairs';
 

plugins/git-release-manager/src/features/Stats/Row/RowCollapsed/ReleaseTime.tsx

@@ -15,7 +15,7 @@
  */
 
 import React from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { DateTime } from 'luxon';
 import { Box, Typography } from '@material-ui/core';
 import { Alert } from '@material-ui/lab';

plugins/git-release-manager/src/features/Stats/hooks/useGetStats.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { gitReleaseManagerApiRef } from '../../../api/serviceApiRef';
 
 import { useProjectContext } from '../../../contexts/ProjectContext';

plugins/git-release-manager/src/hooks/useGetGitBatchInfo.ts

@@ -15,7 +15,7 @@
  */
 
 import { useEffect } from 'react';
-import { useAsyncFn } from 'react-use';
+import useAsyncFn from 'react-use/lib/useAsyncFn';
 
 import { GitReleaseApi } from '../api/GitReleaseClient';
 import { Project } from '../contexts/ProjectContext';

plugins/github-actions/src/components/WorkflowRunDetails/useWorkflowRunJobs.ts

@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { githubActionsApiRef } from '../../api';
 import { buildRouteRef } from '../../routes';
 import { useApi, useRouteRefParams } from '@backstage/core-plugin-api';

plugins/github-actions/src/components/WorkflowRunDetails/useWorkflowRunsDetails.ts

@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { githubActionsApiRef } from '../../api';
 import { buildRouteRef } from '../../routes';
 import { useApi, useRouteRefParams } from '@backstage/core-plugin-api';

plugins/github-actions/src/components/WorkflowRunLogs/useDownloadWorkflowRunLogs.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { githubActionsApiRef } from '../../api';
 import { useApi } from '@backstage/core-plugin-api';
 

plugins/github-actions/src/components/useProjectName.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { Entity } from '@backstage/catalog-model';
 
 export const GITHUB_ACTIONS_ANNOTATION = 'github.com/project-slug';

plugins/github-actions/src/components/useWorkflowRuns.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import { useState } from 'react';
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { githubActionsApiRef } from '../api/GithubActionsApi';
 import { useApi, errorApiRef } from '@backstage/core-plugin-api';
 

plugins/github-deployments/src/components/GithubDeploymentsCard.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 import React from 'react';
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { GithubDeployment, githubDeploymentsApiRef } from '../api';
 import { useEntity } from '@backstage/plugin-catalog-react';
 import {

plugins/gitops-profiles/src/components/ClusterList/ClusterList.tsx

@@ -18,7 +18,7 @@ import React, { useState } from 'react';
 
 import ClusterTable from '../ClusterTable/ClusterTable';
 import { Button } from '@material-ui/core';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { gitOpsApiRef } from '../../api';
 import { Alert } from '@material-ui/lab';
 

plugins/gitops-profiles/src/components/ProfileCatalog/ProfileCatalog.tsx

@@ -19,7 +19,7 @@ import { TextField, List, ListItem, Link } from '@material-ui/core';
 
 import ClusterTemplateCardList from '../ClusterTemplateCardList';
 import ProfileCardList from '../ProfileCardList';
-import { useLocalStorage } from 'react-use';
+import useLocalStorage from 'react-use/lib/useLocalStorage';
 import { gitOpsApiRef, Status } from '../../api';
 
 import {

plugins/graphiql/src/components/GraphiQLPage/GraphiQLPage.tsx

@@ -15,7 +15,7 @@
  */
 import React from 'react';
 import { useApi } from '@backstage/core-plugin-api';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import 'graphiql/graphiql.css';
 import { graphQlBrowseApiRef } from '../../lib/api';
 import { GraphiQLBrowser } from '../GraphiQLBrowser';

plugins/home/src/homePageComponents/WelcomeTitle/WelcomeTitle.tsx

@@ -20,7 +20,7 @@ import {
 } from '@backstage/core-plugin-api';
 import { Tooltip } from '@material-ui/core';
 import React, { useEffect, useMemo } from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { getTimeBasedGreeting } from './timeUtil';
 
 export const WelcomeTitle = () => {

plugins/ilert/src/hooks/useAlertSource.ts

@@ -16,7 +16,7 @@
 import React from 'react';
 import { ilertApiRef } from '../api';
 import { AuthenticationError } from '@backstage/errors';
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { AlertSource, UptimeMonitor } from '../types';
 import { useApi, errorApiRef } from '@backstage/core-plugin-api';
 

plugins/ilert/src/hooks/useAlertSourceOnCalls.ts

@@ -16,7 +16,7 @@
 import React from 'react';
 import { ilertApiRef } from '../api';
 import { AuthenticationError } from '@backstage/errors';
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { AlertSource, OnCall } from '../types';
 import { useApi, errorApiRef } from '@backstage/core-plugin-api';
 

plugins/ilert/src/hooks/useAssignIncident.ts

@@ -16,7 +16,7 @@
 import React from 'react';
 import { ilertApiRef } from '../api';
 import { AuthenticationError } from '@backstage/errors';
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { Incident, IncidentResponder } from '../types';
 import { useApi, errorApiRef } from '@backstage/core-plugin-api';
 

plugins/ilert/src/hooks/useIncidentActions.ts

@@ -16,7 +16,7 @@
 import React from 'react';
 import { ilertApiRef } from '../api';
 import { AuthenticationError } from '@backstage/errors';
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import { Incident, IncidentAction } from '../types';
 import { useApi, errorApiRef } from '@backstage/core-plugin-api';
 

plugins/ilert/src/hooks/useIncidents.ts

@@ -16,7 +16,7 @@
 import React from 'react';
 import { GetIncidentsOpts, ilertApiRef, TableState } from '../api';
 import { AuthenticationError } from '@backstage/errors';
-import { useAsyncRetry } from 'react-use';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import {
   ACCEPTED,
   PENDING,