packages,plugins: fix lint issues

plugins/catalog/src/components/ComponentPage/ComponentPage.test.tsx

@@ -18,6 +18,7 @@ import { render } from '@testing-library/react';
 import * as React from 'react';
 import { wrapInTestApp } from '@backstage/test-utils';
 import { ApiProvider, ApiRegistry, errorApiRef } from '@backstage/core';
+import { catalogApiRef, CatalogApi } from '../../api/types';
 
 const getTestProps = (componentName: string) => {
   return {
@@ -39,7 +40,17 @@ describe('ComponentPage', () => {
     const props = getTestProps('');
     await render(
       wrapInTestApp(
-        <ApiProvider apis={ApiRegistry.from([[errorApiRef, errorApi]])}>
+        <ApiProvider
+          apis={ApiRegistry.from([
+            [errorApiRef, errorApi],
+            [
+              catalogApiRef,
+              ({
+                async getEntityByName() {},
+              } as unknown) as CatalogApi,
+            ],
+          ])}
+        >
           <ComponentPage {...props} />
         </ApiProvider>,
       ),

plugins/catalog/src/components/ComponentPage/ComponentPage.tsx

@@ -53,11 +53,6 @@ const ComponentPage: FC<ComponentPageProps> = ({ match, history }) => {
   const componentName = match.params.name;
   const errorApi = useApi<ErrorApi>(errorApiRef);
 
-  if (componentName === '') {
-    history.push('/catalog');
-    return null;
-  }
-
   const catalogApi = useApi(catalogApiRef);
   const catalogRequest = useAsync(() =>
     catalogApi.getEntityByName(match.params.name),
@@ -70,7 +65,12 @@ const ComponentPage: FC<ComponentPageProps> = ({ match, history }) => {
         history.push('/catalog');
       }, REDIRECT_DELAY);
     }
-  }, [catalogRequest.error]);
+  }, [catalogRequest.error, errorApi, history]);
+
+  if (componentName === '') {
+    history.push('/catalog');
+    return null;
+  }
 
   const removeComponent = async () => {
     setConfirmationDialogOpen(false);

plugins/circleci/src/components/Settings/Settings.tsx

@@ -52,7 +52,7 @@ const Settings = () => {
     if (repoFromStore !== repo) {
       setRepo(repoFromStore);
     }
-  }, [ownerFromStore, repoFromStore, tokenFromStore]);
+  }, [ownerFromStore, repoFromStore, tokenFromStore, token, owner, repo]);
 
   const [saved, setSaved] = useState(false);
 

plugins/circleci/src/pages/BuildWithStepsPage/BuildWithStepsPage.tsx

@@ -111,7 +111,7 @@ const BuildWithStepsView: FC<{}> = () => {
   useEffect(() => {
     startPolling();
     return () => stopPolling();
-  }, [buildId, settings]);
+  }, [buildId, settings, startPolling, stopPolling]);
 
   return (
     <>

plugins/circleci/src/state/useBuildWithSteps.ts

@@ -46,7 +46,7 @@ export function useBuildWithSteps(buildId: number) {
       errorApi.post(e);
       return Promise.reject(e);
     }
-  }, [token, owner, repo, buildId]);
+  }, [token, owner, repo, buildId, api, errorApi]);
 
   const restartBuild = async () => {
     try {

plugins/circleci/src/state/useBuilds.ts

@@ -101,7 +101,7 @@ export function useBuilds() {
         return Promise.reject(e);
       }
     },
-    [repo, token, owner],
+    [repo, token, owner, api, errorApi],
   );
 
   const restartBuild = async (buildId: number) => {
@@ -121,7 +121,7 @@ export function useBuilds() {
 
   useEffect(() => {
     getBuilds({ limit: 1, offset: 0 }).then(b => setTotal(b?.[0].build_num!));
-  }, [repo]);
+  }, [repo, getBuilds]);
 
   const { loading, value, retry } = useAsyncRetry(
     () =>

plugins/circleci/src/state/useSettings.ts

@@ -23,27 +23,29 @@ export function useSettings() {
 
   const errorApi = useApi(errorApiRef);
 
-  const rehydrate = () => {
-    try {
-      const stateFromStorage = JSON.parse(sessionStorage.getItem(STORAGE_KEY)!);
-      if (
-        stateFromStorage &&
-        Object.keys(stateFromStorage).some(
-          k => (settings as any)[k] !== stateFromStorage[k],
-        )
-      )
-        dispatch({
-          type: 'setCredentials',
-          payload: stateFromStorage,
-        });
-    } catch (error) {
-      errorApi.post(error);
-    }
-  };
-
   useEffect(() => {
+    const rehydrate = () => {
+      try {
+        const stateFromStorage = JSON.parse(
+          sessionStorage.getItem(STORAGE_KEY)!,
+        );
+        if (
+          stateFromStorage &&
+          Object.keys(stateFromStorage).some(
+            k => (settings as any)[k] !== stateFromStorage[k],
+          )
+        )
+          dispatch({
+            type: 'setCredentials',
+            payload: stateFromStorage,
+          });
+      } catch (error) {
+        errorApi.post(error);
+      }
+    };
+
     rehydrate();
-  }, []);
+  }, [dispatch, errorApi, settings]);
 
   const persist = (state: Settings) => {
     sessionStorage.setItem(STORAGE_KEY, JSON.stringify(state));

plugins/lighthouse/src/components/AuditList/index.tsx

@@ -63,7 +63,7 @@ const AuditList: FC<{}> = () => {
     if (value?.total && value?.limit)
       return Math.ceil(value?.total / value?.limit);
     return 0;
-  }, [value]);
+  }, [value?.total, value?.limit]);
 
   const history = useHistory();
 

plugins/sentry/src/components/SentryPluginWidget/SentryPluginWidget.tsx

@@ -43,7 +43,7 @@ export const SentryPluginWidget: FC<{
     if (error) {
       errorApi.post(error);
     }
-  }, [error]);
+  }, [error, errorApi]);
 
   if (loading) {
     return (

plugins/tech-radar/src/components/RadarComponent.tsx

@@ -21,6 +21,7 @@ import { TechRadarComponentProps, TechRadarLoaderResponse } from '../api';
 import getSampleData from '../sampleData';
 
 const useTechRadarLoader = (props: TechRadarComponentProps) => {
+  const errorApi = useApi<ErrorApi>(errorApiRef);
   const [state, setState] = useState<{
     loading: boolean;
     error?: Error;
@@ -31,38 +32,33 @@ const useTechRadarLoader = (props: TechRadarComponentProps) => {
     data: undefined,
   });
 
+  const { getData } = props;
+
   useEffect(() => {
-    if (!props.getData) {
+    if (!getData) {
       return;
     }
 
-    props
-      .getData()
+    getData()
       .then((payload: TechRadarLoaderResponse) => {
         setState({ loading: false, error: undefined, data: payload });
       })
       .catch((err: Error) => {
+        errorApi.post(err);
         setState({
           loading: false,
           error: err,
           data: undefined,
         });
       });
-  }, []);
+  }, [getData, errorApi]);
 
   return state;
 };
 
-const RadarComponent: FC<TechRadarComponentProps> = (props) => {
-  const errorApi = useApi<ErrorApi>(errorApiRef);
+const RadarComponent: FC<TechRadarComponentProps> = props => {
   const { loading, error, data } = useTechRadarLoader(props);
 
-  useEffect(() => {
-    if (error) {
-      errorApi.post(error);
-    }
-  }, [error && error.message]);
-
   return (
     <>
       {loading && <Progress />}