diff --git a/dynamic-demo-plugin/tsconfig.json b/dynamic-demo-plugin/tsconfig.json
index cf7182c48b9..6ce6cdd6cf5 100644
--- a/dynamic-demo-plugin/tsconfig.json
+++ b/dynamic-demo-plugin/tsconfig.json
@@ -4,7 +4,7 @@
     "module": "esnext",
     "moduleResolution": "node",
     "target": "es2021",
-    "jsx": "react",
+    "jsx": "react-jsx",
     "allowJs": true,
     "experimentalDecorators": true,
     "noUnusedLocals": true,
diff --git a/frontend/.eslintrc.js b/frontend/.eslintrc.js
index 863655c5cab..16216620023 100644
--- a/frontend/.eslintrc.js
+++ b/frontend/.eslintrc.js
@@ -66,6 +66,7 @@ module.exports = {
     'prefer-const': ['error', { destructuring: 'all' }],
     'prefer-template': 2,
     radix: 2,
+    'react/react-in-jsx-scope': 'off', // React 17 doesn't require this anymore
     'react/jsx-fragments': 'error',
     'react/jsx-no-duplicate-props': 2,
     'react/jsx-uses-react': 'error',
diff --git a/frontend/__tests__/components/cluster-settings/basicauth-idp-form.spec.tsx b/frontend/__tests__/components/cluster-settings/basicauth-idp-form.spec.tsx
index f2d4d77acb7..426b024294b 100644
--- a/frontend/__tests__/components/cluster-settings/basicauth-idp-form.spec.tsx
+++ b/frontend/__tests__/components/cluster-settings/basicauth-idp-form.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom-v5-compat';
diff --git a/frontend/__tests__/components/cluster-settings/github-idp-form.spec.tsx b/frontend/__tests__/components/cluster-settings/github-idp-form.spec.tsx
index c40e595cb60..f1b678a191e 100644
--- a/frontend/__tests__/components/cluster-settings/github-idp-form.spec.tsx
+++ b/frontend/__tests__/components/cluster-settings/github-idp-form.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom-v5-compat';
diff --git a/frontend/__tests__/components/cluster-settings/gitlab-idp-form.spec.tsx b/frontend/__tests__/components/cluster-settings/gitlab-idp-form.spec.tsx
index 9ce66782cd2..db9072cedc0 100644
--- a/frontend/__tests__/components/cluster-settings/gitlab-idp-form.spec.tsx
+++ b/frontend/__tests__/components/cluster-settings/gitlab-idp-form.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom-v5-compat';
diff --git a/frontend/__tests__/components/cluster-settings/google-idp-form.spec.tsx b/frontend/__tests__/components/cluster-settings/google-idp-form.spec.tsx
index 015d9c3c06e..899d16ac710 100644
--- a/frontend/__tests__/components/cluster-settings/google-idp-form.spec.tsx
+++ b/frontend/__tests__/components/cluster-settings/google-idp-form.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom-v5-compat';
diff --git a/frontend/__tests__/components/cluster-settings/htpasswd-idp-form.spec.tsx b/frontend/__tests__/components/cluster-settings/htpasswd-idp-form.spec.tsx
index 927c865cf96..15303725783 100644
--- a/frontend/__tests__/components/cluster-settings/htpasswd-idp-form.spec.tsx
+++ b/frontend/__tests__/components/cluster-settings/htpasswd-idp-form.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom-v5-compat';
diff --git a/frontend/__tests__/components/cluster-settings/keystone-idp-form.spec.tsx b/frontend/__tests__/components/cluster-settings/keystone-idp-form.spec.tsx
index b2e1d01fa80..c80acd5043d 100644
--- a/frontend/__tests__/components/cluster-settings/keystone-idp-form.spec.tsx
+++ b/frontend/__tests__/components/cluster-settings/keystone-idp-form.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom-v5-compat';
diff --git a/frontend/__tests__/components/cluster-settings/ldap-idp-form.spec.tsx b/frontend/__tests__/components/cluster-settings/ldap-idp-form.spec.tsx
index 0315b5103d9..b52ef92ffc8 100644
--- a/frontend/__tests__/components/cluster-settings/ldap-idp-form.spec.tsx
+++ b/frontend/__tests__/components/cluster-settings/ldap-idp-form.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom-v5-compat';
diff --git a/frontend/__tests__/components/cluster-settings/openid-idp-form.spec.tsx b/frontend/__tests__/components/cluster-settings/openid-idp-form.spec.tsx
index 8e97274ebc7..de1b5daf514 100644
--- a/frontend/__tests__/components/cluster-settings/openid-idp-form.spec.tsx
+++ b/frontend/__tests__/components/cluster-settings/openid-idp-form.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom-v5-compat';
diff --git a/frontend/__tests__/components/cluster-settings/request-header-idp-form.spec.tsx b/frontend/__tests__/components/cluster-settings/request-header-idp-form.spec.tsx
index a5103a37657..baf671ba8cd 100644
--- a/frontend/__tests__/components/cluster-settings/request-header-idp-form.spec.tsx
+++ b/frontend/__tests__/components/cluster-settings/request-header-idp-form.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom-v5-compat';
diff --git a/frontend/__tests__/components/command-line-tools.spec.tsx b/frontend/__tests__/components/command-line-tools.spec.tsx
index 86d3b9d3097..1385092a88c 100644
--- a/frontend/__tests__/components/command-line-tools.spec.tsx
+++ b/frontend/__tests__/components/command-line-tools.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import store from '@console/internal/redux';
diff --git a/frontend/__tests__/components/container.spec.tsx b/frontend/__tests__/components/container.spec.tsx
index 9bec0389203..541e49ffbf4 100644
--- a/frontend/__tests__/components/container.spec.tsx
+++ b/frontend/__tests__/components/container.spec.tsx
@@ -4,7 +4,6 @@ import {
   ContainerDetailsList,
 } from '../../public/components/container';
 import { mount, ReactWrapper, shallow } from 'enzyme';
-import * as React from 'react';
 import store from '@console/internal/redux';
 import { Provider } from 'react-redux';
 import * as ReactRouter from 'react-router-dom-v5-compat';
diff --git a/frontend/__tests__/components/create-yaml.spec.tsx b/frontend/__tests__/components/create-yaml.spec.tsx
index 95d8f2dbcdf..802568f3694 100644
--- a/frontend/__tests__/components/create-yaml.spec.tsx
+++ b/frontend/__tests__/components/create-yaml.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import { safeLoad, safeDump } from 'js-yaml';
 import * as useExtensionsModule from '@console/plugin-sdk/src/api/useExtensions';
diff --git a/frontend/__tests__/components/environment.spec.tsx b/frontend/__tests__/components/environment.spec.tsx
index 448b4940cd0..19ed475fa38 100644
--- a/frontend/__tests__/components/environment.spec.tsx
+++ b/frontend/__tests__/components/environment.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 
 import { t } from '../../__mocks__/i18next';
diff --git a/frontend/__tests__/components/factory/details.spec.tsx b/frontend/__tests__/components/factory/details.spec.tsx
index ebb59c7432b..3f57d593368 100644
--- a/frontend/__tests__/components/factory/details.spec.tsx
+++ b/frontend/__tests__/components/factory/details.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Provider } from 'react-redux';
 import * as Router from 'react-router-dom-v5-compat';
 import { mount, ReactWrapper } from 'enzyme';
diff --git a/frontend/__tests__/components/graphs/area.spec.tsx b/frontend/__tests__/components/graphs/area.spec.tsx
index 927d30c91a1..2a8821204b5 100644
--- a/frontend/__tests__/components/graphs/area.spec.tsx
+++ b/frontend/__tests__/components/graphs/area.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { Chart, ChartArea, ChartAxis } from '@patternfly/react-charts/victory';
 
diff --git a/frontend/__tests__/components/graphs/bar.spec.tsx b/frontend/__tests__/components/graphs/bar.spec.tsx
index cf455a1a00f..561f5291e20 100644
--- a/frontend/__tests__/components/graphs/bar.spec.tsx
+++ b/frontend/__tests__/components/graphs/bar.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { ChartBar } from '@patternfly/react-charts/victory';
 
diff --git a/frontend/__tests__/components/graphs/gauge.spec.tsx b/frontend/__tests__/components/graphs/gauge.spec.tsx
index b15cae31885..cca6e1ff722 100644
--- a/frontend/__tests__/components/graphs/gauge.spec.tsx
+++ b/frontend/__tests__/components/graphs/gauge.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { ChartDonutThreshold, ChartDonutUtilization } from '@patternfly/react-charts/victory';
 
diff --git a/frontend/__tests__/components/graphs/graph-empty.spec.tsx b/frontend/__tests__/components/graphs/graph-empty.spec.tsx
index 24910cfa229..6f6350ad602 100644
--- a/frontend/__tests__/components/graphs/graph-empty.spec.tsx
+++ b/frontend/__tests__/components/graphs/graph-empty.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 
 import { GraphEmpty } from '@console/internal/components/graphs/graph-empty';
diff --git a/frontend/__tests__/components/graphs/prometheus-graph.spec.tsx b/frontend/__tests__/components/graphs/prometheus-graph.spec.tsx
index a3df81c1489..4d9aefdb782 100644
--- a/frontend/__tests__/components/graphs/prometheus-graph.spec.tsx
+++ b/frontend/__tests__/components/graphs/prometheus-graph.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Provider } from 'react-redux';
 import { Link, BrowserRouter } from 'react-router-dom-v5-compat';
 import { mount, shallow } from 'enzyme';
diff --git a/frontend/__tests__/components/import-yaml-results.spec.tsx b/frontend/__tests__/components/import-yaml-results.spec.tsx
index 90716a1ab96..c36e469eeac 100644
--- a/frontend/__tests__/components/import-yaml-results.spec.tsx
+++ b/frontend/__tests__/components/import-yaml-results.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import { Spinner } from '@patternfly/react-core';
 import { Tr } from '@patternfly/react-table';
diff --git a/frontend/__tests__/components/limitrange.spec.tsx b/frontend/__tests__/components/limitrange.spec.tsx
index b507f4913dd..1c8dd64e7b5 100644
--- a/frontend/__tests__/components/limitrange.spec.tsx
+++ b/frontend/__tests__/components/limitrange.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import {
   LimitRangeDetailsRowProps,
diff --git a/frontend/__tests__/components/modals/column-management-modal.spec.tsx b/frontend/__tests__/components/modals/column-management-modal.spec.tsx
index cd72229ad4b..80027966900 100644
--- a/frontend/__tests__/components/modals/column-management-modal.spec.tsx
+++ b/frontend/__tests__/components/modals/column-management-modal.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Provider } from 'react-redux';
 import { mount } from 'enzyme';
 import { Alert, DataList, DataListCheck } from '@patternfly/react-core';
diff --git a/frontend/__tests__/components/modals/configure-update-strategy-modal.spec.tsx b/frontend/__tests__/components/modals/configure-update-strategy-modal.spec.tsx
index f924525c32f..f3352907193 100644
--- a/frontend/__tests__/components/modals/configure-update-strategy-modal.spec.tsx
+++ b/frontend/__tests__/components/modals/configure-update-strategy-modal.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import Spy = jasmine.Spy;
 
diff --git a/frontend/__tests__/components/namespace.spec.tsx b/frontend/__tests__/components/namespace.spec.tsx
index ab035905312..6df744f49d6 100644
--- a/frontend/__tests__/components/namespace.spec.tsx
+++ b/frontend/__tests__/components/namespace.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount, ReactWrapper } from 'enzyme';
 import Spy = jasmine.Spy;
 
diff --git a/frontend/__tests__/components/pod.spec.tsx b/frontend/__tests__/components/pod.spec.tsx
index 09b0717fdf7..0fd1e67ee71 100644
--- a/frontend/__tests__/components/pod.spec.tsx
+++ b/frontend/__tests__/components/pod.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Provider } from 'react-redux';
 import { shallow, ShallowWrapper, mount, ReactWrapper } from 'enzyme';
 import store from '@console/internal/redux';
diff --git a/frontend/__tests__/components/resource-quota.spec.tsx b/frontend/__tests__/components/resource-quota.spec.tsx
index 0b3920c0139..7830b5442a6 100644
--- a/frontend/__tests__/components/resource-quota.spec.tsx
+++ b/frontend/__tests__/components/resource-quota.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import {
   UsageIcon,
diff --git a/frontend/__tests__/components/route-pages.spec.tsx b/frontend/__tests__/components/route-pages.spec.tsx
index 358443337c1..21dff275012 100644
--- a/frontend/__tests__/components/route-pages.spec.tsx
+++ b/frontend/__tests__/components/route-pages.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, mount } from 'enzyme';
 
 import { RouteLinkAndCopy, RouteLocation, RouteStatus } from '../../public/components/routes';
diff --git a/frontend/__tests__/components/routes/create-route.spec.tsx b/frontend/__tests__/components/routes/create-route.spec.tsx
index abc6fcb8d2a..5c13c919712 100644
--- a/frontend/__tests__/components/routes/create-route.spec.tsx
+++ b/frontend/__tests__/components/routes/create-route.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import { Formik } from 'formik';
 import { Button } from '@patternfly/react-core';
diff --git a/frontend/__tests__/components/safety-first.spec.tsx b/frontend/__tests__/components/safety-first.spec.tsx
index 5c46c2d20b6..5e27303fa47 100644
--- a/frontend/__tests__/components/safety-first.spec.tsx
+++ b/frontend/__tests__/components/safety-first.spec.tsx
@@ -5,6 +5,7 @@ import { mount, ReactWrapper } from 'enzyme';
 import Spy = jasmine.Spy;
 
 import { useSafetyFirst } from '@console/dynamic-plugin-sdk';
+import { waitFor } from '@testing-library/react';
 
 type Props = {
   loader: () => Promise<any>;
@@ -76,16 +77,16 @@ describe('useSafetyFirst', () => {
     wrapper = wrapper.setProps({ loader });
     wrapper.find('button').simulate('click');
 
-    // FIXME(alecmerdler): Shouldn't need a `setTimeout` here...
-    setTimeout(() => {
+    waitFor(() => {
       expect(
         consoleErrorSpy.calls
           .all()
           .map((call) => call.args[0] as string)
           .some((text) => text.includes(warning)),
       ).toBe(false);
-      done();
-    }, 500);
+    });
+
+    done();
   });
 
   it('will set React state if mounted (using hook)', (done) => {
@@ -98,8 +99,7 @@ describe('useSafetyFirst', () => {
     wrapper = wrapper.setProps({ loader });
     wrapper.find('button').simulate('click');
 
-    // FIXME(alecmerdler): Shouldn't need a `setTimeout` here...
-    setTimeout(() => {
+    waitFor(() => {
       expect(wrapper.text()).toEqual('Loaded');
       expect(
         consoleErrorSpy.calls
@@ -107,7 +107,8 @@ describe('useSafetyFirst', () => {
           .map((call) => call.args[0] as string)
           .some((text) => text.includes(warning)),
       ).toBe(false);
-      done();
-    }, 500);
+    });
+
+    done();
   });
 });
diff --git a/frontend/__tests__/components/utils/async.spec.tsx b/frontend/__tests__/components/utils/async.spec.tsx
index 879a82aa246..98b5ecb89cf 100644
--- a/frontend/__tests__/components/utils/async.spec.tsx
+++ b/frontend/__tests__/components/utils/async.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount, ReactWrapper } from 'enzyme';
 
 import { AsyncComponent } from '../../../public/components/utils/async';
diff --git a/frontend/__tests__/components/utils/download-button.spec.tsx b/frontend/__tests__/components/utils/download-button.spec.tsx
index 2d5e6190f72..eb208a3841c 100644
--- a/frontend/__tests__/components/utils/download-button.spec.tsx
+++ b/frontend/__tests__/components/utils/download-button.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount, ReactWrapper } from 'enzyme';
 import Spy = jasmine.Spy;
 import * as fileSaver from 'file-saver';
diff --git a/frontend/__tests__/components/utils/name-value-editor.spec.tsx b/frontend/__tests__/components/utils/name-value-editor.spec.tsx
index bb32d7c8749..b96c7a8158e 100644
--- a/frontend/__tests__/components/utils/name-value-editor.spec.tsx
+++ b/frontend/__tests__/components/utils/name-value-editor.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { NameValueEditor } from '../../../public/components/utils/name-value-editor';
 
diff --git a/frontend/__tests__/components/utils/page-heading.spec.tsx b/frontend/__tests__/components/utils/page-heading.spec.tsx
index 62c893cba87..3c35087f566 100644
--- a/frontend/__tests__/components/utils/page-heading.spec.tsx
+++ b/frontend/__tests__/components/utils/page-heading.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Link } from 'react-router-dom-v5-compat';
 import { shallow, ShallowWrapper } from 'enzyme';
 
diff --git a/frontend/__tests__/components/utils/promise-component.spec.tsx b/frontend/__tests__/components/utils/promise-component.spec.tsx
index e817236f431..bf393266fc3 100644
--- a/frontend/__tests__/components/utils/promise-component.spec.tsx
+++ b/frontend/__tests__/components/utils/promise-component.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 
 import {
diff --git a/frontend/package.json b/frontend/package.json
index 4d224db480c..c11098ea237 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -248,8 +248,8 @@
     "@types/lodash-es": "4.17.x",
     "@types/node": "18.x",
     "@types/prop-types": "15.5.6",
-    "@types/react": "16.8.13",
-    "@types/react-dom": "16.8.4",
+    "@types/react": "17.x",
+    "@types/react-dom": "17.x",
     "@types/react-helmet": "5.x",
     "@types/react-jsonschema-form": "^1.3.8",
     "@types/react-measure": "^2.0.6",
diff --git a/frontend/packages/console-app/src/__tests__/hooks/useCSPViolationDetector.spec.tsx b/frontend/packages/console-app/src/__tests__/hooks/useCSPViolationDetector.spec.tsx
index c0019174228..64ded4d85d0 100644
--- a/frontend/packages/console-app/src/__tests__/hooks/useCSPViolationDetector.spec.tsx
+++ b/frontend/packages/console-app/src/__tests__/hooks/useCSPViolationDetector.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { act, fireEvent, render } from '@testing-library/react';
 import { Provider } from 'react-redux';
 import store from '@console/internal/redux';
diff --git a/frontend/packages/console-app/src/__tests__/network-policies/create-network-policy.spec.tsx b/frontend/packages/console-app/src/__tests__/network-policies/create-network-policy.spec.tsx
index 89c89cfd5ff..2d229997629 100644
--- a/frontend/packages/console-app/src/__tests__/network-policies/create-network-policy.spec.tsx
+++ b/frontend/packages/console-app/src/__tests__/network-policies/create-network-policy.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button, FormFieldGroupExpandable } from '@patternfly/react-core';
 import { mount } from 'enzyme';
 import { ButtonBar } from '@console/internal/components/utils';
diff --git a/frontend/packages/console-app/src/__tests__/network-policies/network-policy-form.spec.tsx b/frontend/packages/console-app/src/__tests__/network-policies/network-policy-form.spec.tsx
index 8e4d0ca58da..7e25666b0fa 100644
--- a/frontend/packages/console-app/src/__tests__/network-policies/network-policy-form.spec.tsx
+++ b/frontend/packages/console-app/src/__tests__/network-policies/network-policy-form.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Alert, FormFieldGroupExpandable } from '@patternfly/react-core';
 import { mount } from 'enzyme';
 import { useK8sGet } from '@console/internal/components/utils/k8s-get-hook';
diff --git a/frontend/packages/console-app/src/__tests__/network-policies/network-policy-peer-ipblock.spec.tsx b/frontend/packages/console-app/src/__tests__/network-policies/network-policy-peer-ipblock.spec.tsx
index 3b5279f72ec..15f8c10468a 100644
--- a/frontend/packages/console-app/src/__tests__/network-policies/network-policy-peer-ipblock.spec.tsx
+++ b/frontend/packages/console-app/src/__tests__/network-policies/network-policy-peer-ipblock.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button } from '@patternfly/react-core';
 import { mount } from 'enzyme';
 import { useK8sGet } from '@console/internal/components/utils/k8s-get-hook';
diff --git a/frontend/packages/console-app/src/__tests__/network-policies/network-policy-selector-preview.spec.tsx b/frontend/packages/console-app/src/__tests__/network-policies/network-policy-selector-preview.spec.tsx
index 409da69b040..f96728b8d65 100644
--- a/frontend/packages/console-app/src/__tests__/network-policies/network-policy-selector-preview.spec.tsx
+++ b/frontend/packages/console-app/src/__tests__/network-policies/network-policy-selector-preview.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { useK8sWatchResource } from '@console/internal/components/utils/k8s-watch-hook';
 import { NamespaceModel, PodModel } from '@console/internal/models';
diff --git a/frontend/packages/console-app/src/components/detect-perspective/__tests__/DetectPerspective.spec.tsx b/frontend/packages/console-app/src/components/detect-perspective/__tests__/DetectPerspective.spec.tsx
index a2c35c25adb..991c372004a 100644
--- a/frontend/packages/console-app/src/components/detect-perspective/__tests__/DetectPerspective.spec.tsx
+++ b/frontend/packages/console-app/src/components/detect-perspective/__tests__/DetectPerspective.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { useLocation } from 'react-router-dom-v5-compat';
 import { usePerspectives } from '@console/shared/src';
diff --git a/frontend/packages/console-app/src/components/detect-perspective/__tests__/PerspectiveDetector.spec.tsx b/frontend/packages/console-app/src/components/detect-perspective/__tests__/PerspectiveDetector.spec.tsx
index 5e497f4203f..8669fe7e294 100644
--- a/frontend/packages/console-app/src/components/detect-perspective/__tests__/PerspectiveDetector.spec.tsx
+++ b/frontend/packages/console-app/src/components/detect-perspective/__tests__/PerspectiveDetector.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { act } from 'react-dom/test-utils';
 import { Perspective } from '@console/dynamic-plugin-sdk';
diff --git a/frontend/packages/console-app/src/components/guided-tour/__tests__/GuidedTourText.spec.tsx b/frontend/packages/console-app/src/components/guided-tour/__tests__/GuidedTourText.spec.tsx
index 836439bf0c0..70275756e39 100644
--- a/frontend/packages/console-app/src/components/guided-tour/__tests__/GuidedTourText.spec.tsx
+++ b/frontend/packages/console-app/src/components/guided-tour/__tests__/GuidedTourText.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { cleanup, configure, render, screen } from '@testing-library/react';
 import { useK8sWatchResource } from '@console/internal/components/utils/k8s-watch-hook';
 import { FinishTourText } from '../GuidedTourText';
diff --git a/frontend/packages/console-app/src/components/nav/__tests__/PerspectiveNav.spec.tsx b/frontend/packages/console-app/src/components/nav/__tests__/PerspectiveNav.spec.tsx
index e3fdad372c1..a4b1f9b1385 100644
--- a/frontend/packages/console-app/src/components/nav/__tests__/PerspectiveNav.spec.tsx
+++ b/frontend/packages/console-app/src/components/nav/__tests__/PerspectiveNav.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Nav } from '@patternfly/react-core';
 import { shallow, mount } from 'enzyme';
 import { Provider } from 'react-redux';
diff --git a/frontend/packages/console-app/src/components/nav/__tests__/perspective-nav.spec.tsx b/frontend/packages/console-app/src/components/nav/__tests__/perspective-nav.spec.tsx
index e3fdad372c1..a4b1f9b1385 100644
--- a/frontend/packages/console-app/src/components/nav/__tests__/perspective-nav.spec.tsx
+++ b/frontend/packages/console-app/src/components/nav/__tests__/perspective-nav.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Nav } from '@patternfly/react-core';
 import { shallow, mount } from 'enzyme';
 import { Provider } from 'react-redux';
diff --git a/frontend/packages/console-app/src/components/nav/confirmNavUnpinModal.tsx b/frontend/packages/console-app/src/components/nav/confirmNavUnpinModal.tsx
index f29e0d38746..f94e88601d7 100644
--- a/frontend/packages/console-app/src/components/nav/confirmNavUnpinModal.tsx
+++ b/frontend/packages/console-app/src/components/nav/confirmNavUnpinModal.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import i18next from 'i18next';
 import { Trans } from 'react-i18next';
 import { confirmModal } from '@console/internal/components/modals';
diff --git a/frontend/packages/console-app/src/components/resource-quota/AppliedClusterResourceQuotaCharts.tsx b/frontend/packages/console-app/src/components/resource-quota/AppliedClusterResourceQuotaCharts.tsx
index 928be118edb..35467ebb2ec 100644
--- a/frontend/packages/console-app/src/components/resource-quota/AppliedClusterResourceQuotaCharts.tsx
+++ b/frontend/packages/console-app/src/components/resource-quota/AppliedClusterResourceQuotaCharts.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { DonutChart } from '@console/internal/components/graphs/donut';
 import { AppliedClusterResourceQuotaKind } from '@console/internal/module/k8s';
diff --git a/frontend/packages/console-app/src/components/resource-quota/ClusterResourceQuotaCharts.tsx b/frontend/packages/console-app/src/components/resource-quota/ClusterResourceQuotaCharts.tsx
index c800fe6aa84..b1798dbaf27 100644
--- a/frontend/packages/console-app/src/components/resource-quota/ClusterResourceQuotaCharts.tsx
+++ b/frontend/packages/console-app/src/components/resource-quota/ClusterResourceQuotaCharts.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { DonutChart } from '@console/internal/components/graphs/donut';
 import { ClusterResourceQuotaKind } from '@console/internal/module/k8s';
diff --git a/frontend/packages/console-app/src/components/resource-quota/ResourceQuotaCharts.tsx b/frontend/packages/console-app/src/components/resource-quota/ResourceQuotaCharts.tsx
index 2000319f345..cb071c427e7 100644
--- a/frontend/packages/console-app/src/components/resource-quota/ResourceQuotaCharts.tsx
+++ b/frontend/packages/console-app/src/components/resource-quota/ResourceQuotaCharts.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { GaugeChart } from '@console/internal/components/graphs/gauge';
 import { ResourceQuotaKind } from '@console/internal/module/k8s';
diff --git a/frontend/packages/console-app/src/components/tabs/__tests__/Generated/Tabs.test.tsx b/frontend/packages/console-app/src/components/tabs/__tests__/Generated/Tabs.test.tsx
index 9cca522a53e..5819462f9ab 100644
--- a/frontend/packages/console-app/src/components/tabs/__tests__/Generated/Tabs.test.tsx
+++ b/frontend/packages/console-app/src/components/tabs/__tests__/Generated/Tabs.test.tsx
@@ -1,7 +1,6 @@
 /**
  * This test was generated
  */
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { Tabs } from '../../Tabs';
 // any missing imports can usually be resolved by adding them here
diff --git a/frontend/packages/console-app/src/components/tabs/__tests__/Tabs.test.tsx b/frontend/packages/console-app/src/components/tabs/__tests__/Tabs.test.tsx
index 1303e356f9d..cc6e5bba4d9 100644
--- a/frontend/packages/console-app/src/components/tabs/__tests__/Tabs.test.tsx
+++ b/frontend/packages/console-app/src/components/tabs/__tests__/Tabs.test.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Tab, Tabs, TabTitleIcon, TabTitleText } from '@patternfly/react-core';
 import { render } from 'enzyme';
 
diff --git a/frontend/packages/console-app/src/components/tour/__tests__/TourStepComponent.spec.tsx b/frontend/packages/console-app/src/components/tour/__tests__/TourStepComponent.spec.tsx
index d05b09658ee..0144bc1dc05 100644
--- a/frontend/packages/console-app/src/components/tour/__tests__/TourStepComponent.spec.tsx
+++ b/frontend/packages/console-app/src/components/tour/__tests__/TourStepComponent.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { Popover, Modal, Spotlight } from '@console/shared';
 import TourStepComponent from '../TourStepComponent';
diff --git a/frontend/packages/console-app/src/components/user-preferences/__tests__/userPreferences.data.tsx b/frontend/packages/console-app/src/components/user-preferences/__tests__/userPreferences.data.tsx
index a17ac932db7..d97b013eef9 100644
--- a/frontend/packages/console-app/src/components/user-preferences/__tests__/userPreferences.data.tsx
+++ b/frontend/packages/console-app/src/components/user-preferences/__tests__/userPreferences.data.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import {
   ResolvedExtension,
   UserPreferenceFieldType,
diff --git a/frontend/packages/console-app/src/components/user-preferences/namespace/__tests__/NamespaceDropdown.spec.tsx b/frontend/packages/console-app/src/components/user-preferences/namespace/__tests__/NamespaceDropdown.spec.tsx
index ced47ed5e96..cd227d526bd 100644
--- a/frontend/packages/console-app/src/components/user-preferences/namespace/__tests__/NamespaceDropdown.spec.tsx
+++ b/frontend/packages/console-app/src/components/user-preferences/namespace/__tests__/NamespaceDropdown.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount, ReactWrapper } from 'enzyme';
 import { Provider } from 'react-redux';
 import { useProjectOrNamespaceModel } from '@console/internal/components/utils';
diff --git a/frontend/packages/console-app/src/components/user-preferences/perspective/__tests__/PreferredPerspectiveSelect.spec.tsx b/frontend/packages/console-app/src/components/user-preferences/perspective/__tests__/PreferredPerspectiveSelect.spec.tsx
index 7bed672f11d..b6e87d859b1 100644
--- a/frontend/packages/console-app/src/components/user-preferences/perspective/__tests__/PreferredPerspectiveSelect.spec.tsx
+++ b/frontend/packages/console-app/src/components/user-preferences/perspective/__tests__/PreferredPerspectiveSelect.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { render, screen, configure } from '@testing-library/react';
 import { useExtensions } from '@console/plugin-sdk/src';
 import PreferredPerspectiveSelect from '../PreferredPerspectiveSelect';
diff --git a/frontend/packages/console-demo-plugin/src/components/test-icon.tsx b/frontend/packages/console-demo-plugin/src/components/test-icon.tsx
index 97e646f9936..69ef98019e6 100644
--- a/frontend/packages/console-demo-plugin/src/components/test-icon.tsx
+++ b/frontend/packages/console-demo-plugin/src/components/test-icon.tsx
@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 export default () => (
   <svg
     style={{ verticalAlign: '-0.125em' }}
diff --git a/frontend/packages/console-demo-plugin/src/components/test-pages.tsx b/frontend/packages/console-demo-plugin/src/components/test-pages.tsx
index bad240bf197..f1f6838eb06 100644
--- a/frontend/packages/console-demo-plugin/src/components/test-pages.tsx
+++ b/frontend/packages/console-demo-plugin/src/components/test-pages.tsx
@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 export const DummyResourceListPage = () => <h1>Example Resource List Page</h1>;
 export const DummyResourceDetailsPage = () => <h1>Example Resource Details Page</h1>;
 export const DummyHorizontalNavTab = () => <h1>Example Resource Detail View Tab</h1>;
diff --git a/frontend/packages/console-demo-plugin/src/plugin.tsx b/frontend/packages/console-demo-plugin/src/plugin.tsx
index fa6e3b8288f..c5f32ce0cc5 100644
--- a/frontend/packages/console-demo-plugin/src/plugin.tsx
+++ b/frontend/packages/console-demo-plugin/src/plugin.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import * as _ from 'lodash';
 import { GridPosition } from '@console/dynamic-plugin-sdk';
 // TODO(vojtech): internal code needed by plugins should be moved to console-shared package
diff --git a/frontend/packages/console-dynamic-plugin-sdk/docs/api.md b/frontend/packages/console-dynamic-plugin-sdk/docs/api.md
index 74ffaedfc41..6c9b5ad6e93 100644
--- a/frontend/packages/console-dynamic-plugin-sdk/docs/api.md
+++ b/frontend/packages/console-dynamic-plugin-sdk/docs/api.md
@@ -2548,7 +2548,7 @@ The isAllowed boolean value.
 
 ### Returns
 
-An array with a pair of state value and it's set function.
+An array with a pair of state value and its set function.
 
 
 ---
diff --git a/frontend/packages/console-dynamic-plugin-sdk/src/app/__tests__/AppInitSDK.spec.tsx b/frontend/packages/console-dynamic-plugin-sdk/src/app/__tests__/AppInitSDK.spec.tsx
index 52f4d896b22..8f44d1dedbc 100644
--- a/frontend/packages/console-dynamic-plugin-sdk/src/app/__tests__/AppInitSDK.spec.tsx
+++ b/frontend/packages/console-dynamic-plugin-sdk/src/app/__tests__/AppInitSDK.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import configureMockStore from 'redux-mock-store';
diff --git a/frontend/packages/console-dynamic-plugin-sdk/src/app/components/safety-first.tsx b/frontend/packages/console-dynamic-plugin-sdk/src/app/components/safety-first.tsx
index 2ed43f032d2..c8a082998de 100644
--- a/frontend/packages/console-dynamic-plugin-sdk/src/app/components/safety-first.tsx
+++ b/frontend/packages/console-dynamic-plugin-sdk/src/app/components/safety-first.tsx
@@ -5,13 +5,17 @@ import * as React from 'react';
  * Hook that ensures a safe asynchronnous setting of the React state in case a given component could be unmounted.
  * (https://github.com/facebook/react/issues/14113)
  * @param initialState initial state value
- * @returns An array with a pair of state value and it's set function.
+ * @returns An array with a pair of state value and its set function.
  */
 export const useSafetyFirst = <S extends any>(
   initialState: S | (() => S),
 ): [S, React.Dispatch<React.SetStateAction<S>>] => {
   const mounted = React.useRef(true);
-  React.useEffect(() => () => (mounted.current = false), []);
+  React.useEffect(() => {
+    return () => {
+      mounted.current = false;
+    };
+  }, []);
 
   const [value, setValue] = React.useState(initialState);
   const setValueSafe = React.useCallback((newValue: S) => {
diff --git a/frontend/packages/console-dynamic-plugin-sdk/src/utils/k8s/hooks/__tests__/useK8sWatchResource.spec.tsx b/frontend/packages/console-dynamic-plugin-sdk/src/utils/k8s/hooks/__tests__/useK8sWatchResource.spec.tsx
index 9bcd7cbcc11..59be24c3d1e 100644
--- a/frontend/packages/console-dynamic-plugin-sdk/src/utils/k8s/hooks/__tests__/useK8sWatchResource.spec.tsx
+++ b/frontend/packages/console-dynamic-plugin-sdk/src/utils/k8s/hooks/__tests__/useK8sWatchResource.spec.tsx
@@ -68,7 +68,9 @@ beforeEach(() => {
 
 afterEach(async () => {
   // Ensure that there is no timer left which triggers a rerendering
-  await act(async () => jest.runAllTimers());
+  await act(async () => {
+    jest.runAllTimers();
+  });
 
   cleanup();
 
@@ -137,7 +139,9 @@ describe('useK8sWatchResource', () => {
     expect(k8sListMock.mock.calls[0]).toEqual([PodModel, { limit: 250 }, true, {}]);
     k8sListMock.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sWatchMock).toHaveBeenCalledTimes(1);
@@ -177,7 +181,9 @@ describe('useK8sWatchResource', () => {
     expect(k8sGetMock.mock.calls[0]).toEqual([PodModel, 'my-pod', 'foo', {}, {}]);
     k8sGetMock.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sWatchMock).toHaveBeenCalledTimes(1);
@@ -211,7 +217,9 @@ describe('useK8sWatchResource', () => {
     expect(resourceUpdate.mock.calls[0]).toEqual([[], false, undefined]);
     expect(resourceUpdate.mock.calls[1]).toEqual([[], false, '']);
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sListMock).toHaveBeenCalledTimes(1);
@@ -241,7 +249,9 @@ describe('useK8sWatchResource', () => {
     expect(resourceUpdate.mock.calls[0]).toEqual([{}, false, undefined]);
     expect(resourceUpdate.mock.calls[1]).toEqual([null, false, '']);
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sGetMock).toHaveBeenCalledTimes(1);
@@ -315,14 +325,18 @@ describe('useK8sWatchResource', () => {
     expect(resourceUpdate.mock.calls[3]).toEqual([[], false, '']);
     resourceUpdate.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sListMock).toHaveBeenCalledTimes(1);
     expect(k8sListMock.mock.calls[0]).toEqual([PodModel, { limit: 250 }, true, {}]);
     k8sListMock.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sWatchMock).toHaveBeenCalledTimes(1);
@@ -367,14 +381,18 @@ describe('useK8sWatchResource', () => {
     expect(resourceUpdate.mock.calls[3]).toEqual([null, false, '']);
     resourceUpdate.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sGetMock).toHaveBeenCalledTimes(1);
     expect(k8sGetMock.mock.calls[0]).toEqual([PodModel, 'my-pod', 'foo', {}, {}]);
     k8sGetMock.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sWatchMock).toHaveBeenCalledTimes(1);
diff --git a/frontend/packages/console-dynamic-plugin-sdk/src/utils/k8s/hooks/__tests__/useK8sWatchResources.spec.tsx b/frontend/packages/console-dynamic-plugin-sdk/src/utils/k8s/hooks/__tests__/useK8sWatchResources.spec.tsx
index 94bbb6c7ffe..9dee4737ea9 100644
--- a/frontend/packages/console-dynamic-plugin-sdk/src/utils/k8s/hooks/__tests__/useK8sWatchResources.spec.tsx
+++ b/frontend/packages/console-dynamic-plugin-sdk/src/utils/k8s/hooks/__tests__/useK8sWatchResources.spec.tsx
@@ -68,7 +68,9 @@ beforeEach(() => {
 
 afterEach(async () => {
   // Ensure that there is no timer left which triggers a rerendering
-  await act(async () => jest.runAllTimers());
+  await act(async () => {
+    jest.runAllTimers();
+  });
 
   cleanup();
 
@@ -143,7 +145,9 @@ describe('useK8sWatchResource', () => {
     expect(k8sListMock.mock.calls[0]).toEqual([PodModel, { limit: 250 }, true, {}]);
     k8sListMock.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sWatchMock).toHaveBeenCalledTimes(1);
@@ -209,7 +213,9 @@ describe('useK8sWatchResource', () => {
     expect(k8sGetMock.mock.calls[0]).toEqual([PodModel, 'my-pod', 'my-namespace', {}, {}]);
     k8sGetMock.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sWatchMock).toHaveBeenCalledTimes(1);
@@ -261,7 +267,9 @@ describe('useK8sWatchResource', () => {
       },
     ]);
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sListMock).toHaveBeenCalledTimes(1);
@@ -317,13 +325,19 @@ describe('useK8sWatchResource', () => {
       },
     ]);
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sGetMock).toHaveBeenCalledTimes(1);
     expect(k8sGetMock.mock.calls[0]).toEqual([PodModel, 'my-pod', 'my-namespace', {}, {}]);
     k8sGetMock.mockClear();
 
+    await act(async () => {
+      jest.runAllTimers();
+    });
+
     // TODO: Unexpected watch call! The watch call was not triggered when watching a list
     expect(k8sWatchMock).toHaveBeenCalledTimes(1);
     expect(k8sWatchMock.mock.calls[0]).toEqual([
@@ -333,6 +347,10 @@ describe('useK8sWatchResource', () => {
     ]);
     k8sWatchMock.mockClear();
 
+    await act(async () => {
+      jest.runAllTimers();
+    });
+
     expect(resourceUpdate.mock.calls[2]).toEqual([
       {
         pod: {
@@ -429,14 +447,18 @@ describe('useK8sWatchResource', () => {
     ]);
     resourceUpdate.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sListMock).toHaveBeenCalledTimes(1);
     expect(k8sListMock.mock.calls[0]).toEqual([PodModel, { limit: 250 }, true, {}]);
     k8sListMock.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sWatchMock).toHaveBeenCalledTimes(1);
@@ -531,14 +553,18 @@ describe('useK8sWatchResource', () => {
     ]);
     resourceUpdate.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sGetMock).toHaveBeenCalledTimes(1);
     expect(k8sGetMock.mock.calls[0]).toEqual([PodModel, 'my-pod', 'my-namespace', {}, {}]);
     k8sGetMock.mockClear();
 
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert API calls
     expect(k8sWatchMock).toHaveBeenCalledTimes(1);
diff --git a/frontend/packages/console-dynamic-plugin-sdk/tsconfig-base.json b/frontend/packages/console-dynamic-plugin-sdk/tsconfig-base.json
index fd9d068a1dd..d2effb9a41e 100644
--- a/frontend/packages/console-dynamic-plugin-sdk/tsconfig-base.json
+++ b/frontend/packages/console-dynamic-plugin-sdk/tsconfig-base.json
@@ -3,7 +3,7 @@
     "target": "es2021",
     "module": "esnext",
     "moduleResolution": "node",
-    "jsx": "react",
+    "jsx": "react-jsx",
     "allowJs": true,
     "noEmitOnError": true,
     "declaration": true,
diff --git a/frontend/packages/console-plugin-shared/tsconfig.json b/frontend/packages/console-plugin-shared/tsconfig.json
index 240c2469110..460b449b3d4 100644
--- a/frontend/packages/console-plugin-shared/tsconfig.json
+++ b/frontend/packages/console-plugin-shared/tsconfig.json
@@ -5,7 +5,7 @@
     "module": "esnext",
     "moduleResolution": "node",
     "sourceMap": true,
-    "jsx": "react",
+    "jsx": "react-jsx",
     "allowJs": true,
     "noEmitOnError": true,
     "declaration": true,
diff --git a/frontend/packages/console-shared/src/components/actions/menu/ActionMenuItem.tsx b/frontend/packages/console-shared/src/components/actions/menu/ActionMenuItem.tsx
index c7c47fe5277..3e7189bfa10 100644
--- a/frontend/packages/console-shared/src/components/actions/menu/ActionMenuItem.tsx
+++ b/frontend/packages/console-shared/src/components/actions/menu/ActionMenuItem.tsx
@@ -61,7 +61,7 @@ const ActionItem: React.FC<ActionMenuItemProps & { isAllowed: boolean }> = ({
     className: classes,
     onClick: handleClick,
     'data-test-action': label,
-    translate: 'no',
+    translate: 'no' as 'no',
   };
 
   const extraProps = {
diff --git a/frontend/packages/console-shared/src/components/catalog/__tests__/CatalogDetailsPanel.spec.tsx b/frontend/packages/console-shared/src/components/catalog/__tests__/CatalogDetailsPanel.spec.tsx
index 9bdbf5509d6..f20d50c10bc 100644
--- a/frontend/packages/console-shared/src/components/catalog/__tests__/CatalogDetailsPanel.spec.tsx
+++ b/frontend/packages/console-shared/src/components/catalog/__tests__/CatalogDetailsPanel.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import CatalogDetailsPanel from '../details/CatalogDetailsPanel';
 import { eventSourceCatalogItems } from './catalog-item-data';
diff --git a/frontend/packages/console-shared/src/components/dashboard/resource-quota-card/QuotaSummary.tsx b/frontend/packages/console-shared/src/components/dashboard/resource-quota-card/QuotaSummary.tsx
index ad84703c0b4..0a9ee80ffd5 100644
--- a/frontend/packages/console-shared/src/components/dashboard/resource-quota-card/QuotaSummary.tsx
+++ b/frontend/packages/console-shared/src/components/dashboard/resource-quota-card/QuotaSummary.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { getUsedPercentage } from '@console/app/src/components/resource-quota/utils';
 import { YellowExclamationTriangleIcon } from '../../status';
diff --git a/frontend/packages/console-shared/src/components/drawer/__tests__/DraggableCoreIFrameFix.spec.tsx b/frontend/packages/console-shared/src/components/drawer/__tests__/DraggableCoreIFrameFix.spec.tsx
index b01ff8e76a4..e892d881d36 100644
--- a/frontend/packages/console-shared/src/components/drawer/__tests__/DraggableCoreIFrameFix.spec.tsx
+++ b/frontend/packages/console-shared/src/components/drawer/__tests__/DraggableCoreIFrameFix.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { DraggableCore, DraggableEvent, DraggableData } from 'react-draggable';
 import DraggableCoreIFrameFix from '../DraggableCoreIFrameFix';
diff --git a/frontend/packages/console-shared/src/components/drawer/__tests__/Drawer.spec.tsx b/frontend/packages/console-shared/src/components/drawer/__tests__/Drawer.spec.tsx
index 3c0892df2b9..43e8440accd 100644
--- a/frontend/packages/console-shared/src/components/drawer/__tests__/Drawer.spec.tsx
+++ b/frontend/packages/console-shared/src/components/drawer/__tests__/Drawer.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { DraggableData } from 'react-draggable';
 import DraggableCoreIFrameFix from '../DraggableCoreIFrameFix';
diff --git a/frontend/packages/console-shared/src/components/dropdown/__tests__/ResourceDropdown.spec.tsx b/frontend/packages/console-shared/src/components/dropdown/__tests__/ResourceDropdown.spec.tsx
index 5cbde923fe1..fcc44870029 100644
--- a/frontend/packages/console-shared/src/components/dropdown/__tests__/ResourceDropdown.spec.tsx
+++ b/frontend/packages/console-shared/src/components/dropdown/__tests__/ResourceDropdown.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, mount, ShallowWrapper } from 'enzyme';
 import { mockDropdownData } from '../__mocks__/dropdown-data-mock';
 import ResourceDropdown, { ResourceDropdownProps } from '../ResourceDropdown';
diff --git a/frontend/packages/console-shared/src/components/editor/ShortcutsPopover.tsx b/frontend/packages/console-shared/src/components/editor/ShortcutsPopover.tsx
index d0ef435181b..b1365203dfa 100644
--- a/frontend/packages/console-shared/src/components/editor/ShortcutsPopover.tsx
+++ b/frontend/packages/console-shared/src/components/editor/ShortcutsPopover.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { PopoverProps } from '@patternfly/react-core';
 import { useTranslation } from 'react-i18next';
 import { ShortcutTable, Shortcut } from '../shortcuts';
diff --git a/frontend/packages/console-shared/src/components/editor/__tests__/CodeEditorToolbar.spec.tsx b/frontend/packages/console-shared/src/components/editor/__tests__/CodeEditorToolbar.spec.tsx
index 0ff52b9ae7c..c2ff10bc1bf 100644
--- a/frontend/packages/console-shared/src/components/editor/__tests__/CodeEditorToolbar.spec.tsx
+++ b/frontend/packages/console-shared/src/components/editor/__tests__/CodeEditorToolbar.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button } from '@patternfly/react-core';
 import { shallow, ShallowWrapper } from 'enzyme';
 import { useTranslation } from 'react-i18next';
diff --git a/frontend/packages/console-shared/src/components/empty-state/__tests__/empty-state.spec.tsx b/frontend/packages/console-shared/src/components/empty-state/__tests__/empty-state.spec.tsx
index eb4847318e6..691543be1fd 100644
--- a/frontend/packages/console-shared/src/components/empty-state/__tests__/empty-state.spec.tsx
+++ b/frontend/packages/console-shared/src/components/empty-state/__tests__/empty-state.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { configure, render } from '@testing-library/react';
 import { AccessDenied, EmptyBox, ConsoleEmptyState } from '..';
 
diff --git a/frontend/packages/console-shared/src/components/form-utils/__tests__/FlexForm.spec.tsx b/frontend/packages/console-shared/src/components/form-utils/__tests__/FlexForm.spec.tsx
index db1c2ef2ba0..c91f95eaff0 100644
--- a/frontend/packages/console-shared/src/components/form-utils/__tests__/FlexForm.spec.tsx
+++ b/frontend/packages/console-shared/src/components/form-utils/__tests__/FlexForm.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { TextInputTypes } from '@patternfly/react-core';
 import { shallow, ShallowWrapper } from 'enzyme';
 import InputField from '../../formik-fields/InputField';
diff --git a/frontend/packages/console-shared/src/components/form-utils/__tests__/PageBody.spec.tsx b/frontend/packages/console-shared/src/components/form-utils/__tests__/PageBody.spec.tsx
index 17757a12fdb..ba1d79e60de 100644
--- a/frontend/packages/console-shared/src/components/form-utils/__tests__/PageBody.spec.tsx
+++ b/frontend/packages/console-shared/src/components/form-utils/__tests__/PageBody.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { TextInputTypes } from '@patternfly/react-core';
 import { shallow, ShallowWrapper } from 'enzyme';
 import InputField from '../../formik-fields/InputField';
diff --git a/frontend/packages/console-shared/src/components/formik-fields/InputField.tsx b/frontend/packages/console-shared/src/components/formik-fields/InputField.tsx
index 715135985f9..60047647896 100644
--- a/frontend/packages/console-shared/src/components/formik-fields/InputField.tsx
+++ b/frontend/packages/console-shared/src/components/formik-fields/InputField.tsx
@@ -5,25 +5,24 @@ import { BaseInputFieldProps } from './field-types';
 
 import './InputField.scss';
 
-const InputField: React.FC<BaseInputFieldProps> = (
-  { type = TextInputTypes.text, ...baseProps },
-  ref,
-) => (
-  <BaseInputField type={type} {...baseProps}>
-    {(props) => (
-      <div className="oc-inputfield">
-        <TextInput ref={ref} {...props} />
-        {props.validated && props.validated !== ValidatedOptions.default ? (
-          <div
-            className={`oc-inputfield__validation-icon ${props.validated}`}
-            // The BaseInputField will show an description (helper-text) below
-            // the input field that describes the validation error.
-            aria-hidden="true"
-          />
-        ) : null}
-      </div>
-    )}
-  </BaseInputField>
+const InputField = React.forwardRef<HTMLInputElement, BaseInputFieldProps>(
+  ({ type = TextInputTypes.text, ...baseProps }, ref) => (
+    <BaseInputField type={type} {...baseProps}>
+      {(props) => (
+        <div className="oc-inputfield">
+          <TextInput ref={ref} {...props} />
+          {props.validated && props.validated !== ValidatedOptions.default ? (
+            <div
+              className={`oc-inputfield__validation-icon ${props.validated}`}
+              // The BaseInputField will show an description (helper-text) below
+              // the input field that describes the validation error.
+              aria-hidden="true"
+            />
+          ) : null}
+        </div>
+      )}
+    </BaseInputField>
+  ),
 );
 
-export default React.forwardRef(InputField);
+export default InputField;
diff --git a/frontend/packages/console-shared/src/components/formik-fields/TextAreaField.tsx b/frontend/packages/console-shared/src/components/formik-fields/TextAreaField.tsx
index 95600b3965b..de64ab9f123 100644
--- a/frontend/packages/console-shared/src/components/formik-fields/TextAreaField.tsx
+++ b/frontend/packages/console-shared/src/components/formik-fields/TextAreaField.tsx
@@ -11,45 +11,44 @@ import { RedExclamationCircleIcon } from '../status';
 import { TextAreaProps } from './field-types';
 import { getFieldId } from './field-utils';
 
-const TextAreaField: React.FC<TextAreaProps> = (
-  { label, helpText, required, onChange, ...props },
-  ref,
-) => {
-  const [field, { touched, error }] = useField(props.name);
-  const fieldId = getFieldId(props.name, 'input');
-  const isValid = !(touched && error);
-  const errorMessage = !isValid ? error : '';
+const TextAreaField = React.forwardRef<HTMLTextAreaElement, TextAreaProps>(
+  ({ label, helpText, required, onChange, ...props }, ref) => {
+    const [field, { touched, error }] = useField(props.name);
+    const fieldId = getFieldId(props.name, 'input');
+    const isValid = !(touched && error);
+    const errorMessage = !isValid ? error : '';
 
-  return (
-    <FormGroup fieldId={fieldId} label={label} isRequired={required}>
-      <TextArea
-        {...field}
-        {...props}
-        ref={ref}
-        id={fieldId}
-        style={{ resize: 'vertical' }}
-        validated={isValid ? 'default' : 'error'}
-        isRequired={required}
-        aria-describedby={helpText ? `${fieldId}-helper` : undefined}
-        onChange={(event, value) => {
-          onChange && onChange(value);
-          field.onChange(event);
-        }}
-      />
+    return (
+      <FormGroup fieldId={fieldId} label={label} isRequired={required}>
+        <TextArea
+          {...field}
+          {...props}
+          ref={ref}
+          id={fieldId}
+          style={{ resize: 'vertical' }}
+          validated={isValid ? 'default' : 'error'}
+          isRequired={required}
+          aria-describedby={helpText ? `${fieldId}-helper` : undefined}
+          onChange={(event, value) => {
+            onChange && onChange(value);
+            field.onChange(event);
+          }}
+        />
 
-      <FormHelperText>
-        <HelperText>
-          {!isValid ? (
-            <HelperTextItem variant="error" icon={<RedExclamationCircleIcon />}>
-              {errorMessage}
-            </HelperTextItem>
-          ) : (
-            <HelperTextItem>{helpText}</HelperTextItem>
-          )}
-        </HelperText>
-      </FormHelperText>
-    </FormGroup>
-  );
-};
+        <FormHelperText>
+          <HelperText>
+            {!isValid ? (
+              <HelperTextItem variant="error" icon={<RedExclamationCircleIcon />}>
+                {errorMessage}
+              </HelperTextItem>
+            ) : (
+              <HelperTextItem>{helpText}</HelperTextItem>
+            )}
+          </HelperText>
+        </FormHelperText>
+      </FormGroup>
+    );
+  },
+);
 
-export default React.forwardRef(TextAreaField);
+export default TextAreaField;
diff --git a/frontend/packages/console-shared/src/components/formik-fields/__tests__/DropdownField.spec.tsx b/frontend/packages/console-shared/src/components/formik-fields/__tests__/DropdownField.spec.tsx
index ff3d5df80ab..d610849e6b5 100644
--- a/frontend/packages/console-shared/src/components/formik-fields/__tests__/DropdownField.spec.tsx
+++ b/frontend/packages/console-shared/src/components/formik-fields/__tests__/DropdownField.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { Dropdown } from '@console/internal/components/utils';
 import DropdownField from '../DropdownField';
diff --git a/frontend/packages/console-shared/src/components/formik-fields/__tests__/ItemSelectorField.spec.tsx b/frontend/packages/console-shared/src/components/formik-fields/__tests__/ItemSelectorField.spec.tsx
index 6ca526bc6f7..9c10a54dfb7 100644
--- a/frontend/packages/console-shared/src/components/formik-fields/__tests__/ItemSelectorField.spec.tsx
+++ b/frontend/packages/console-shared/src/components/formik-fields/__tests__/ItemSelectorField.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { EmptyState } from '@patternfly/react-core';
 import { shallow } from 'enzyme';
 import ItemSelectorField from '../item-selector-field/ItemSelectorField';
diff --git a/frontend/packages/console-shared/src/components/formik-fields/__tests__/NumberSpinnerField.spec.tsx b/frontend/packages/console-shared/src/components/formik-fields/__tests__/NumberSpinnerField.spec.tsx
index 34310c94fc4..de98a37d6b4 100644
--- a/frontend/packages/console-shared/src/components/formik-fields/__tests__/NumberSpinnerField.spec.tsx
+++ b/frontend/packages/console-shared/src/components/formik-fields/__tests__/NumberSpinnerField.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { screen, configure, fireEvent, act, waitFor } from '@testing-library/react';
 import { mockFormikRenderer } from '../../../test-utils/unit-test-utils';
 import NumberSpinnerField from '../NumberSpinnerField';
diff --git a/frontend/packages/console-shared/src/components/formik-fields/__tests__/SelectorInputField.spec.tsx b/frontend/packages/console-shared/src/components/formik-fields/__tests__/SelectorInputField.spec.tsx
index c356d9ad2cb..912c83294bd 100644
--- a/frontend/packages/console-shared/src/components/formik-fields/__tests__/SelectorInputField.spec.tsx
+++ b/frontend/packages/console-shared/src/components/formik-fields/__tests__/SelectorInputField.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { FormGroup } from '@patternfly/react-core';
 import { shallow } from 'enzyme';
 import { useFormikContext, useField } from 'formik';
diff --git a/frontend/packages/console-shared/src/components/formik-fields/multi-column-field/__tests__/MultiColumnFieldFooter.spec.tsx b/frontend/packages/console-shared/src/components/formik-fields/multi-column-field/__tests__/MultiColumnFieldFooter.spec.tsx
index 8df741ab455..81fc8a3b124 100644
--- a/frontend/packages/console-shared/src/components/formik-fields/multi-column-field/__tests__/MultiColumnFieldFooter.spec.tsx
+++ b/frontend/packages/console-shared/src/components/formik-fields/multi-column-field/__tests__/MultiColumnFieldFooter.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button, Tooltip } from '@patternfly/react-core';
 import { shallow } from 'enzyme';
 import MultiColumnFieldFooter from '../MultiColumnFieldFooter';
diff --git a/frontend/packages/console-shared/src/components/formik-fields/multi-column-field/__tests__/MultiColumnFieldHeader.spec.tsx b/frontend/packages/console-shared/src/components/formik-fields/multi-column-field/__tests__/MultiColumnFieldHeader.spec.tsx
index 8b0555568ab..110b363b6f8 100644
--- a/frontend/packages/console-shared/src/components/formik-fields/multi-column-field/__tests__/MultiColumnFieldHeader.spec.tsx
+++ b/frontend/packages/console-shared/src/components/formik-fields/multi-column-field/__tests__/MultiColumnFieldHeader.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { gridItemSpanValueShape } from '@patternfly/react-core';
 import { shallow, ShallowWrapper } from 'enzyme';
 import MultiColumnFieldHeader, { MultiColumnFieldHeaderProps } from '../MultiColumnFieldHeader';
diff --git a/frontend/packages/console-shared/src/components/formik-fields/text-column-field/__tests__/TextColumnItem.spec.tsx b/frontend/packages/console-shared/src/components/formik-fields/text-column-field/__tests__/TextColumnItem.spec.tsx
index 6c3a951be37..9894977c242 100644
--- a/frontend/packages/console-shared/src/components/formik-fields/text-column-field/__tests__/TextColumnItem.spec.tsx
+++ b/frontend/packages/console-shared/src/components/formik-fields/text-column-field/__tests__/TextColumnItem.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import TextColumnItem from '../TextColumnItem';
 import TextColumnItemContent from '../TextColumnItemContent';
diff --git a/frontend/packages/console-shared/src/components/getting-started/__tests__/GettingStartedCard.spec.tsx b/frontend/packages/console-shared/src/components/getting-started/__tests__/GettingStartedCard.spec.tsx
index 861950a5206..6bb6fb46421 100644
--- a/frontend/packages/console-shared/src/components/getting-started/__tests__/GettingStartedCard.spec.tsx
+++ b/frontend/packages/console-shared/src/components/getting-started/__tests__/GettingStartedCard.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import {
   GettingStartedLink,
diff --git a/frontend/packages/console-shared/src/components/getting-started/__tests__/QuickStartGettingStartedCard.spec.tsx b/frontend/packages/console-shared/src/components/getting-started/__tests__/QuickStartGettingStartedCard.spec.tsx
index 2d9b2e46747..dcea4a14da3 100644
--- a/frontend/packages/console-shared/src/components/getting-started/__tests__/QuickStartGettingStartedCard.spec.tsx
+++ b/frontend/packages/console-shared/src/components/getting-started/__tests__/QuickStartGettingStartedCard.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import QuickStartsLoader from '@console/app/src/components/quick-starts/loader/QuickStartsLoader';
 import { GettingStartedCard } from '@console/shared/src/components/getting-started';
diff --git a/frontend/packages/console-shared/src/components/getting-started/__tests__/RestoreGettingStartedButton.spec.tsx b/frontend/packages/console-shared/src/components/getting-started/__tests__/RestoreGettingStartedButton.spec.tsx
index ad5b1661c26..8b65671382d 100644
--- a/frontend/packages/console-shared/src/components/getting-started/__tests__/RestoreGettingStartedButton.spec.tsx
+++ b/frontend/packages/console-shared/src/components/getting-started/__tests__/RestoreGettingStartedButton.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { RestoreGettingStartedButton } from '../RestoreGettingStartedButton';
 import { useGettingStartedShowState, GettingStartedShowState } from '../useGettingStartedShowState';
diff --git a/frontend/packages/console-shared/src/components/health-checks/__tests__/HealthChecksAlert.spec.tsx b/frontend/packages/console-shared/src/components/health-checks/__tests__/HealthChecksAlert.spec.tsx
index 40aeab0edce..a70082a2364 100644
--- a/frontend/packages/console-shared/src/components/health-checks/__tests__/HealthChecksAlert.spec.tsx
+++ b/frontend/packages/console-shared/src/components/health-checks/__tests__/HealthChecksAlert.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Alert } from '@patternfly/react-core';
 import { shallow } from 'enzyme';
 import * as rbacModule from '@console/internal/components/utils/rbac';
diff --git a/frontend/packages/console-shared/src/components/loading/__tests__/loading.spec.tsx b/frontend/packages/console-shared/src/components/loading/__tests__/loading.spec.tsx
index 7377fc820c9..8381847ff00 100644
--- a/frontend/packages/console-shared/src/components/loading/__tests__/loading.spec.tsx
+++ b/frontend/packages/console-shared/src/components/loading/__tests__/loading.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { configure, render } from '@testing-library/react';
 import { LoadError } from '../LoadError';
 import { Loading } from '../Loading';
diff --git a/frontend/packages/console-shared/src/components/markdown-extensions/__tests__/MarkdownCopyClipboard.spec.tsx b/frontend/packages/console-shared/src/components/markdown-extensions/__tests__/MarkdownCopyClipboard.spec.tsx
index 74d5c7ea90b..f727f517154 100644
--- a/frontend/packages/console-shared/src/components/markdown-extensions/__tests__/MarkdownCopyClipboard.spec.tsx
+++ b/frontend/packages/console-shared/src/components/markdown-extensions/__tests__/MarkdownCopyClipboard.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import MarkdownCopyClipboard, { CopyClipboard } from '../MarkdownCopyClipboard';
 import { htmlDocumentForCopyClipboard } from './test-data';
diff --git a/frontend/packages/console-shared/src/components/markdown-extensions/__tests__/MarkdownExecuteSnippet.spec.tsx b/frontend/packages/console-shared/src/components/markdown-extensions/__tests__/MarkdownExecuteSnippet.spec.tsx
index 74ae2fd0421..2b7b68cc62e 100644
--- a/frontend/packages/console-shared/src/components/markdown-extensions/__tests__/MarkdownExecuteSnippet.spec.tsx
+++ b/frontend/packages/console-shared/src/components/markdown-extensions/__tests__/MarkdownExecuteSnippet.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import useCloudShellAvailable from '@console/webterminal-plugin/src/components/cloud-shell/useCloudShellAvailable';
 import MarkdownExecuteSnippet, { ExecuteSnippet } from '../MarkdownExecuteSnippet';
diff --git a/frontend/packages/console-shared/src/components/pod/__tests__/PodRingSet.spec.tsx b/frontend/packages/console-shared/src/components/pod/__tests__/PodRingSet.spec.tsx
index bcfeb60d4b0..e979f3c3a46 100644
--- a/frontend/packages/console-shared/src/components/pod/__tests__/PodRingSet.spec.tsx
+++ b/frontend/packages/console-shared/src/components/pod/__tests__/PodRingSet.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { LongArrowAltRightIcon } from '@patternfly/react-icons/dist/esm/icons/long-arrow-alt-right-icon';
 import { shallow } from 'enzyme';
 import { DeploymentConfigModel } from '@console/internal/models';
diff --git a/frontend/packages/console-shared/src/components/progressive-list/__tests__/ProgressiveListFooter.spec.tsx b/frontend/packages/console-shared/src/components/progressive-list/__tests__/ProgressiveListFooter.spec.tsx
index a3e1ae3c797..bf096abe6ed 100644
--- a/frontend/packages/console-shared/src/components/progressive-list/__tests__/ProgressiveListFooter.spec.tsx
+++ b/frontend/packages/console-shared/src/components/progressive-list/__tests__/ProgressiveListFooter.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button } from '@patternfly/react-core';
 import { shallow } from 'enzyme';
 import i18n from 'i18next';
diff --git a/frontend/packages/console-shared/src/components/quick-search/QuickSearchBar.tsx b/frontend/packages/console-shared/src/components/quick-search/QuickSearchBar.tsx
index a16176c6020..6c041e7c841 100644
--- a/frontend/packages/console-shared/src/components/quick-search/QuickSearchBar.tsx
+++ b/frontend/packages/console-shared/src/components/quick-search/QuickSearchBar.tsx
@@ -19,40 +19,50 @@ interface QuickSearchBarProps {
   icon?: React.ReactNode;
 }
 
-const QuickSearchBar: React.FC<QuickSearchBarProps> = (
-  { showNoResults, itemsLoaded, autoFocus = false, searchTerm, searchPlaceholder, onSearch, icon },
-  inputRef,
-) => {
-  const { t } = useTranslation();
-  return (
-    <TextInputGroup data-test="quick-search-bar">
-      <TextInputGroupMain
-        type="text"
-        ref={inputRef}
-        aria-label={t('console-shared~Quick search bar')}
-        placeholder={searchPlaceholder}
-        onChange={onSearch}
-        autoFocus={autoFocus}
-        value={searchTerm}
-        data-test="input"
-        icon={icon || <QuickSearchIcon />}
-      />
-      {(!itemsLoaded || showNoResults) && (
-        <TextInputGroupUtilities className="pf-v6-u-mr-md">
-          {itemsLoaded && showNoResults && (
-            <InputGroupText data-test="quick-search-no-results">
-              {t('console-shared~No results')}
-            </InputGroupText>
-          )}
-          {!itemsLoaded && (
-            <InputGroupText>
-              <Spinner diameter="1em" />
-            </InputGroupText>
-          )}
-        </TextInputGroupUtilities>
-      )}
-    </TextInputGroup>
-  );
-};
+const QuickSearchBar = React.forwardRef<HTMLInputElement, QuickSearchBarProps>(
+  (
+    {
+      showNoResults,
+      itemsLoaded,
+      autoFocus = false,
+      searchTerm,
+      searchPlaceholder,
+      onSearch,
+      icon,
+    },
+    inputRef,
+  ) => {
+    const { t } = useTranslation();
+    return (
+      <TextInputGroup data-test="quick-search-bar">
+        <TextInputGroupMain
+          type="text"
+          ref={inputRef}
+          aria-label={t('console-shared~Quick search bar')}
+          placeholder={searchPlaceholder}
+          onChange={onSearch}
+          autoFocus={autoFocus}
+          value={searchTerm}
+          data-test="input"
+          icon={icon || <QuickSearchIcon />}
+        />
+        {(!itemsLoaded || showNoResults) && (
+          <TextInputGroupUtilities className="pf-v6-u-mr-md">
+            {itemsLoaded && showNoResults && (
+              <InputGroupText data-test="quick-search-no-results">
+                {t('console-shared~No results')}
+              </InputGroupText>
+            )}
+            {!itemsLoaded && (
+              <InputGroupText>
+                <Spinner diameter="1em" />
+              </InputGroupText>
+            )}
+          </TextInputGroupUtilities>
+        )}
+      </TextInputGroup>
+    );
+  },
+);
 
-export default React.forwardRef(QuickSearchBar);
+export default QuickSearchBar;
diff --git a/frontend/packages/console-shared/src/components/status/__tests__/status-box.spec.tsx b/frontend/packages/console-shared/src/components/status/__tests__/status-box.spec.tsx
index 886ac4cc428..ff0a9421ecd 100644
--- a/frontend/packages/console-shared/src/components/status/__tests__/status-box.spec.tsx
+++ b/frontend/packages/console-shared/src/components/status/__tests__/status-box.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { configure, render } from '@testing-library/react';
 import {
   IncompleteDataError,
diff --git a/frontend/packages/console-shared/src/hooks/useUserSettings.ts b/frontend/packages/console-shared/src/hooks/useUserSettings.ts
index d48a623886c..e8aef468def 100644
--- a/frontend/packages/console-shared/src/hooks/useUserSettings.ts
+++ b/frontend/packages/console-shared/src/hooks/useUserSettings.ts
@@ -35,7 +35,11 @@ const useCounterRef = (initialValue: number = 0): [boolean, () => void, () => vo
 export const useUserSettings: UseUserSettings = <T>(key, defaultValue, sync = false) => {
   // Mount status for safety state updates
   const mounted = React.useRef(true);
-  React.useEffect(() => () => (mounted.current = false), []);
+  React.useEffect(() => {
+    return () => {
+      mounted.current = false;
+    };
+  }, []);
 
   // Keys and values
   const keyRef = React.useRef<string>(key?.replace(/[^-._a-zA-Z0-9]/g, '_'));
diff --git a/frontend/packages/console-shared/src/hooks/useUserSettingsLocalStorage.ts b/frontend/packages/console-shared/src/hooks/useUserSettingsLocalStorage.ts
index 6fe25d465e3..4c9f4e3ddf1 100644
--- a/frontend/packages/console-shared/src/hooks/useUserSettingsLocalStorage.ts
+++ b/frontend/packages/console-shared/src/hooks/useUserSettingsLocalStorage.ts
@@ -10,7 +10,11 @@ export const useUserSettingsLocalStorage = <T>(
 ): [T, React.Dispatch<React.SetStateAction<T>>] => {
   // Mount status for safty state updates
   const mounted = React.useRef(true);
-  React.useEffect(() => () => (mounted.current = false), []);
+  React.useEffect(() => {
+    return () => {
+      mounted.current = false;
+    };
+  }, []);
 
   const storage = session ? sessionStorage : localStorage;
   const keyRef = React.useRef(userSettingsKey);
diff --git a/frontend/packages/dev-console/src/actions/add-resources.tsx b/frontend/packages/dev-console/src/actions/add-resources.tsx
index d01090e8a0c..b567a5923c7 100644
--- a/frontend/packages/dev-console/src/actions/add-resources.tsx
+++ b/frontend/packages/dev-console/src/actions/add-resources.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BoltIcon } from '@patternfly/react-icons/dist/esm/icons/bolt-icon';
 import { CatalogIcon } from '@patternfly/react-icons/dist/esm/icons/catalog-icon';
 import { DatabaseIcon } from '@patternfly/react-icons/dist/esm/icons/database-icon';
diff --git a/frontend/packages/dev-console/src/components/add/__tests__/AddCardSectionEmptyState.spec.tsx b/frontend/packages/dev-console/src/components/add/__tests__/AddCardSectionEmptyState.spec.tsx
index c4554a68bf6..ef3b636c916 100644
--- a/frontend/packages/dev-console/src/components/add/__tests__/AddCardSectionEmptyState.spec.tsx
+++ b/frontend/packages/dev-console/src/components/add/__tests__/AddCardSectionEmptyState.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { render, screen } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import AddCardSectionEmptyState from '../AddCardSectionEmptyState';
diff --git a/frontend/packages/dev-console/src/components/add/__tests__/AddPage.spec.tsx b/frontend/packages/dev-console/src/components/add/__tests__/AddPage.spec.tsx
index 8705c3ae9c8..87561d557b9 100644
--- a/frontend/packages/dev-console/src/components/add/__tests__/AddPage.spec.tsx
+++ b/frontend/packages/dev-console/src/components/add/__tests__/AddPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import * as Router from 'react-router-dom-v5-compat';
 import CreateProjectListPage from '../../projects/CreateProjectListPage';
diff --git a/frontend/packages/dev-console/src/components/add/__tests__/MasonryLayout.spec.tsx b/frontend/packages/dev-console/src/components/add/__tests__/MasonryLayout.spec.tsx
index a480e638a49..61847f59b71 100644
--- a/frontend/packages/dev-console/src/components/add/__tests__/MasonryLayout.spec.tsx
+++ b/frontend/packages/dev-console/src/components/add/__tests__/MasonryLayout.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import Measure, { ContentRect } from 'react-measure';
 import AddCardSectionSkeleton from '../AddCardSectionSkeleton';
diff --git a/frontend/packages/dev-console/src/components/add/__tests__/add-page-test-data.tsx b/frontend/packages/dev-console/src/components/add/__tests__/add-page-test-data.tsx
index cfe3ff3ab7a..8979e2f537c 100644
--- a/frontend/packages/dev-console/src/components/add/__tests__/add-page-test-data.tsx
+++ b/frontend/packages/dev-console/src/components/add/__tests__/add-page-test-data.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { CatalogIcon } from '@patternfly/react-icons/dist/esm/icons/catalog-icon';
 import { SignOutAltIcon } from '@patternfly/react-icons/dist/esm/icons/sign-out-alt-icon';
 import { AddActionGroup, ResolvedExtension, AddAction } from '@console/dynamic-plugin-sdk';
diff --git a/frontend/packages/dev-console/src/components/add/layout/Masonry.tsx b/frontend/packages/dev-console/src/components/add/layout/Masonry.tsx
index 8a33649d4fd..b89d66f6520 100644
--- a/frontend/packages/dev-console/src/components/add/layout/Masonry.tsx
+++ b/frontend/packages/dev-console/src/components/add/layout/Masonry.tsx
@@ -21,7 +21,7 @@ export const Masonry: React.FC<MasonryProps> = ({ columnCount, children }) => {
 
   let added = false;
   let allRendered = true;
-  React.Children.forEach(children, (item, itemIndex) => {
+  React.Children.forEach(children, (item: React.ReactElement, itemIndex) => {
     // Fill first row directly
     if (itemIndex < columns) {
       groupedColumns[itemIndex].height += heights[item.key as string] || 0;
diff --git a/frontend/packages/dev-console/src/components/catalog/providers/useDevfile.tsx b/frontend/packages/dev-console/src/components/catalog/providers/useDevfile.tsx
index 280eb3f8b60..2256b963c2b 100644
--- a/frontend/packages/dev-console/src/components/catalog/providers/useDevfile.tsx
+++ b/frontend/packages/dev-console/src/components/catalog/providers/useDevfile.tsx
@@ -84,7 +84,9 @@ const useDevfile: ExtensionHook<CatalogItem[]> = (): [CatalogItem[], boolean, an
       .catch((err) => {
         if (mounted) setLoadedError(err);
       });
-    return () => (mounted = false);
+    return () => {
+      mounted = false;
+    };
   }, []);
 
   const normalizedDevfileSamples = React.useMemo(() => normalizeDevfile(devfileSamples || [], t), [
diff --git a/frontend/packages/dev-console/src/components/catalog/providers/useDevfileSamples.tsx b/frontend/packages/dev-console/src/components/catalog/providers/useDevfileSamples.tsx
index ba3d6a7bef4..7c88e70d377 100644
--- a/frontend/packages/dev-console/src/components/catalog/providers/useDevfileSamples.tsx
+++ b/frontend/packages/dev-console/src/components/catalog/providers/useDevfileSamples.tsx
@@ -62,7 +62,9 @@ const useDevfileSamples: ExtensionHook<CatalogItem[]> = (): [CatalogItem[], bool
         if (mounted) setLoadedError(err);
       });
 
-    return () => (mounted = false);
+    return () => {
+      mounted = false;
+    };
   }, []);
 
   const normalizedDevfileSamples = React.useMemo(
diff --git a/frontend/packages/dev-console/src/components/deployments/__tests__/AdvancedSection.spec.tsx b/frontend/packages/dev-console/src/components/deployments/__tests__/AdvancedSection.spec.tsx
index 493f1956e95..fd96e26ebae 100644
--- a/frontend/packages/dev-console/src/components/deployments/__tests__/AdvancedSection.spec.tsx
+++ b/frontend/packages/dev-console/src/components/deployments/__tests__/AdvancedSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { render, screen, fireEvent, cleanup, waitFor, configure } from '@testing-library/react';
 import i18n from 'i18next';
 import { setI18n } from 'react-i18next';
diff --git a/frontend/packages/dev-console/src/components/deployments/__tests__/DeploymentStrategySection.spec.tsx b/frontend/packages/dev-console/src/components/deployments/__tests__/DeploymentStrategySection.spec.tsx
index fbe6e3b2331..e36b8bc0349 100644
--- a/frontend/packages/dev-console/src/components/deployments/__tests__/DeploymentStrategySection.spec.tsx
+++ b/frontend/packages/dev-console/src/components/deployments/__tests__/DeploymentStrategySection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { cleanup, fireEvent, render, screen, waitFor, configure } from '@testing-library/react';
 import { Provider } from 'react-redux';
 import store from '@console/internal/redux';
diff --git a/frontend/packages/dev-console/src/components/deployments/__tests__/PauseRolloutsSection.spec.tsx b/frontend/packages/dev-console/src/components/deployments/__tests__/PauseRolloutsSection.spec.tsx
index 957c7664904..e06d2cabfe7 100644
--- a/frontend/packages/dev-console/src/components/deployments/__tests__/PauseRolloutsSection.spec.tsx
+++ b/frontend/packages/dev-console/src/components/deployments/__tests__/PauseRolloutsSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { render, fireEvent, screen, waitFor, configure } from '@testing-library/react';
 import { Resources } from '../../import/import-types';
 import MockForm from '../__mocks__/MockForm';
diff --git a/frontend/packages/dev-console/src/components/edit-application/__tests__/EditApplicationForm.spec.tsx b/frontend/packages/dev-console/src/components/edit-application/__tests__/EditApplicationForm.spec.tsx
index e2e219af4f5..a7577e79878 100644
--- a/frontend/packages/dev-console/src/components/edit-application/__tests__/EditApplicationForm.spec.tsx
+++ b/frontend/packages/dev-console/src/components/edit-application/__tests__/EditApplicationForm.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import PipelineSection from '@console/pipelines-plugin/src/components/import/pipeline/PipelineSection';
 import { formikFormProps } from '@console/shared/src/test-utils/formik-props-utils';
diff --git a/frontend/packages/dev-console/src/components/import/advanced/__tests__/LabelSection.spec.tsx b/frontend/packages/dev-console/src/components/import/advanced/__tests__/LabelSection.spec.tsx
index 7f2bfd2720c..7a5d58a4117 100644
--- a/frontend/packages/dev-console/src/components/import/advanced/__tests__/LabelSection.spec.tsx
+++ b/frontend/packages/dev-console/src/components/import/advanced/__tests__/LabelSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import SelectorInputField from '@console/shared/src/components/formik-fields/SelectorInputField';
 import FormSection from '../../section/FormSection';
diff --git a/frontend/packages/dev-console/src/components/import/devfile/devfileHooks.ts b/frontend/packages/dev-console/src/components/import/devfile/devfileHooks.ts
index 0a99780741c..31a4ab770e6 100644
--- a/frontend/packages/dev-console/src/components/import/devfile/devfileHooks.ts
+++ b/frontend/packages/dev-console/src/components/import/devfile/devfileHooks.ts
@@ -168,7 +168,9 @@ export const useSelectedDevfileSample = () => {
         if (mounted) setDevfileSamples(null);
       });
 
-    return () => (mounted = false);
+    return () => {
+      mounted = false;
+    };
   }, []);
 
   return React.useMemo(() => devfileSamples?.find((sample) => sample.name === devfileName), [
diff --git a/frontend/packages/dev-console/src/components/import/git/SampleRepo.tsx b/frontend/packages/dev-console/src/components/import/git/SampleRepo.tsx
index a9917dba407..fe46c352099 100644
--- a/frontend/packages/dev-console/src/components/import/git/SampleRepo.tsx
+++ b/frontend/packages/dev-console/src/components/import/git/SampleRepo.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { FormHelperText, Button, ButtonVariant } from '@patternfly/react-core';
 import { LevelUpAltIcon } from '@patternfly/react-icons/dist/esm/icons/level-up-alt-icon';
 import { useTranslation } from 'react-i18next';
diff --git a/frontend/packages/dev-console/src/components/import/jar/__tests__/UploadJarPage.spec.tsx b/frontend/packages/dev-console/src/components/import/jar/__tests__/UploadJarPage.spec.tsx
index 2214e624f2f..5b091867042 100644
--- a/frontend/packages/dev-console/src/components/import/jar/__tests__/UploadJarPage.spec.tsx
+++ b/frontend/packages/dev-console/src/components/import/jar/__tests__/UploadJarPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as Router from 'react-router-dom-v5-compat';
 import { LoadingBox, PageHeading } from '@console/internal/components/utils';
diff --git a/frontend/packages/dev-console/src/components/import/jar/section/__tests__/JarSection.spec.tsx b/frontend/packages/dev-console/src/components/import/jar/section/__tests__/JarSection.spec.tsx
index 9df02f2f672..ba5b19352e3 100644
--- a/frontend/packages/dev-console/src/components/import/jar/section/__tests__/JarSection.spec.tsx
+++ b/frontend/packages/dev-console/src/components/import/jar/section/__tests__/JarSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { FileUpload } from '@patternfly/react-core';
 import { shallow } from 'enzyme';
 import { InputField } from '@console/shared/src';
diff --git a/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildOptions.spec.tsx b/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildOptions.spec.tsx
index b30229aad81..780d3f44121 100644
--- a/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildOptions.spec.tsx
+++ b/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildOptions.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as shipwrightHooks from '@console/dev-console/src/utils/shipwright-build-hook';
 import * as flagsModule from '@console/dynamic-plugin-sdk/src/utils/flags';
diff --git a/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildSection.spec.tsx b/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildSection.spec.tsx
index f1ed0560987..57a2d10b1b6 100644
--- a/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildSection.spec.tsx
+++ b/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ExpandableSection } from '@patternfly/react-core';
 import { shallow } from 'enzyme';
 import { FormikValues } from 'formik';
diff --git a/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildStrategySelector.spec.tsx b/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildStrategySelector.spec.tsx
index 593d6651993..a5ca561be70 100644
--- a/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildStrategySelector.spec.tsx
+++ b/frontend/packages/dev-console/src/components/import/section/build-section/__tests__/BuildStrategySelector.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as shipwrightHooks from '@console/dev-console/src/utils/shipwright-build-hook';
 import { SingleDropdownField, SingleDropdownFieldProps } from '@console/shared';
diff --git a/frontend/packages/dev-console/src/components/import/serverless-function/ServerlessFunctionStrategySection.tsx b/frontend/packages/dev-console/src/components/import/serverless-function/ServerlessFunctionStrategySection.tsx
index 03aa0809d3a..aa04066e61c 100644
--- a/frontend/packages/dev-console/src/components/import/serverless-function/ServerlessFunctionStrategySection.tsx
+++ b/frontend/packages/dev-console/src/components/import/serverless-function/ServerlessFunctionStrategySection.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Alert, ValidatedOptions } from '@patternfly/react-core';
 import { FormikValues, useFormikContext } from 'formik';
 import { useTranslation } from 'react-i18next';
diff --git a/frontend/packages/dev-console/src/components/import/serverless/__tests__/ServerlessRouteSection.spec.tsx b/frontend/packages/dev-console/src/components/import/serverless/__tests__/ServerlessRouteSection.spec.tsx
index 9d1a1a9d820..3b308c14fd4 100644
--- a/frontend/packages/dev-console/src/components/import/serverless/__tests__/ServerlessRouteSection.spec.tsx
+++ b/frontend/packages/dev-console/src/components/import/serverless/__tests__/ServerlessRouteSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { useFormikContext } from 'formik';
 import { LoadingInline } from '@console/internal/components/utils';
diff --git a/frontend/packages/dev-console/src/components/import/toast/__tests__/ImportToastContent.spec.tsx b/frontend/packages/dev-console/src/components/import/toast/__tests__/ImportToastContent.spec.tsx
index cdc82b0cf4c..171c6add81f 100644
--- a/frontend/packages/dev-console/src/components/import/toast/__tests__/ImportToastContent.spec.tsx
+++ b/frontend/packages/dev-console/src/components/import/toast/__tests__/ImportToastContent.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { RouteLinkAndCopy } from '@console/internal/components/routes';
 import { mockResources } from '../../__mocks__/import-toast-mock';
diff --git a/frontend/packages/dev-console/src/components/monitoring/__tests__/MonitoringPage.spec.tsx b/frontend/packages/dev-console/src/components/monitoring/__tests__/MonitoringPage.spec.tsx
index 9ee359b1374..b720ec9156c 100644
--- a/frontend/packages/dev-console/src/components/monitoring/__tests__/MonitoringPage.spec.tsx
+++ b/frontend/packages/dev-console/src/components/monitoring/__tests__/MonitoringPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as Router from 'react-router-dom-v5-compat';
 import { PageHeading, HorizontalNav } from '@console/internal/components/utils';
diff --git a/frontend/packages/dev-console/src/components/monitoring/events/__tests__/MonitoringEvents.spec.tsx b/frontend/packages/dev-console/src/components/monitoring/events/__tests__/MonitoringEvents.spec.tsx
index ba8979cfb2f..fc5cf5b0ee8 100644
--- a/frontend/packages/dev-console/src/components/monitoring/events/__tests__/MonitoringEvents.spec.tsx
+++ b/frontend/packages/dev-console/src/components/monitoring/events/__tests__/MonitoringEvents.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { EventsList } from '@console/internal/components/events';
 import MonitoringEvents from '../MonitoringEvents';
diff --git a/frontend/packages/dev-console/src/components/monitoring/overview/MonitoringMetrics.tsx b/frontend/packages/dev-console/src/components/monitoring/overview/MonitoringMetrics.tsx
index 504b77a06f5..46d68cd1a40 100644
--- a/frontend/packages/dev-console/src/components/monitoring/overview/MonitoringMetrics.tsx
+++ b/frontend/packages/dev-console/src/components/monitoring/overview/MonitoringMetrics.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import * as _ from 'lodash';
 import { useTranslation } from 'react-i18next';
 import { usePrometheusGate } from '@console/shared/src/hooks/usePrometheusGate';
diff --git a/frontend/packages/dev-console/src/components/project-access/__tests__/ProjectAccessPage.spec.tsx b/frontend/packages/dev-console/src/components/project-access/__tests__/ProjectAccessPage.spec.tsx
index 37ffe5b44ba..ecd1b0eaab4 100644
--- a/frontend/packages/dev-console/src/components/project-access/__tests__/ProjectAccessPage.spec.tsx
+++ b/frontend/packages/dev-console/src/components/project-access/__tests__/ProjectAccessPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as Router from 'react-router-dom-v5-compat';
 import { PageHeading } from '@console/internal/components/utils';
diff --git a/frontend/packages/dev-console/src/components/projects/details/__tests__/ProjectDetailsPage.spec.tsx b/frontend/packages/dev-console/src/components/projects/details/__tests__/ProjectDetailsPage.spec.tsx
index 3a93d3c577b..ecc9e255ab1 100644
--- a/frontend/packages/dev-console/src/components/projects/details/__tests__/ProjectDetailsPage.spec.tsx
+++ b/frontend/packages/dev-console/src/components/projects/details/__tests__/ProjectDetailsPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as _ from 'lodash';
 import * as Router from 'react-router-dom-v5-compat';
diff --git a/frontend/packages/dev-console/src/components/topology/hpa-tab-section.tsx b/frontend/packages/dev-console/src/components/topology/hpa-tab-section.tsx
index c9029b85cdf..65de03d222f 100644
--- a/frontend/packages/dev-console/src/components/topology/hpa-tab-section.tsx
+++ b/frontend/packages/dev-console/src/components/topology/hpa-tab-section.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
 import TopologySideBarTabSection from '@console/topology/src/components/side-bar/TopologySideBarTabSection';
diff --git a/frontend/packages/dev-console/src/components/topology/observe-tab-section.tsx b/frontend/packages/dev-console/src/components/topology/observe-tab-section.tsx
index 918763c5662..bb68b96b7f6 100644
--- a/frontend/packages/dev-console/src/components/topology/observe-tab-section.tsx
+++ b/frontend/packages/dev-console/src/components/topology/observe-tab-section.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
 import {
diff --git a/frontend/packages/dev-console/src/components/topology/sbr-sidebar/resource-link.tsx b/frontend/packages/dev-console/src/components/topology/sbr-sidebar/resource-link.tsx
index 9a6b23066ba..5ba74e0f5e1 100644
--- a/frontend/packages/dev-console/src/components/topology/sbr-sidebar/resource-link.tsx
+++ b/frontend/packages/dev-console/src/components/topology/sbr-sidebar/resource-link.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { ResourceIcon, ResourceLink } from '@console/internal/components/utils';
 import { referenceFor } from '@console/internal/module/k8s';
diff --git a/frontend/packages/dev-console/src/components/user-preferences/__tests__/SecureRouteFields.spec.tsx b/frontend/packages/dev-console/src/components/user-preferences/__tests__/SecureRouteFields.spec.tsx
index 07d64fbd2b0..49a8e09d954 100644
--- a/frontend/packages/dev-console/src/components/user-preferences/__tests__/SecureRouteFields.spec.tsx
+++ b/frontend/packages/dev-console/src/components/user-preferences/__tests__/SecureRouteFields.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { configure, fireEvent, render, screen, waitFor } from '@testing-library/react';
 import SecureRouteFields from '../SecureRouteFields';
 import { usePreferredRoutingOptions } from '../usePreferredRoutingOptions';
diff --git a/frontend/packages/dev-console/src/utils/icons.tsx b/frontend/packages/dev-console/src/utils/icons.tsx
index 1e41533cf02..f4b61ed5a43 100644
--- a/frontend/packages/dev-console/src/utils/icons.tsx
+++ b/frontend/packages/dev-console/src/utils/icons.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BoltIcon } from '@patternfly/react-icons/dist/esm/icons/bolt-icon';
 import { CatalogIcon } from '@patternfly/react-icons/dist/esm/icons/catalog-icon';
 import { DatabaseIcon } from '@patternfly/react-icons/dist/esm/icons/database-icon';
diff --git a/frontend/packages/eslint-plugin-console/lib/config/react.js b/frontend/packages/eslint-plugin-console/lib/config/react.js
index d3892fa16ae..55f42869bd4 100644
--- a/frontend/packages/eslint-plugin-console/lib/config/react.js
+++ b/frontend/packages/eslint-plugin-console/lib/config/react.js
@@ -38,6 +38,8 @@ module.exports = {
         // Prevent missing props validation in a React component definition
         // Off due to false positives in typescript
         'react/prop-types': 'off',
+        // React 17 doesn't require this anymore
+        'react/react-in-jsx-scope': 'off',
       },
     },
   ],
diff --git a/frontend/packages/helm-plugin/src/catalog/providers/useHelmCharts.tsx b/frontend/packages/helm-plugin/src/catalog/providers/useHelmCharts.tsx
index 2568560950e..4ecb0f5bdfd 100644
--- a/frontend/packages/helm-plugin/src/catalog/providers/useHelmCharts.tsx
+++ b/frontend/packages/helm-plugin/src/catalog/providers/useHelmCharts.tsx
@@ -61,7 +61,9 @@ const useHelmCharts: ExtensionHook<CatalogItem[]> = ({
           setLoadedError(err);
         }
       });
-    return () => (mounted = false);
+    return () => {
+      mounted = false;
+    };
   }, [activeNamespace]);
 
   const normalizedHelmCharts: CatalogItem[] = React.useMemo(
diff --git a/frontend/packages/helm-plugin/src/components/details-page/__tests__/HelmReleaseDetailsPage.spec.tsx b/frontend/packages/helm-plugin/src/components/details-page/__tests__/HelmReleaseDetailsPage.spec.tsx
index 32c72bcf305..d15fd246358 100644
--- a/frontend/packages/helm-plugin/src/components/details-page/__tests__/HelmReleaseDetailsPage.spec.tsx
+++ b/frontend/packages/helm-plugin/src/components/details-page/__tests__/HelmReleaseDetailsPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import NamespacedPage from '@console/dev-console/src/components/NamespacedPage';
 import HelmReleaseDetails from '../HelmReleaseDetails';
diff --git a/frontend/packages/helm-plugin/src/components/details-page/__tests__/HelmReleaseNotes.spec.tsx b/frontend/packages/helm-plugin/src/components/details-page/__tests__/HelmReleaseNotes.spec.tsx
index 5e30e7c333d..53cddbd6363 100644
--- a/frontend/packages/helm-plugin/src/components/details-page/__tests__/HelmReleaseNotes.spec.tsx
+++ b/frontend/packages/helm-plugin/src/components/details-page/__tests__/HelmReleaseNotes.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { SyncMarkdownView } from '@console/internal/components/markdown-view';
 import { useUserSettings } from '@console/shared';
diff --git a/frontend/packages/helm-plugin/src/components/details-page/resources/__tests__/HelmReleaseResourcesRow.spec.tsx b/frontend/packages/helm-plugin/src/components/details-page/resources/__tests__/HelmReleaseResourcesRow.spec.tsx
index b2fee361162..085cf72b663 100644
--- a/frontend/packages/helm-plugin/src/components/details-page/resources/__tests__/HelmReleaseResourcesRow.spec.tsx
+++ b/frontend/packages/helm-plugin/src/components/details-page/resources/__tests__/HelmReleaseResourcesRow.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { Link } from 'react-router-dom-v5-compat';
 import { RowFunctionArgs, TableData } from '@console/internal/components/factory';
diff --git a/frontend/packages/helm-plugin/src/topology/__tests__/TopologyHelmReleaseNotesPanel.spec.tsx b/frontend/packages/helm-plugin/src/topology/__tests__/TopologyHelmReleaseNotesPanel.spec.tsx
index 67159462f2f..dce09b59b31 100644
--- a/frontend/packages/helm-plugin/src/topology/__tests__/TopologyHelmReleaseNotesPanel.spec.tsx
+++ b/frontend/packages/helm-plugin/src/topology/__tests__/TopologyHelmReleaseNotesPanel.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, mount } from 'enzyme';
 import { SyncMarkdownView } from '@console/internal/components/markdown-view';
 import { SidebarSectionHeading } from '@console/internal/components/utils';
diff --git a/frontend/packages/helm-plugin/src/topology/components/getHelmReleaseStatusDecorator.tsx b/frontend/packages/helm-plugin/src/topology/components/getHelmReleaseStatusDecorator.tsx
index 650cbaf12f3..3836726c7cd 100644
--- a/frontend/packages/helm-plugin/src/topology/components/getHelmReleaseStatusDecorator.tsx
+++ b/frontend/packages/helm-plugin/src/topology/components/getHelmReleaseStatusDecorator.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Node } from '@patternfly/react-topology/src/types';
 import { TYPE_HELM_RELEASE } from './const';
 import HelmReleaseStatusDecorator from './HelmReleaseStatusDecorator';
diff --git a/frontend/packages/helm-plugin/src/topology/sidebar/release-panel/resource-link.tsx b/frontend/packages/helm-plugin/src/topology/sidebar/release-panel/resource-link.tsx
index 312f3d0b7c4..7dc6fff7dec 100644
--- a/frontend/packages/helm-plugin/src/topology/sidebar/release-panel/resource-link.tsx
+++ b/frontend/packages/helm-plugin/src/topology/sidebar/release-panel/resource-link.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { Link } from 'react-router-dom-v5-compat';
 import { ResourceIcon } from '@console/internal/components/utils/resource-icon';
diff --git a/frontend/packages/helm-plugin/src/utils/icons.tsx b/frontend/packages/helm-plugin/src/utils/icons.tsx
index 95486f04afe..f088079da39 100644
--- a/frontend/packages/helm-plugin/src/utils/icons.tsx
+++ b/frontend/packages/helm-plugin/src/utils/icons.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { createIcon } from '@patternfly/react-icons/dist/esm/createIcon';
 import { RepositoryIcon } from '@patternfly/react-icons/dist/esm/icons/repository-icon';
 
diff --git a/frontend/packages/integration-tests-cypress/tsconfig.json b/frontend/packages/integration-tests-cypress/tsconfig.json
index 0d0b77d6e0c..98392714895 100644
--- a/frontend/packages/integration-tests-cypress/tsconfig.json
+++ b/frontend/packages/integration-tests-cypress/tsconfig.json
@@ -1,7 +1,7 @@
 {
   "compilerOptions": {
     "types": ["cypress"],
-    "jsx": "react"
+    "jsx": "react-jsx"
   },
   "include": ["../../node_modules/cypress", "**/*.ts"]
 }
diff --git a/frontend/packages/knative-plugin/src/actions/add-event-sink.tsx b/frontend/packages/knative-plugin/src/actions/add-event-sink.tsx
index 4be88cc9363..18d2dc511f7 100644
--- a/frontend/packages/knative-plugin/src/actions/add-event-sink.tsx
+++ b/frontend/packages/knative-plugin/src/actions/add-event-sink.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import i18next from 'i18next';
 import { QUERY_PROPERTIES } from '@console/dev-console/src/const';
 import { Action } from '@console/dynamic-plugin-sdk';
diff --git a/frontend/packages/knative-plugin/src/actions/add-event-source.tsx b/frontend/packages/knative-plugin/src/actions/add-event-source.tsx
index 567226a0811..829d6e2a9d2 100644
--- a/frontend/packages/knative-plugin/src/actions/add-event-source.tsx
+++ b/frontend/packages/knative-plugin/src/actions/add-event-source.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import i18next from 'i18next';
 import { QUERY_PROPERTIES } from '@console/dev-console/src/const';
 import { Action } from '@console/dynamic-plugin-sdk';
diff --git a/frontend/packages/knative-plugin/src/components/add/__tests__/EventSinkAlert.spec.tsx b/frontend/packages/knative-plugin/src/components/add/__tests__/EventSinkAlert.spec.tsx
index e96e72d27ef..fa5624e29d1 100644
--- a/frontend/packages/knative-plugin/src/components/add/__tests__/EventSinkAlert.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/add/__tests__/EventSinkAlert.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Alert } from '@patternfly/react-core';
 import { shallow } from 'enzyme';
 import EventSinkAlert from '../EventSinkAlert';
diff --git a/frontend/packages/knative-plugin/src/components/add/__tests__/EventSinkPage.spec.tsx b/frontend/packages/knative-plugin/src/components/add/__tests__/EventSinkPage.spec.tsx
index eb93f6fa4c7..9c312b458f4 100644
--- a/frontend/packages/knative-plugin/src/components/add/__tests__/EventSinkPage.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/add/__tests__/EventSinkPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 // import { BrowserRouter } from 'react-router-dom';
 import * as Router from 'react-router-dom-v5-compat';
diff --git a/frontend/packages/knative-plugin/src/components/add/__tests__/EventSourceAlert.spec.tsx b/frontend/packages/knative-plugin/src/components/add/__tests__/EventSourceAlert.spec.tsx
index d06c9384e92..dfadc267fa1 100644
--- a/frontend/packages/knative-plugin/src/components/add/__tests__/EventSourceAlert.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/add/__tests__/EventSourceAlert.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Alert } from '@patternfly/react-core';
 import { shallow } from 'enzyme';
 import EventSourceAlert from '../EventSourceAlert';
diff --git a/frontend/packages/knative-plugin/src/components/add/event-sinks/__tests__/EventSinkSection.spec.tsx b/frontend/packages/knative-plugin/src/components/add/event-sinks/__tests__/EventSinkSection.spec.tsx
index 30117fc9843..a1471de3aab 100644
--- a/frontend/packages/knative-plugin/src/components/add/event-sinks/__tests__/EventSinkSection.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/add/event-sinks/__tests__/EventSinkSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { FormikValues, useFormikContext } from 'formik';
 import AppSection from '@console/dev-console/src/components/import/app/AppSection';
diff --git a/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/ApiServerSection.spec.tsx b/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/ApiServerSection.spec.tsx
index f941fd7cb6d..508bdcc24d3 100644
--- a/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/ApiServerSection.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/ApiServerSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import FormSection from '@console/dev-console/src/components/import/section/FormSection';
 import { AsyncComponent } from '@console/internal/components/utils/async';
diff --git a/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/EventSourceSection.spec.tsx b/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/EventSourceSection.spec.tsx
index 5cbdf76741a..57205f9bda4 100644
--- a/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/EventSourceSection.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/EventSourceSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { FormikValues } from 'formik';
 import AppSection from '@console/dev-console/src/components/import/app/AppSection';
diff --git a/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/KafkaSourceNetSection.spec.tsx b/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/KafkaSourceNetSection.spec.tsx
index e9e2bfff466..3930e388128 100644
--- a/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/KafkaSourceNetSection.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/add/event-sources/__tests__/KafkaSourceNetSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import SecretKeySelector from '../../SecretKeySelector';
 import KafkaSourceNetSection from '../KafkaSourceNetSection';
diff --git a/frontend/packages/knative-plugin/src/components/add/event-sources/form-fields/__tests__/SinkResources.spec.tsx b/frontend/packages/knative-plugin/src/components/add/event-sources/form-fields/__tests__/SinkResources.spec.tsx
index 9653ffa30cd..c663a4b9e50 100644
--- a/frontend/packages/knative-plugin/src/components/add/event-sources/form-fields/__tests__/SinkResources.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/add/event-sources/form-fields/__tests__/SinkResources.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import * as coFetchModule from '@console/dynamic-plugin-sdk/src/utils/fetch/console-fetch';
 import { ServiceModel } from '@console/internal/models';
diff --git a/frontend/packages/knative-plugin/src/components/eventing/__tests__/EventingListPage.spec.tsx b/frontend/packages/knative-plugin/src/components/eventing/__tests__/EventingListPage.spec.tsx
index e566a54785c..dad3e6b73ec 100644
--- a/frontend/packages/knative-plugin/src/components/eventing/__tests__/EventingListPage.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/eventing/__tests__/EventingListPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import * as Router from 'react-router-dom-v5-compat';
 import { NamespaceBar } from '@console/internal/components/namespace-bar';
diff --git a/frontend/packages/knative-plugin/src/components/knatify/__tests__/CreateKnatifyPage.spec.tsx b/frontend/packages/knative-plugin/src/components/knatify/__tests__/CreateKnatifyPage.spec.tsx
index 4bcb25adc06..30a0c16312e 100644
--- a/frontend/packages/knative-plugin/src/components/knatify/__tests__/CreateKnatifyPage.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/knatify/__tests__/CreateKnatifyPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { Formik } from 'formik';
 import * as Router from 'react-router-dom-v5-compat';
diff --git a/frontend/packages/knative-plugin/src/components/overview/__tests__/ConfigurationsOverviewList.spec.tsx b/frontend/packages/knative-plugin/src/components/overview/__tests__/ConfigurationsOverviewList.spec.tsx
index 33dcd6d6ef8..38dd453b72c 100644
--- a/frontend/packages/knative-plugin/src/components/overview/__tests__/ConfigurationsOverviewList.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/overview/__tests__/ConfigurationsOverviewList.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { sampleKnativeConfigurations } from '../../../topology/__tests__/topology-knative-test-data';
 import ConfigurationsOverviewList from '../ConfigurationsOverviewList';
diff --git a/frontend/packages/knative-plugin/src/components/overview/__tests__/ConfigurationsOverviewListItem.spec.tsx b/frontend/packages/knative-plugin/src/components/overview/__tests__/ConfigurationsOverviewListItem.spec.tsx
index 31f500c213b..88866096973 100644
--- a/frontend/packages/knative-plugin/src/components/overview/__tests__/ConfigurationsOverviewListItem.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/overview/__tests__/ConfigurationsOverviewListItem.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { ResourceLink } from '@console/internal/components/utils';
 import { referenceForModel } from '@console/internal/module/k8s';
diff --git a/frontend/packages/knative-plugin/src/components/overview/__tests__/EventSourceResources.spec.tsx b/frontend/packages/knative-plugin/src/components/overview/__tests__/EventSourceResources.spec.tsx
index f089dff19df..1016015a2f8 100644
--- a/frontend/packages/knative-plugin/src/components/overview/__tests__/EventSourceResources.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/overview/__tests__/EventSourceResources.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as _ from 'lodash';
 import { ResourceLink, ExternalLink } from '@console/internal/components/utils';
diff --git a/frontend/packages/knative-plugin/src/components/overview/__tests__/RevisionsOverviewList.spec.tsx b/frontend/packages/knative-plugin/src/components/overview/__tests__/RevisionsOverviewList.spec.tsx
index 06c68f02a1c..0ee64c125eb 100644
--- a/frontend/packages/knative-plugin/src/components/overview/__tests__/RevisionsOverviewList.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/overview/__tests__/RevisionsOverviewList.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button } from '@patternfly/react-core';
 import { shallow, ShallowWrapper } from 'enzyme';
 import * as _ from 'lodash';
diff --git a/frontend/packages/knative-plugin/src/components/overview/__tests__/RevisionsOverviewListItem.spec.tsx b/frontend/packages/knative-plugin/src/components/overview/__tests__/RevisionsOverviewListItem.spec.tsx
index 375c86814a2..581c0fbfc8d 100644
--- a/frontend/packages/knative-plugin/src/components/overview/__tests__/RevisionsOverviewListItem.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/overview/__tests__/RevisionsOverviewListItem.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import { ResourceLink } from '@console/internal/components/utils';
 import { useK8sWatchResource } from '@console/internal/components/utils/k8s-watch-hook';
diff --git a/frontend/packages/knative-plugin/src/components/overview/serving-list/__tests__/ServingListPage.spec.tsx b/frontend/packages/knative-plugin/src/components/overview/serving-list/__tests__/ServingListPage.spec.tsx
index a413a4b7733..aefafa3cabf 100644
--- a/frontend/packages/knative-plugin/src/components/overview/serving-list/__tests__/ServingListPage.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/overview/serving-list/__tests__/ServingListPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import * as Router from 'react-router-dom-v5-compat';
 import { NamespaceBar } from '@console/internal/components/namespace-bar';
diff --git a/frontend/packages/knative-plugin/src/components/pub-sub/details/__test__/SubscriptionDetails.spec.tsx b/frontend/packages/knative-plugin/src/components/pub-sub/details/__test__/SubscriptionDetails.spec.tsx
index ebd3d9cfbca..faa048d64a7 100644
--- a/frontend/packages/knative-plugin/src/components/pub-sub/details/__test__/SubscriptionDetails.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/pub-sub/details/__test__/SubscriptionDetails.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as _ from 'lodash';
 import { Conditions } from '@console/internal/components/conditions';
diff --git a/frontend/packages/knative-plugin/src/components/pub-sub/details/__test__/TriggerDetails.spec.tsx b/frontend/packages/knative-plugin/src/components/pub-sub/details/__test__/TriggerDetails.spec.tsx
index fef2ce3412e..607b4901908 100644
--- a/frontend/packages/knative-plugin/src/components/pub-sub/details/__test__/TriggerDetails.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/pub-sub/details/__test__/TriggerDetails.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as _ from 'lodash';
 import { Conditions } from '@console/internal/components/conditions';
diff --git a/frontend/packages/knative-plugin/src/components/revisions/__tests__/RevisionRow.spec.tsx b/frontend/packages/knative-plugin/src/components/revisions/__tests__/RevisionRow.spec.tsx
index 7fe80dc2703..8ad7362bccb 100644
--- a/frontend/packages/knative-plugin/src/components/revisions/__tests__/RevisionRow.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/revisions/__tests__/RevisionRow.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as _ from 'lodash';
 import { TableData, RowFunctionArgs } from '@console/internal/components/factory';
diff --git a/frontend/packages/knative-plugin/src/components/routes/__tests__/RouteRow.spec.tsx b/frontend/packages/knative-plugin/src/components/routes/__tests__/RouteRow.spec.tsx
index ceacbf6ddf2..60329744cd9 100644
--- a/frontend/packages/knative-plugin/src/components/routes/__tests__/RouteRow.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/routes/__tests__/RouteRow.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as _ from 'lodash';
 import { TableData, RowFunctionArgs } from '@console/internal/components/factory';
diff --git a/frontend/packages/knative-plugin/src/components/services/__tests__/ServiceRow.spec.tsx b/frontend/packages/knative-plugin/src/components/services/__tests__/ServiceRow.spec.tsx
index ae5cfbdce93..ab27ea65228 100644
--- a/frontend/packages/knative-plugin/src/components/services/__tests__/ServiceRow.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/services/__tests__/ServiceRow.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import * as _ from 'lodash';
 import { TableData, RowFunctionArgs } from '@console/internal/components/factory';
diff --git a/frontend/packages/knative-plugin/src/components/traffic-splitting/__tests__/TrafficModalRevisionsDropdownField.spec.tsx b/frontend/packages/knative-plugin/src/components/traffic-splitting/__tests__/TrafficModalRevisionsDropdownField.spec.tsx
index 18872b40386..8306a515625 100644
--- a/frontend/packages/knative-plugin/src/components/traffic-splitting/__tests__/TrafficModalRevisionsDropdownField.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/traffic-splitting/__tests__/TrafficModalRevisionsDropdownField.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { DropdownField } from '@console/shared';
 import { formikFormProps } from '@console/shared/src/test-utils/formik-props-utils';
diff --git a/frontend/packages/knative-plugin/src/components/traffic-splitting/__tests__/TrafficSplittingFields.spec.tsx b/frontend/packages/knative-plugin/src/components/traffic-splitting/__tests__/TrafficSplittingFields.spec.tsx
index 0ce45a69127..02c290e7b80 100644
--- a/frontend/packages/knative-plugin/src/components/traffic-splitting/__tests__/TrafficSplittingFields.spec.tsx
+++ b/frontend/packages/knative-plugin/src/components/traffic-splitting/__tests__/TrafficSplittingFields.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { MultiColumnField } from '@console/shared';
 import { formikFormProps } from '@console/shared/src/test-utils/formik-props-utils';
diff --git a/frontend/packages/knative-plugin/src/topology/components/decorators/getRevisionRouteDecorator.tsx b/frontend/packages/knative-plugin/src/topology/components/decorators/getRevisionRouteDecorator.tsx
index 62c59d2da2d..583a5bf1a9c 100644
--- a/frontend/packages/knative-plugin/src/topology/components/decorators/getRevisionRouteDecorator.tsx
+++ b/frontend/packages/knative-plugin/src/topology/components/decorators/getRevisionRouteDecorator.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Node } from '@patternfly/react-topology/src/types';
 import { TYPE_KNATIVE_REVISION } from '../../const';
 import RevisionRouteDecorator from './RevisionRouteDecorator';
diff --git a/frontend/packages/knative-plugin/src/topology/components/decorators/getServiceRouteDecorator.tsx b/frontend/packages/knative-plugin/src/topology/components/decorators/getServiceRouteDecorator.tsx
index 4688d1d3d87..2a07e44c22a 100644
--- a/frontend/packages/knative-plugin/src/topology/components/decorators/getServiceRouteDecorator.tsx
+++ b/frontend/packages/knative-plugin/src/topology/components/decorators/getServiceRouteDecorator.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Node } from '@patternfly/react-topology/src/types';
 import { ROUTE_DISABLED_ANNOTATION, ROUTE_URL_ANNOTATION } from '@console/topology/src/const';
 import { getResource } from '@console/topology/src/utils';
diff --git a/frontend/packages/knative-plugin/src/topology/sidebar/__tests__/KnativeOverviewSections.spec.tsx b/frontend/packages/knative-plugin/src/topology/sidebar/__tests__/KnativeOverviewSections.spec.tsx
index d5283f61200..2f6a54f8a22 100644
--- a/frontend/packages/knative-plugin/src/topology/sidebar/__tests__/KnativeOverviewSections.spec.tsx
+++ b/frontend/packages/knative-plugin/src/topology/sidebar/__tests__/KnativeOverviewSections.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as _ from 'lodash';
 import { ResourceSummary } from '@console/internal/components/utils';
diff --git a/frontend/packages/knative-plugin/src/topology/sidebar/__tests__/knative-resource-tab-sections.spec.tsx b/frontend/packages/knative-plugin/src/topology/sidebar/__tests__/knative-resource-tab-sections.spec.tsx
index 60b07665e05..d25e0d5b512 100644
--- a/frontend/packages/knative-plugin/src/topology/sidebar/__tests__/knative-resource-tab-sections.spec.tsx
+++ b/frontend/packages/knative-plugin/src/topology/sidebar/__tests__/knative-resource-tab-sections.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { configure, render, screen } from '@testing-library/react';
 import * as _ from 'lodash';
 import { EventSinkSourceSection } from '../knative-resource-tab-sections';
diff --git a/frontend/packages/knative-plugin/src/topology/sidebar/knative-connectors-tab-sections.tsx b/frontend/packages/knative-plugin/src/topology/sidebar/knative-connectors-tab-sections.tsx
index 81849924b12..1c88306328d 100644
--- a/frontend/packages/knative-plugin/src/topology/sidebar/knative-connectors-tab-sections.tsx
+++ b/frontend/packages/knative-plugin/src/topology/sidebar/knative-connectors-tab-sections.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Edge } from '@patternfly/react-topology';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
 import TopologyEdgeResourcesPanel from '@console/topology/src/components/side-bar/TopologyEdgeResourcesPanel';
diff --git a/frontend/packages/knative-plugin/src/topology/sidebar/knative-eventsource-tab-sections.tsx b/frontend/packages/knative-plugin/src/topology/sidebar/knative-eventsource-tab-sections.tsx
index 5e8bec87b1d..504953a9429 100644
--- a/frontend/packages/knative-plugin/src/topology/sidebar/knative-eventsource-tab-sections.tsx
+++ b/frontend/packages/knative-plugin/src/topology/sidebar/knative-eventsource-tab-sections.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
 import { ExternalLink, ResourceIcon } from '@console/internal/components/utils';
diff --git a/frontend/packages/knative-plugin/src/topology/sidebar/knative-pubsub-tab-sections.tsx b/frontend/packages/knative-plugin/src/topology/sidebar/knative-pubsub-tab-sections.tsx
index a51f9edc880..7227967ef32 100644
--- a/frontend/packages/knative-plugin/src/topology/sidebar/knative-pubsub-tab-sections.tsx
+++ b/frontend/packages/knative-plugin/src/topology/sidebar/knative-pubsub-tab-sections.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
 import EventPubSubResources from '../../components/overview/EventPubSubResources';
diff --git a/frontend/packages/knative-plugin/src/topology/sidebar/knative-revision-tab-sections.tsx b/frontend/packages/knative-plugin/src/topology/sidebar/knative-revision-tab-sections.tsx
index aa7a8c39522..0fdae26fc7f 100644
--- a/frontend/packages/knative-plugin/src/topology/sidebar/knative-revision-tab-sections.tsx
+++ b/frontend/packages/knative-plugin/src/topology/sidebar/knative-revision-tab-sections.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
 import TopologySideBarTabSection from '@console/topology/src/components/side-bar/TopologySideBarTabSection';
diff --git a/frontend/packages/knative-plugin/src/topology/sidebar/knative-service-tab-sections.tsx b/frontend/packages/knative-plugin/src/topology/sidebar/knative-service-tab-sections.tsx
index ad6b91a50bb..876ed823d55 100644
--- a/frontend/packages/knative-plugin/src/topology/sidebar/knative-service-tab-sections.tsx
+++ b/frontend/packages/knative-plugin/src/topology/sidebar/knative-service-tab-sections.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { AdapterDataType } from '@console/dynamic-plugin-sdk/src';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
diff --git a/frontend/packages/knative-plugin/src/utils/icons.tsx b/frontend/packages/knative-plugin/src/utils/icons.tsx
index 04562b89fba..fbdc5925ff3 100644
--- a/frontend/packages/knative-plugin/src/utils/icons.tsx
+++ b/frontend/packages/knative-plugin/src/utils/icons.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { LaptopCodeIcon, GitAltIcon } from '@patternfly/react-icons';
 import { createIcon } from '@patternfly/react-icons/dist/esm/createIcon';
 
diff --git a/frontend/packages/metal3-plugin/src/components/modals/StopNodeMaintenanceModal.tsx b/frontend/packages/metal3-plugin/src/components/modals/StopNodeMaintenanceModal.tsx
index 3f074e3d653..faf5f7bcf83 100644
--- a/frontend/packages/metal3-plugin/src/components/modals/StopNodeMaintenanceModal.tsx
+++ b/frontend/packages/metal3-plugin/src/components/modals/StopNodeMaintenanceModal.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { TFunction } from 'i18next';
 import { Trans } from 'react-i18next';
 import { confirmModal } from '@console/internal/components/modals/confirm-modal';
diff --git a/frontend/packages/metal3-plugin/src/plugin.tsx b/frontend/packages/metal3-plugin/src/plugin.tsx
index 0fdd20dae9d..409835b2bae 100644
--- a/frontend/packages/metal3-plugin/src/plugin.tsx
+++ b/frontend/packages/metal3-plugin/src/plugin.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { MaintenanceIcon } from '@patternfly/react-icons/dist/esm/icons/maintenance-icon';
 import * as _ from 'lodash';
 import '@console/internal/i18n.js';
diff --git a/frontend/packages/operator-lifecycle-manager-v1/src/components/ExtensionCatalog.tsx b/frontend/packages/operator-lifecycle-manager-v1/src/components/ExtensionCatalog.tsx
index 0fd5e9de22e..d5b366db5ea 100644
--- a/frontend/packages/operator-lifecycle-manager-v1/src/components/ExtensionCatalog.tsx
+++ b/frontend/packages/operator-lifecycle-manager-v1/src/components/ExtensionCatalog.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Page, PageSection } from '@patternfly/react-core';
 import Helmet from 'react-helmet';
 import { useTranslation } from 'react-i18next';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/catalog-source.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/catalog-source.spec.tsx
index 35ab9aff7d7..8bbd4b3d285 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/catalog-source.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/catalog-source.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import { safeLoad } from 'js-yaml';
 import * as _ from 'lodash';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/clusterserviceversion.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/clusterserviceversion.spec.tsx
index 59621277249..a7784a22404 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/clusterserviceversion.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/clusterserviceversion.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { CardTitle, CardBody, CardFooter } from '@patternfly/react-core';
 import { shallow, ShallowWrapper, mount, ReactWrapper } from 'enzyme';
 import * as _ from 'lodash';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/spec/index.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/spec/index.spec.tsx
index 87211462611..7ca21eb9071 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/spec/index.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/spec/index.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button } from '@patternfly/react-core';
 import { mount, ReactWrapper } from 'enzyme';
 import { Provider } from 'react-redux';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/spec/resource-requirements.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/spec/resource-requirements.spec.tsx
index 078dc3f9ee8..517e38f3706 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/spec/resource-requirements.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/spec/resource-requirements.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button } from '@patternfly/react-core';
 import { shallow, mount, ShallowWrapper, ReactWrapper } from 'enzyme';
 import * as _ from 'lodash';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/conditions.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/conditions.spec.tsx
index 69b8c73787f..6581d312f51 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/conditions.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/conditions.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
 import { Router } from 'react-router';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/index.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/index.spec.tsx
index 03ea16e7b41..617b1e87549 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/index.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/index.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount, ReactWrapper } from 'enzyme';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom-v5-compat';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/phase.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/phase.spec.tsx
index 8dc10957a7b..22b76a0f138 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/phase.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/phase.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper } from 'enzyme';
 import { Phase, PhaseProps } from './phase';
 
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/pods.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/pods.spec.tsx
index 780421c7041..bf903cf0336 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/pods.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/descriptors/status/pods.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ChartDonut } from '@patternfly/react-charts/victory';
 import { shallow, ShallowWrapper } from 'enzyme';
 import { SpecCapability, Descriptor } from '../types';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/install-plan.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/install-plan.spec.tsx
index 6f50e38b8b8..3f874f9e446 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/install-plan.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/install-plan.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button, Hint } from '@patternfly/react-core';
 import { shallow, ShallowWrapper } from 'enzyme';
 import * as _ from 'lodash';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/modals/installplan-approval-modal.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/modals/installplan-approval-modal.spec.tsx
index 5e4c60c671e..d2904493f0f 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/modals/installplan-approval-modal.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/modals/installplan-approval-modal.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ShallowWrapper, shallow } from 'enzyme';
 import * as _ from 'lodash';
 import {
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/modals/subscription-channel-modal.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/modals/subscription-channel-modal.spec.tsx
index bd24204c82e..2ec0227dd9e 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/modals/subscription-channel-modal.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/modals/subscription-channel-modal.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ShallowWrapper, shallow } from 'enzyme';
 import * as _ from 'lodash';
 import {
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/modals/uninstall-operator-modal.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/modals/uninstall-operator-modal.spec.tsx
index 1d609a0bdf7..a34860aaa29 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/modals/uninstall-operator-modal.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/modals/uninstall-operator-modal.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ReactWrapper, mount } from 'enzyme';
 import * as _ from 'lodash';
 import { act } from 'react-dom/test-utils';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/operand/create-operand.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/operand/create-operand.spec.tsx
index 379fcb909e2..37f72a6bc2c 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/operand/create-operand.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/operand/create-operand.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Alert, Button } from '@patternfly/react-core';
 import { shallow, ShallowWrapper } from 'enzyme';
 import { safeDump } from 'js-yaml';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/operand/index.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/operand/index.spec.tsx
index eae0c510e6c..f6142910292 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/operand/index.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/operand/index.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow, ShallowWrapper, mount, ReactWrapper } from 'enzyme';
 import * as _ from 'lodash';
 import { Provider } from 'react-redux';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/operator-group.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/operator-group.spec.tsx
index 7682e03c5b0..2313d266a0a 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/operator-group.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/operator-group.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as _ from 'lodash';
 import {
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/operator-hub/operator-hub.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/operator-hub/operator-hub.spec.tsx
index 033028cf247..d830d33373d 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/operator-hub/operator-hub.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/operator-hub/operator-hub.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import {
   CatalogTile,
   VerticalTabsTab,
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/subscription.spec.tsx b/frontend/packages/operator-lifecycle-manager/src/components/subscription.spec.tsx
index 57b519216a0..120353c0b6b 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/subscription.spec.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/subscription.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button } from '@patternfly/react-core';
 import { shallow, ShallowWrapper } from 'enzyme';
 import * as _ from 'lodash';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/topology/operator-link-tab-section.tsx b/frontend/packages/operator-lifecycle-manager/src/components/topology/operator-link-tab-section.tsx
index 3643ab75d76..5ccd64ba2ee 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/topology/operator-link-tab-section.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/topology/operator-link-tab-section.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
 import { ManagedByOperatorLink } from '@console/internal/components/utils/managed-by';
diff --git a/frontend/packages/operator-lifecycle-manager/src/components/topology/sidebar/resource-link.tsx b/frontend/packages/operator-lifecycle-manager/src/components/topology/sidebar/resource-link.tsx
index f25ebb5ff18..793c9a5c2d7 100644
--- a/frontend/packages/operator-lifecycle-manager/src/components/topology/sidebar/resource-link.tsx
+++ b/frontend/packages/operator-lifecycle-manager/src/components/topology/sidebar/resource-link.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { ManagedByOperatorResourceLink } from '@console/internal/components/utils/managed-by';
 import { TYPE_OPERATOR_BACKED_SERVICE } from '@console/topology/src/operators/components/const';
diff --git a/frontend/packages/pipelines-plugin/src/components/ListPropProvider.tsx b/frontend/packages/pipelines-plugin/src/components/ListPropProvider.tsx
index 88500c398d5..40d90a85d90 100644
--- a/frontend/packages/pipelines-plugin/src/components/ListPropProvider.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/ListPropProvider.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import * as _ from 'lodash';
 import { useSelector } from 'react-redux';
 import { K8sState } from '@console/dynamic-plugin-sdk/src/app/redux-types';
diff --git a/frontend/packages/pipelines-plugin/src/components/pipelineruns/triggered-by/ResourceKebab.tsx b/frontend/packages/pipelines-plugin/src/components/pipelineruns/triggered-by/ResourceKebab.tsx
index a171411146a..3bb9be47430 100644
--- a/frontend/packages/pipelines-plugin/src/components/pipelineruns/triggered-by/ResourceKebab.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/pipelineruns/triggered-by/ResourceKebab.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import * as _ from 'lodash';
 import { useTranslation } from 'react-i18next';
 import { Kebab, ResourceKebabProps } from '@console/internal/components/utils';
diff --git a/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/PipelineTabbedPage.spec.tsx b/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/PipelineTabbedPage.spec.tsx
index 616c7531c91..033c9684a82 100644
--- a/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/PipelineTabbedPage.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/PipelineTabbedPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as Router from 'react-router-dom-v5-compat';
 import NamespacedPage from '@console/dev-console/src/components/NamespacedPage';
diff --git a/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/PipelinesPage.spec.tsx b/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/PipelinesPage.spec.tsx
index 68e6a46dc7b..092cda9822c 100644
--- a/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/PipelinesPage.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/PipelinesPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as Router from 'react-router-dom-v5-compat';
 import CreateProjectListPage from '@console/dev-console/src/components/projects/CreateProjectListPage';
diff --git a/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/pipelineDetailsPage.spec.tsx b/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/pipelineDetailsPage.spec.tsx
index 68aaa94929e..d66d8f33ce5 100644
--- a/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/pipelineDetailsPage.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/pipelines/__tests__/pipelineDetailsPage.spec.tsx
@@ -85,16 +85,15 @@ describe('PipelineDetailsPage:', () => {
   });
   const renderPipelineDetailsPage = async () => {
     let wrapper: ReactWrapper;
-    await act(
-      async () =>
-        (wrapper = mount(
-          <BrowserRouter>
-            <Provider store={store}>
-              <PipelineDetailsPage {...PipelineDetailsPageProps} />
-            </Provider>
-          </BrowserRouter>,
-        )),
-    );
+    await act(async () => {
+      wrapper = mount(
+        <BrowserRouter>
+          <Provider store={store}>
+            <PipelineDetailsPage {...PipelineDetailsPageProps} />
+          </Provider>
+        </BrowserRouter>,
+      );
+    });
     return wrapper;
   };
 
diff --git a/frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-builder/modals/index.tsx b/frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-builder/modals/index.tsx
index c3255d85ebc..362ca462c7a 100644
--- a/frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-builder/modals/index.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-builder/modals/index.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Icon } from '@patternfly/react-core';
 import { ExclamationTriangleIcon } from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
 import { t_global_icon_color_status_warning_default as warningColor } from '@patternfly/react-tokens';
diff --git a/frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/__tests__/PipelineMetricsUnsupported.spec.tsx b/frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/__tests__/PipelineMetricsUnsupported.spec.tsx
index 8a956a073be..649390741d6 100644
--- a/frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/__tests__/PipelineMetricsUnsupported.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/__tests__/PipelineMetricsUnsupported.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { PipelineMetricsLevel } from '../../const';
 import PipelineMetricsQuickstart from '../PipelineMetricsQuickstart';
diff --git a/frontend/packages/pipelines-plugin/src/components/quicksearch/PipelineQuickSearchDetails.tsx b/frontend/packages/pipelines-plugin/src/components/quicksearch/PipelineQuickSearchDetails.tsx
index 2b460ee54b2..d455a18c14b 100644
--- a/frontend/packages/pipelines-plugin/src/components/quicksearch/PipelineQuickSearchDetails.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/quicksearch/PipelineQuickSearchDetails.tsx
@@ -130,7 +130,9 @@ const PipelineQuickSearchDetails: React.FC<QuickSearchDetailsRendererProps> = ({
       debouncedLoadDetails();
     }
 
-    return () => (mounted = false);
+    return () => {
+      mounted = false;
+    };
   }, [resetVersions, selectedItem]);
 
   React.useEffect(() => {
diff --git a/frontend/packages/pipelines-plugin/src/components/quicksearch/__tests__/PipelineQuickSearchVersionDropdown.spec.tsx b/frontend/packages/pipelines-plugin/src/components/quicksearch/__tests__/PipelineQuickSearchVersionDropdown.spec.tsx
index 26d4b41b364..9247cd1379c 100644
--- a/frontend/packages/pipelines-plugin/src/components/quicksearch/__tests__/PipelineQuickSearchVersionDropdown.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/quicksearch/__tests__/PipelineQuickSearchVersionDropdown.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import {
   render,
   cleanup,
diff --git a/frontend/packages/pipelines-plugin/src/components/quicksearch/__tests__/PipelineQuicksearchDetails.spec.tsx b/frontend/packages/pipelines-plugin/src/components/quicksearch/__tests__/PipelineQuicksearchDetails.spec.tsx
index e839accd3ea..72b6c4005dd 100644
--- a/frontend/packages/pipelines-plugin/src/components/quicksearch/__tests__/PipelineQuicksearchDetails.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/quicksearch/__tests__/PipelineQuicksearchDetails.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import {
   render,
   fireEvent,
diff --git a/frontend/packages/pipelines-plugin/src/components/repository/__tests__/RepositoryDetails.spec.tsx b/frontend/packages/pipelines-plugin/src/components/repository/__tests__/RepositoryDetails.spec.tsx
index b34372627e4..6f72267337d 100644
--- a/frontend/packages/pipelines-plugin/src/components/repository/__tests__/RepositoryDetails.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/repository/__tests__/RepositoryDetails.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { mockRepositories } from '../../../test-data/pipeline-data';
 import RepositoryDetails from '../RepositoryDetails';
diff --git a/frontend/packages/pipelines-plugin/src/components/repository/__tests__/RepositoryLinkList.spec.tsx b/frontend/packages/pipelines-plugin/src/components/repository/__tests__/RepositoryLinkList.spec.tsx
index b27c366ebcc..f5d93dcf835 100644
--- a/frontend/packages/pipelines-plugin/src/components/repository/__tests__/RepositoryLinkList.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/repository/__tests__/RepositoryLinkList.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { PipeLineRunWithRepoMetadata } from '../../../test-data/pipeline-data';
 import { getLabelValue, sanitizeBranchName } from '../repository-utils';
diff --git a/frontend/packages/pipelines-plugin/src/components/repository/__tests__/repository-utils.spec.tsx b/frontend/packages/pipelines-plugin/src/components/repository/__tests__/repository-utils.spec.tsx
index dd0ab8a50e4..7accfc5fda2 100644
--- a/frontend/packages/pipelines-plugin/src/components/repository/__tests__/repository-utils.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/repository/__tests__/repository-utils.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BitbucketIcon } from '@patternfly/react-icons/dist/esm/icons/bitbucket-icon';
 import { GitAltIcon } from '@patternfly/react-icons/dist/esm/icons/git-alt-icon';
 import { GithubIcon } from '@patternfly/react-icons/dist/esm/icons/github-icon';
diff --git a/frontend/packages/pipelines-plugin/src/components/repository/repository-utils.tsx b/frontend/packages/pipelines-plugin/src/components/repository/repository-utils.tsx
index 742ba23b201..d17a37b383d 100644
--- a/frontend/packages/pipelines-plugin/src/components/repository/repository-utils.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/repository/repository-utils.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BitbucketIcon } from '@patternfly/react-icons/dist/esm/icons/bitbucket-icon';
 import { GitAltIcon } from '@patternfly/react-icons/dist/esm/icons/git-alt-icon';
 import { GithubIcon } from '@patternfly/react-icons/dist/esm/icons/github-icon';
diff --git a/frontend/packages/pipelines-plugin/src/components/repository/sections/RepositoryOverview.tsx b/frontend/packages/pipelines-plugin/src/components/repository/sections/RepositoryOverview.tsx
index 2feb455b465..fed946560e0 100644
--- a/frontend/packages/pipelines-plugin/src/components/repository/sections/RepositoryOverview.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/repository/sections/RepositoryOverview.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import {
   Alert,
   AlertVariant,
diff --git a/frontend/packages/pipelines-plugin/src/components/shared/results/__tests__/ResultsList.spec.tsx b/frontend/packages/pipelines-plugin/src/components/shared/results/__tests__/ResultsList.spec.tsx
index 6ff0d21a553..04da84f3bf2 100644
--- a/frontend/packages/pipelines-plugin/src/components/shared/results/__tests__/ResultsList.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/shared/results/__tests__/ResultsList.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { EmptyState } from '@patternfly/react-core';
 import { Table } from '@patternfly/react-table';
 import { ShallowWrapper, shallow } from 'enzyme';
diff --git a/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/EmptyDirectoriesSection.spec.tsx b/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/EmptyDirectoriesSection.spec.tsx
index e2e35d1b490..bc4bd0d31c3 100644
--- a/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/EmptyDirectoriesSection.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/EmptyDirectoriesSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { PipelineRunWorkspace } from '../../../../types';
 import EmptyDirectoriesSection from '../EmptyDirectoriesSection';
diff --git a/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/WorkspaceDefinitionList.spec.tsx b/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/WorkspaceDefinitionList.spec.tsx
index 3fbb15efaeb..e93675201bf 100644
--- a/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/WorkspaceDefinitionList.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/WorkspaceDefinitionList.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { TektonWorkspace } from '../../../../types';
 import WorkspaceDefinitionList from '../WorkspaceDefinitionList';
diff --git a/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/WorkspaceResourcesSection.spec.tsx b/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/WorkspaceResourcesSection.spec.tsx
index ce88155d2ec..c198f9be9e3 100644
--- a/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/WorkspaceResourcesSection.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/shared/workspaces/__tests__/WorkspaceResourcesSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { ResourceLink } from '@console/internal/components/utils';
 import { PipelineRunWorkspace } from '../../../../types';
diff --git a/frontend/packages/pipelines-plugin/src/components/taskruns/TaskRunDetailsStatus.tsx b/frontend/packages/pipelines-plugin/src/components/taskruns/TaskRunDetailsStatus.tsx
index f827d830b8e..5c20153c764 100644
--- a/frontend/packages/pipelines-plugin/src/components/taskruns/TaskRunDetailsStatus.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/taskruns/TaskRunDetailsStatus.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { ResourceLink, Timestamp } from '@console/internal/components/utils';
 import { PodModel } from '@console/internal/models';
diff --git a/frontend/packages/pipelines-plugin/src/components/taskruns/list-page/__tests__/TaskRunsRow.spec.tsx b/frontend/packages/pipelines-plugin/src/components/taskruns/list-page/__tests__/TaskRunsRow.spec.tsx
index b02a67ad228..9970b69db6a 100644
--- a/frontend/packages/pipelines-plugin/src/components/taskruns/list-page/__tests__/TaskRunsRow.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/taskruns/list-page/__tests__/TaskRunsRow.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { TableData, RowFunctionArgs } from '@console/internal/components/factory';
 import { ResourceLink, Timestamp } from '@console/internal/components/utils';
diff --git a/frontend/packages/pipelines-plugin/src/components/tasks/list-page/ClusterTasksPage.tsx b/frontend/packages/pipelines-plugin/src/components/tasks/list-page/ClusterTasksPage.tsx
index 87d23fec7a1..0c076efadad 100644
--- a/frontend/packages/pipelines-plugin/src/components/tasks/list-page/ClusterTasksPage.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/tasks/list-page/ClusterTasksPage.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import Helmet from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { DefaultPage } from '@console/internal/components/default-resource';
diff --git a/frontend/packages/pipelines-plugin/src/components/tasks/list-page/TasksPage.tsx b/frontend/packages/pipelines-plugin/src/components/tasks/list-page/TasksPage.tsx
index 8fd27c7ff57..892d427f713 100644
--- a/frontend/packages/pipelines-plugin/src/components/tasks/list-page/TasksPage.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/tasks/list-page/TasksPage.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import Helmet from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { DefaultPage } from '@console/internal/components/default-resource';
diff --git a/frontend/packages/pipelines-plugin/src/components/triggers-lists/ClusterTriggerBindingsPage.tsx b/frontend/packages/pipelines-plugin/src/components/triggers-lists/ClusterTriggerBindingsPage.tsx
index f5ce99866f9..1d9f0eb0b50 100644
--- a/frontend/packages/pipelines-plugin/src/components/triggers-lists/ClusterTriggerBindingsPage.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/triggers-lists/ClusterTriggerBindingsPage.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import Helmet from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { DefaultPage } from '@console/internal/components/default-resource';
diff --git a/frontend/packages/pipelines-plugin/src/components/triggers-lists/EventListnersPage.tsx b/frontend/packages/pipelines-plugin/src/components/triggers-lists/EventListnersPage.tsx
index fe386b60588..6230ffd5921 100644
--- a/frontend/packages/pipelines-plugin/src/components/triggers-lists/EventListnersPage.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/triggers-lists/EventListnersPage.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import Helmet from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { DefaultPage } from '@console/internal/components/default-resource';
diff --git a/frontend/packages/pipelines-plugin/src/components/triggers-lists/TriggerBindingsPage.tsx b/frontend/packages/pipelines-plugin/src/components/triggers-lists/TriggerBindingsPage.tsx
index aa4ae5ec0ae..4728e6567bd 100644
--- a/frontend/packages/pipelines-plugin/src/components/triggers-lists/TriggerBindingsPage.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/triggers-lists/TriggerBindingsPage.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import Helmet from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { DefaultPage } from '@console/internal/components/default-resource';
diff --git a/frontend/packages/pipelines-plugin/src/components/triggers-lists/TriggerTemplatesPage.tsx b/frontend/packages/pipelines-plugin/src/components/triggers-lists/TriggerTemplatesPage.tsx
index 885324c977a..2c4c1fc79ed 100644
--- a/frontend/packages/pipelines-plugin/src/components/triggers-lists/TriggerTemplatesPage.tsx
+++ b/frontend/packages/pipelines-plugin/src/components/triggers-lists/TriggerTemplatesPage.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import Helmet from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { DefaultPage } from '@console/internal/components/default-resource';
diff --git a/frontend/packages/pipelines-plugin/src/topology/build-decorators/__tests__/PipelineRunDecorator.spec.tsx b/frontend/packages/pipelines-plugin/src/topology/build-decorators/__tests__/PipelineRunDecorator.spec.tsx
index 694590575d9..2b2dd35a8ce 100644
--- a/frontend/packages/pipelines-plugin/src/topology/build-decorators/__tests__/PipelineRunDecorator.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/topology/build-decorators/__tests__/PipelineRunDecorator.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { Link } from 'react-router-dom-v5-compat';
 import * as rbacModule from '@console/internal/components/utils/rbac';
diff --git a/frontend/packages/pipelines-plugin/src/topology/build-decorators/getPipelineRunDecorator.tsx b/frontend/packages/pipelines-plugin/src/topology/build-decorators/getPipelineRunDecorator.tsx
index 920fffcf05a..52294c947cd 100644
--- a/frontend/packages/pipelines-plugin/src/topology/build-decorators/getPipelineRunDecorator.tsx
+++ b/frontend/packages/pipelines-plugin/src/topology/build-decorators/getPipelineRunDecorator.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Node } from '@patternfly/react-topology';
 import PipelineRunDecorator from './PipelineRunDecorator';
 
diff --git a/frontend/packages/pipelines-plugin/src/topology/pipeline-tab-section.tsx b/frontend/packages/pipelines-plugin/src/topology/pipeline-tab-section.tsx
index 9b8ec797a3f..00d17ff46a4 100644
--- a/frontend/packages/pipelines-plugin/src/topology/pipeline-tab-section.tsx
+++ b/frontend/packages/pipelines-plugin/src/topology/pipeline-tab-section.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
 import TopologySideBarTabSection from '@console/topology/src/components/side-bar/TopologySideBarTabSection';
diff --git a/frontend/packages/pipelines-plugin/src/utils/__tests__/render-utils.spec.tsx b/frontend/packages/pipelines-plugin/src/utils/__tests__/render-utils.spec.tsx
index d312288b94d..c3417e3f3ab 100644
--- a/frontend/packages/pipelines-plugin/src/utils/__tests__/render-utils.spec.tsx
+++ b/frontend/packages/pipelines-plugin/src/utils/__tests__/render-utils.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { ExternalLink } from '@console/internal/components/utils';
 import { handleURLs, GROUP_MATCH_REGEXP } from '../render-utils';
diff --git a/frontend/packages/pipelines-plugin/src/utils/icons.tsx b/frontend/packages/pipelines-plugin/src/utils/icons.tsx
index 557527b83f1..f59f505bf94 100644
--- a/frontend/packages/pipelines-plugin/src/utils/icons.tsx
+++ b/frontend/packages/pipelines-plugin/src/utils/icons.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { createIcon } from '@patternfly/react-icons/dist/esm/createIcon';
 
 export const PipelineIcon = createIcon({
diff --git a/frontend/packages/pipelines-plugin/src/utils/pipeline-actions.tsx b/frontend/packages/pipelines-plugin/src/utils/pipeline-actions.tsx
index 7d1952cbbb8..ce242f46ec8 100644
--- a/frontend/packages/pipelines-plugin/src/utils/pipeline-actions.tsx
+++ b/frontend/packages/pipelines-plugin/src/utils/pipeline-actions.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import i18n from 'i18next';
 import * as _ from 'lodash';
 import { SemVer } from 'semver';
diff --git a/frontend/packages/service-binding-plugin/src/components/service-binding-list/__tests__/ServiceBindingListPage.spec.tsx b/frontend/packages/service-binding-plugin/src/components/service-binding-list/__tests__/ServiceBindingListPage.spec.tsx
index ca33dbe8837..763591f0a50 100644
--- a/frontend/packages/service-binding-plugin/src/components/service-binding-list/__tests__/ServiceBindingListPage.spec.tsx
+++ b/frontend/packages/service-binding-plugin/src/components/service-binding-list/__tests__/ServiceBindingListPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { render } from '@testing-library/react';
 import { FilterValue } from '@console/dynamic-plugin-sdk/src/extensions/console-types';
 import { ListPage, ListPageProps } from '@console/internal/components/factory';
diff --git a/frontend/packages/service-binding-plugin/src/components/service-binding-status/ServiceBindingStatus.tsx b/frontend/packages/service-binding-plugin/src/components/service-binding-status/ServiceBindingStatus.tsx
index ae0e4f2bbc2..b3fa7582c0f 100644
--- a/frontend/packages/service-binding-plugin/src/components/service-binding-status/ServiceBindingStatus.tsx
+++ b/frontend/packages/service-binding-plugin/src/components/service-binding-status/ServiceBindingStatus.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import Status from '@console/dynamic-plugin-sdk/src/app/components/status/Status';
 import { ComputedServiceBindingStatus, ServiceBinding } from '../../types';
diff --git a/frontend/packages/service-binding-plugin/src/components/service-binding-status/__tests__/ServiceBindingStatus.spec.tsx b/frontend/packages/service-binding-plugin/src/components/service-binding-status/__tests__/ServiceBindingStatus.spec.tsx
index ef46abfaecd..11f442f4310 100644
--- a/frontend/packages/service-binding-plugin/src/components/service-binding-status/__tests__/ServiceBindingStatus.spec.tsx
+++ b/frontend/packages/service-binding-plugin/src/components/service-binding-status/__tests__/ServiceBindingStatus.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { render } from '@testing-library/react';
 import {
   allConnectedServiceBindings,
diff --git a/frontend/packages/shipwright-plugin/src/components/build-decorators/getShipWrightBuildDecorator.tsx b/frontend/packages/shipwright-plugin/src/components/build-decorators/getShipWrightBuildDecorator.tsx
index 4bfc580ac2c..81406aa4f59 100644
--- a/frontend/packages/shipwright-plugin/src/components/build-decorators/getShipWrightBuildDecorator.tsx
+++ b/frontend/packages/shipwright-plugin/src/components/build-decorators/getShipWrightBuildDecorator.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Node } from '@patternfly/react-topology';
 import ShipwrightBuildDecorator from './ShipwrightBuildDecorator';
 
diff --git a/frontend/packages/shipwright-plugin/src/components/build-tabsection/useBuildSideBarTabSection.tsx b/frontend/packages/shipwright-plugin/src/components/build-tabsection/useBuildSideBarTabSection.tsx
index 97e1684059c..5d476b514e9 100644
--- a/frontend/packages/shipwright-plugin/src/components/build-tabsection/useBuildSideBarTabSection.tsx
+++ b/frontend/packages/shipwright-plugin/src/components/build-tabsection/useBuildSideBarTabSection.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
 import TopologySideBarTabSection from '@console/topology/src/components/side-bar/TopologySideBarTabSection';
diff --git a/frontend/packages/shipwright-plugin/src/components/buildrun-duration/__tests__/BuildRunDuration.spec.tsx b/frontend/packages/shipwright-plugin/src/components/buildrun-duration/__tests__/BuildRunDuration.spec.tsx
index eac7491998e..b14d31c5abc 100644
--- a/frontend/packages/shipwright-plugin/src/components/buildrun-duration/__tests__/BuildRunDuration.spec.tsx
+++ b/frontend/packages/shipwright-plugin/src/components/buildrun-duration/__tests__/BuildRunDuration.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { render } from '@testing-library/react';
 import { incompleteBuildRun } from '../../../__tests__/mock-data-v1beta1';
 import { BuildRun } from '../../../types';
diff --git a/frontend/packages/shipwright-plugin/src/components/buildrun-status/__tests__/BuildRunStatus.spec.tsx b/frontend/packages/shipwright-plugin/src/components/buildrun-status/__tests__/BuildRunStatus.spec.tsx
index 26efdbc6763..a78cda576bf 100644
--- a/frontend/packages/shipwright-plugin/src/components/buildrun-status/__tests__/BuildRunStatus.spec.tsx
+++ b/frontend/packages/shipwright-plugin/src/components/buildrun-status/__tests__/BuildRunStatus.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { render } from '@testing-library/react';
 import {
   incompleteBuildRun,
diff --git a/frontend/packages/topology/src/__tests__/DataModelProvider.spec.tsx b/frontend/packages/topology/src/__tests__/DataModelProvider.spec.tsx
index 0ca9b41feda..0751e12ac9a 100644
--- a/frontend/packages/topology/src/__tests__/DataModelProvider.spec.tsx
+++ b/frontend/packages/topology/src/__tests__/DataModelProvider.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount, ReactWrapper } from 'enzyme';
 import { Provider } from 'react-redux';
 import * as utils from '@console/internal/components/utils/url-poll-hook';
diff --git a/frontend/packages/topology/src/__tests__/Graph.spec.tsx b/frontend/packages/topology/src/__tests__/Graph.spec.tsx
index e123d9240ed..dc6da2d54ec 100644
--- a/frontend/packages/topology/src/__tests__/Graph.spec.tsx
+++ b/frontend/packages/topology/src/__tests__/Graph.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { ConnectedTopologyView } from '../components/page/TopologyView';
 import { baseDataModelGetter } from '../data-transforms/data-transformer';
diff --git a/frontend/packages/topology/src/__tests__/TopologyPage.spec.tsx b/frontend/packages/topology/src/__tests__/TopologyPage.spec.tsx
index b1d92f7f1b7..e07381f5f5d 100644
--- a/frontend/packages/topology/src/__tests__/TopologyPage.spec.tsx
+++ b/frontend/packages/topology/src/__tests__/TopologyPage.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as Router from 'react-router-dom-v5-compat';
 import NamespacedPage from '@console/dev-console/src/components/NamespacedPage';
diff --git a/frontend/packages/topology/src/__tests__/TopologySideBar.spec.tsx b/frontend/packages/topology/src/__tests__/TopologySideBar.spec.tsx
index 6a25c160e7c..2acaf7d2a09 100644
--- a/frontend/packages/topology/src/__tests__/TopologySideBar.spec.tsx
+++ b/frontend/packages/topology/src/__tests__/TopologySideBar.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { useUserSettings } from '@console/shared';
 import CloseButton from '@console/shared/src/components/close-button';
diff --git a/frontend/packages/topology/src/components/application-panel/__tests__/ApplicationGroupResource.spec.tsx b/frontend/packages/topology/src/components/application-panel/__tests__/ApplicationGroupResource.spec.tsx
index 55563e2c35f..587f52071e9 100644
--- a/frontend/packages/topology/src/components/application-panel/__tests__/ApplicationGroupResource.spec.tsx
+++ b/frontend/packages/topology/src/components/application-panel/__tests__/ApplicationGroupResource.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { Link } from 'react-router-dom-v5-compat';
 import { K8sResourceKind } from '@console/internal/module/k8s';
diff --git a/frontend/packages/topology/src/components/application-panel/application-resource-link.tsx b/frontend/packages/topology/src/components/application-panel/application-resource-link.tsx
index 5eb84d3d656..59690496b15 100644
--- a/frontend/packages/topology/src/components/application-panel/application-resource-link.tsx
+++ b/frontend/packages/topology/src/components/application-panel/application-resource-link.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { ResourceIcon } from '@console/internal/components/utils';
 import { TYPE_APPLICATION_GROUP } from '../../const';
diff --git a/frontend/packages/topology/src/components/application-panel/application-resource-tab-section.tsx b/frontend/packages/topology/src/components/application-panel/application-resource-tab-section.tsx
index e9eff147448..b90798fdcdb 100644
--- a/frontend/packages/topology/src/components/application-panel/application-resource-tab-section.tsx
+++ b/frontend/packages/topology/src/components/application-panel/application-resource-tab-section.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
 import { TYPE_APPLICATION_GROUP } from '../../const';
diff --git a/frontend/packages/topology/src/components/export-app/__tests__/ExportApplication.spec.tsx b/frontend/packages/topology/src/components/export-app/__tests__/ExportApplication.spec.tsx
index 9c73065f254..629ac348b4c 100644
--- a/frontend/packages/topology/src/components/export-app/__tests__/ExportApplication.spec.tsx
+++ b/frontend/packages/topology/src/components/export-app/__tests__/ExportApplication.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { act } from 'react-dom/test-utils';
 import * as flagsModule from '@console/dynamic-plugin-sdk/src/utils/flags';
diff --git a/frontend/packages/topology/src/components/export-app/__tests__/ExportApplicationModal.spec.tsx b/frontend/packages/topology/src/components/export-app/__tests__/ExportApplicationModal.spec.tsx
index 4d3e6805b6d..15810acd9f5 100644
--- a/frontend/packages/topology/src/components/export-app/__tests__/ExportApplicationModal.spec.tsx
+++ b/frontend/packages/topology/src/components/export-app/__tests__/ExportApplicationModal.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import * as _ from 'lodash';
 import { act } from 'react-dom/test-utils';
diff --git a/frontend/packages/topology/src/components/export-app/__tests__/ExportViewLogButton.spec.tsx b/frontend/packages/topology/src/components/export-app/__tests__/ExportViewLogButton.spec.tsx
index 779c4270da3..317cf03da9a 100644
--- a/frontend/packages/topology/src/components/export-app/__tests__/ExportViewLogButton.spec.tsx
+++ b/frontend/packages/topology/src/components/export-app/__tests__/ExportViewLogButton.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button, Tooltip } from '@patternfly/react-core';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
diff --git a/frontend/packages/topology/src/components/graph-view/components/nodeContextMenu.tsx b/frontend/packages/topology/src/components/graph-view/components/nodeContextMenu.tsx
index 77bc7cfa640..eca7f9c54cb 100644
--- a/frontend/packages/topology/src/components/graph-view/components/nodeContextMenu.tsx
+++ b/frontend/packages/topology/src/components/graph-view/components/nodeContextMenu.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Node, Graph, isGraph } from '@patternfly/react-topology';
 import { ActionServiceProvider } from '@console/shared';
 import { TYPE_APPLICATION_GROUP } from '@console/topology/src/const';
diff --git a/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/__tests__/Decorator.spec.tsx b/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/__tests__/Decorator.spec.tsx
index 1861a23aa2f..fa541ff9282 100644
--- a/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/__tests__/Decorator.spec.tsx
+++ b/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/__tests__/Decorator.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { Link } from 'react-router-dom-v5-compat';
 import Decorator from '../Decorator';
diff --git a/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/__tests__/URLDecorator.spec.tsx b/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/__tests__/URLDecorator.spec.tsx
index 1f4519efcff..28566661339 100644
--- a/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/__tests__/URLDecorator.spec.tsx
+++ b/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/__tests__/URLDecorator.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { useRoutesWatcher } from '@console/shared';
 import { sampleDeployments } from '@console/shared/src/utils/__tests__/test-resource-data';
diff --git a/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/defaultDecorators.tsx b/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/defaultDecorators.tsx
index ad3b363b081..976c421af59 100644
--- a/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/defaultDecorators.tsx
+++ b/frontend/packages/topology/src/components/graph-view/components/nodes/decorators/defaultDecorators.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Node } from '@patternfly/react-topology';
 import BuildDecorator from './BuildDecorator';
 import EditDecorator from './EditDecorator';
diff --git a/frontend/packages/topology/src/components/side-bar/__tests__/TopologyEdgeResourcesPanel.spec.tsx b/frontend/packages/topology/src/components/side-bar/__tests__/TopologyEdgeResourcesPanel.spec.tsx
index ea952f39876..036ff7eca70 100644
--- a/frontend/packages/topology/src/components/side-bar/__tests__/TopologyEdgeResourcesPanel.spec.tsx
+++ b/frontend/packages/topology/src/components/side-bar/__tests__/TopologyEdgeResourcesPanel.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { useK8sWatchResource } from '@console/internal/components/utils/k8s-watch-hook';
 import { TYPE_SERVICE_BINDING, TYPE_TRAFFIC_CONNECTOR } from '../../../const';
diff --git a/frontend/packages/topology/src/components/svg/SvgCircledIcon.tsx b/frontend/packages/topology/src/components/svg/SvgCircledIcon.tsx
index 276abb75c21..5de938793ef 100644
--- a/frontend/packages/topology/src/components/svg/SvgCircledIcon.tsx
+++ b/frontend/packages/topology/src/components/svg/SvgCircledIcon.tsx
@@ -16,57 +16,56 @@ interface SvgTypedIconProps {
 
 const FILTER_ID = 'SvgTypedIconDropShadowFilterId';
 
-const CircledIcon: React.FC<SvgTypedIconProps> = (
-  { className, x, y, width, height, iconClass, icon, padding = 4 },
-  circleRef,
-) => {
-  const [typedIconSize, typedIconRef] = useSize([]);
+const CircledIcon = React.forwardRef<SVGCircleElement, SvgTypedIconProps>(
+  ({ className, x, y, width, height, iconClass, icon, padding = 4 }, circleRef) => {
+    const [typedIconSize, typedIconRef] = useSize([]);
 
-  let iconWidth = 0;
-  let iconHeight = 0;
+    let iconWidth = 0;
+    let iconHeight = 0;
 
-  if (typedIconSize) {
-    ({ width: iconWidth, height: iconHeight } = typedIconSize);
-  }
+    if (typedIconSize) {
+      ({ width: iconWidth, height: iconHeight } = typedIconSize);
+    }
 
-  return (
-    <g className={className}>
-      <SvgDropShadowFilter id={FILTER_ID} />
-      <circle
-        key={`circle-${FILTER_ID}`}
-        ref={circleRef}
-        filter={createSvgIdUrl(FILTER_ID)}
-        cx={x - iconWidth / 2}
-        cy={y + iconHeight / 2}
-        r={iconWidth / 2 + padding}
-      />
-      {icon ? (
-        <g ref={typedIconRef}>
-          <foreignObject
-            key={`image-${FILTER_ID}`}
-            x={x - iconWidth + 4}
-            y={y}
-            width={width}
-            height={height}
-          >
-            {icon}
-          </foreignObject>
-        </g>
-      ) : (
-        <g ref={typedIconRef}>
-          <image
-            key={`image-${FILTER_ID}`}
-            x={x - iconWidth}
-            y={y}
-            width={width}
-            height={height}
-            xlinkHref={getImageForIconClass(iconClass) || iconClass}
-            filter={createSvgIdUrl(FILTER_ID)}
-          />
-        </g>
-      )}
-    </g>
-  );
-};
+    return (
+      <g className={className}>
+        <SvgDropShadowFilter id={FILTER_ID} />
+        <circle
+          key={`circle-${FILTER_ID}`}
+          ref={circleRef}
+          filter={createSvgIdUrl(FILTER_ID)}
+          cx={x - iconWidth / 2}
+          cy={y + iconHeight / 2}
+          r={iconWidth / 2 + padding}
+        />
+        {icon ? (
+          <g ref={typedIconRef}>
+            <foreignObject
+              key={`image-${FILTER_ID}`}
+              x={x - iconWidth + 4}
+              y={y}
+              width={width}
+              height={height}
+            >
+              {icon}
+            </foreignObject>
+          </g>
+        ) : (
+          <g ref={typedIconRef}>
+            <image
+              key={`image-${FILTER_ID}`}
+              x={x - iconWidth}
+              y={y}
+              width={width}
+              height={height}
+              xlinkHref={getImageForIconClass(iconClass) || iconClass}
+              filter={createSvgIdUrl(FILTER_ID)}
+            />
+          </g>
+        )}
+      </g>
+    );
+  },
+);
 
-export default React.forwardRef(CircledIcon);
+export default CircledIcon;
diff --git a/frontend/packages/topology/src/components/svg/SvgResourceIcon.tsx b/frontend/packages/topology/src/components/svg/SvgResourceIcon.tsx
index 586b90b4c5f..15832aebab0 100644
--- a/frontend/packages/topology/src/components/svg/SvgResourceIcon.tsx
+++ b/frontend/packages/topology/src/components/svg/SvgResourceIcon.tsx
@@ -20,59 +20,57 @@ function getKindStringAndAbbreviation(kind: string) {
   return { kindStr, kindAbbr, kindColor };
 }
 
-const ForwardSvgResourceIcon: React.FC<ResourceIconProps> = (
-  { kind, x, y, leftJustified },
-  iconRef,
-) => {
-  const { kindAbbr, kindStr, kindColor } = getKindStringAndAbbreviation(kind);
-  const [textSize, textRef] = useSize([]);
+const SvgResourceIcon = React.forwardRef<SVGRectElement, ResourceIconProps>(
+  ({ x, y, kind, leftJustified }, iconRef) => {
+    const { kindAbbr, kindStr, kindColor } = getKindStringAndAbbreviation(kind);
+    const [textSize, textRef] = useSize([]);
 
-  let rect = null;
-  let paddingX = 0;
-  let paddingY = 0;
-  let width = 0;
-  let height = 0;
+    let rect = null;
+    let paddingX = 0;
+    let paddingY = 0;
+    let width = 0;
+    let height = 0;
 
-  if (textSize) {
-    ({ height, width } = textSize);
-    paddingX = height / 2;
-    paddingY = height / 14;
-    height += paddingY * 2;
-    rect = (
-      <rect
-        fill={kindColor}
-        ref={iconRef}
-        x={x - (leftJustified ? 0 : paddingX + width / 2)}
-        width={textSize.width + paddingX * 2}
-        y={y - (leftJustified ? 0 : paddingY + textSize.height / 2)}
-        height={height}
-        rx={height / 2}
-        ry={height / 2}
-      />
-    );
-  }
+    if (textSize) {
+      ({ height, width } = textSize);
+      paddingX = height / 2;
+      paddingY = height / 14;
+      height += paddingY * 2;
+      rect = (
+        <rect
+          fill={kindColor}
+          ref={iconRef}
+          x={x - (leftJustified ? 0 : paddingX + width / 2)}
+          width={textSize.width + paddingX * 2}
+          y={y - (leftJustified ? 0 : paddingY + textSize.height / 2)}
+          height={height}
+          rx={height / 2}
+          ry={height / 2}
+        />
+      );
+    }
 
-  return (
-    <g
-      className={cx('odc-resource-icon', {
-        [`odc-resource-icon-${kindStr.toLowerCase()}`]: !kindColor,
-      })}
-      data-test={`icon ${kindStr.toLowerCase()}`}
-    >
-      {rect}
-      <title>{kindStr}</title>
-      <text
-        ref={textRef}
-        x={x + (leftJustified ? paddingX + width / 2 : 0)}
-        y={y + (leftJustified ? (paddingY + height) / 2 : 0)}
-        textAnchor="middle"
-        dy="0.35em"
+    return (
+      <g
+        className={cx('odc-resource-icon', {
+          [`odc-resource-icon-${kindStr.toLowerCase()}`]: !kindColor,
+        })}
+        data-test={`icon ${kindStr.toLowerCase()}`}
       >
-        {kindAbbr}
-      </text>
-    </g>
-  );
-};
+        {rect}
+        <title>{kindStr}</title>
+        <text
+          ref={textRef}
+          x={x + (leftJustified ? paddingX + width / 2 : 0)}
+          y={y + (leftJustified ? (paddingY + height) / 2 : 0)}
+          textAnchor="middle"
+          dy="0.35em"
+        >
+          {kindAbbr}
+        </text>
+      </g>
+    );
+  },
+);
 
-const SvgResourceIcon = React.forwardRef(ForwardSvgResourceIcon);
 export { SvgResourceIcon as default, getKindStringAndAbbreviation };
diff --git a/frontend/packages/topology/src/components/svg/__tests__/SvgBoxedText.spec.tsx b/frontend/packages/topology/src/components/svg/__tests__/SvgBoxedText.spec.tsx
index 62e6e372ed5..dd9c8b0ff24 100644
--- a/frontend/packages/topology/src/components/svg/__tests__/SvgBoxedText.spec.tsx
+++ b/frontend/packages/topology/src/components/svg/__tests__/SvgBoxedText.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import SvgBoxedText from '../SvgBoxedText';
 // import SvgBoxedText, { SvgBoxedTextProps } from '../SvgBoxedText';
diff --git a/frontend/packages/topology/src/components/svg/__tests__/SvgResourceIcon.spec.tsx b/frontend/packages/topology/src/components/svg/__tests__/SvgResourceIcon.spec.tsx
index d3bdd902f1f..ad948b6a890 100644
--- a/frontend/packages/topology/src/components/svg/__tests__/SvgResourceIcon.spec.tsx
+++ b/frontend/packages/topology/src/components/svg/__tests__/SvgResourceIcon.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import SvgResourceIcon, { getKindStringAndAbbreviation } from '../SvgResourceIcon';
 
diff --git a/frontend/packages/topology/src/components/visual-connector/resource-tab-section.tsx b/frontend/packages/topology/src/components/visual-connector/resource-tab-section.tsx
index a0997824d04..5843515ee5a 100644
--- a/frontend/packages/topology/src/components/visual-connector/resource-tab-section.tsx
+++ b/frontend/packages/topology/src/components/visual-connector/resource-tab-section.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Edge, GraphElement } from '@patternfly/react-topology';
 import { DetailsTabSectionExtensionHook } from '@console/dynamic-plugin-sdk/src/extensions/topology-details';
 import { TYPE_CONNECTS_TO } from '../../const';
diff --git a/frontend/packages/topology/src/components/workload/resource-alert.tsx b/frontend/packages/topology/src/components/workload/resource-alert.tsx
index 626d2c432d3..da07d32cd3a 100644
--- a/frontend/packages/topology/src/components/workload/resource-alert.tsx
+++ b/frontend/packages/topology/src/components/workload/resource-alert.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { AlertActionLink } from '@patternfly/react-core';
 import { GraphElement } from '@patternfly/react-topology';
 import { useTranslation } from 'react-i18next';
diff --git a/frontend/packages/topology/src/components/workload/workload-resource-link.tsx b/frontend/packages/topology/src/components/workload/workload-resource-link.tsx
index 5e6ef8331b0..0982ad195fc 100644
--- a/frontend/packages/topology/src/components/workload/workload-resource-link.tsx
+++ b/frontend/packages/topology/src/components/workload/workload-resource-link.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { GraphElement } from '@patternfly/react-topology';
 import { Link } from 'react-router-dom-v5-compat';
 import { ResourceIcon, resourcePath } from '@console/internal/components/utils';
diff --git a/frontend/packages/topology/src/filters/__tests__/FilterDropdown.spec.tsx b/frontend/packages/topology/src/filters/__tests__/FilterDropdown.spec.tsx
index de7f3ded6b6..50eef2f03bf 100644
--- a/frontend/packages/topology/src/filters/__tests__/FilterDropdown.spec.tsx
+++ b/frontend/packages/topology/src/filters/__tests__/FilterDropdown.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Switch, SelectOption } from '@patternfly/react-core';
 import { mount, shallow } from 'enzyme';
 import { DisplayFilters, TopologyDisplayFilterType, TopologyViewType } from '../../topology-types';
diff --git a/frontend/packages/topology/src/filters/__tests__/KindFilterDropdown.spec.tsx b/frontend/packages/topology/src/filters/__tests__/KindFilterDropdown.spec.tsx
index 312846ab365..c36e5eb79e0 100644
--- a/frontend/packages/topology/src/filters/__tests__/KindFilterDropdown.spec.tsx
+++ b/frontend/packages/topology/src/filters/__tests__/KindFilterDropdown.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { SelectOption, SelectOptionProps } from '@patternfly/react-core';
 import { mount, shallow } from 'enzyme';
 import { DisplayFilters, TopologyDisplayFilterType } from '../../topology-types';
diff --git a/frontend/packages/topology/src/utils/moveNodeToGroup.tsx b/frontend/packages/topology/src/utils/moveNodeToGroup.tsx
index d768d7fb2ae..7550bac2ce1 100644
--- a/frontend/packages/topology/src/utils/moveNodeToGroup.tsx
+++ b/frontend/packages/topology/src/utils/moveNodeToGroup.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Node } from '@patternfly/react-topology';
 import { Trans } from 'react-i18next';
 import { confirmModal, errorModal } from '@console/internal/components/modals';
diff --git a/frontend/packages/topology/src/utils/removeConnection.tsx b/frontend/packages/topology/src/utils/removeConnection.tsx
index 4d650d698f7..db58a5f690a 100644
--- a/frontend/packages/topology/src/utils/removeConnection.tsx
+++ b/frontend/packages/topology/src/utils/removeConnection.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Edge } from '@patternfly/react-topology';
 import { Trans } from 'react-i18next';
 import { confirmModal, errorModal } from '@console/internal/components/modals';
diff --git a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellDrawer.spec.tsx b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellDrawer.spec.tsx
index fc874b9eaaf..f6ce375e24a 100644
--- a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellDrawer.spec.tsx
+++ b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellDrawer.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { Drawer } from '@console/shared';
 import CloseButton from '@console/shared/src/components/close-button';
diff --git a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellExec.spec.tsx b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellExec.spec.tsx
index cdc5dc6ca2e..c749a6a7b7f 100644
--- a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellExec.spec.tsx
+++ b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellExec.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount } from 'enzyme';
 import { FLAGS } from '@console/shared';
 import { WorkspaceModel } from '../../../../models';
diff --git a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellTab.spec.tsx b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellTab.spec.tsx
index 37ea2146332..7eaab0fdb9c 100644
--- a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellTab.spec.tsx
+++ b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellTab.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { Navigate } from 'react-router-dom-v5-compat';
 import * as flagsModule from '@console/dynamic-plugin-sdk/src/utils/flags';
diff --git a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellTerminal.spec.tsx b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellTerminal.spec.tsx
index c45ded4d358..054f3986b65 100644
--- a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellTerminal.spec.tsx
+++ b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/CloudShellTerminal.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { StatusBox } from '@console/internal/components/utils/status-box';
 import { useFlag } from '@console/shared';
diff --git a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/MinimizeRestoreButton.spec.tsx b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/MinimizeRestoreButton.spec.tsx
index 92fda20a015..ffc5f67b77e 100644
--- a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/MinimizeRestoreButton.spec.tsx
+++ b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/MinimizeRestoreButton.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button } from '@patternfly/react-core';
 import { shallow } from 'enzyme';
 import MinimizeRestoreButton from '../MinimizeRestoreButton';
diff --git a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/MultiTabbedTerminal.spec.tsx b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/MultiTabbedTerminal.spec.tsx
index 6ab568e80ed..3a461ee51b3 100644
--- a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/MultiTabbedTerminal.spec.tsx
+++ b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/MultiTabbedTerminal.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { PlusIcon } from '@patternfly/react-icons/dist/esm/icons/plus-icon';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
diff --git a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/TerminalLoadingBox.spec.tsx b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/TerminalLoadingBox.spec.tsx
index 02d91471ce8..2084a5e3fda 100644
--- a/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/TerminalLoadingBox.spec.tsx
+++ b/frontend/packages/webterminal-plugin/src/components/cloud-shell/__tests__/TerminalLoadingBox.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { render } from '@testing-library/react';
 import TerminalLoadingBox from '../TerminalLoadingBox';
 
diff --git a/frontend/packages/webterminal-plugin/src/components/cloud-shell/setup/__tests__/CloudShellSetupForm.spec.tsx b/frontend/packages/webterminal-plugin/src/components/cloud-shell/setup/__tests__/CloudShellSetupForm.spec.tsx
index eb2df8d1912..fa2b9ddcba8 100644
--- a/frontend/packages/webterminal-plugin/src/components/cloud-shell/setup/__tests__/CloudShellSetupForm.spec.tsx
+++ b/frontend/packages/webterminal-plugin/src/components/cloud-shell/setup/__tests__/CloudShellSetupForm.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { FormFooter } from '@console/shared';
 import AdminNamespaceSection from '../AdminNamespaceSection';
diff --git a/frontend/packages/webterminal-plugin/src/components/cloud-shell/setup/__tests__/NamespaceSection.spec.tsx b/frontend/packages/webterminal-plugin/src/components/cloud-shell/setup/__tests__/NamespaceSection.spec.tsx
index eae471ead27..e1e002a7155 100644
--- a/frontend/packages/webterminal-plugin/src/components/cloud-shell/setup/__tests__/NamespaceSection.spec.tsx
+++ b/frontend/packages/webterminal-plugin/src/components/cloud-shell/setup/__tests__/NamespaceSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { useFormikContext, useField } from 'formik';
 import { InputField, ResourceDropdownField, FLAGS } from '@console/shared';
diff --git a/frontend/public/components/RBAC/rules.jsx b/frontend/public/components/RBAC/rules.jsx
index fa583464bf8..48a5b6dea53 100644
--- a/frontend/public/components/RBAC/rules.jsx
+++ b/frontend/public/components/RBAC/rules.jsx
@@ -1,6 +1,5 @@
 /* eslint-disable @typescript-eslint/no-use-before-define */
 import * as _ from 'lodash-es';
-import * as React from 'react';
 import { connect } from 'react-redux';
 
 import { Divider } from '@patternfly/react-core';
diff --git a/frontend/public/components/cluster-settings/global-config.tsx b/frontend/public/components/cluster-settings/global-config.tsx
index 4f3e192789e..1c2b222c591 100644
--- a/frontend/public/components/cluster-settings/global-config.tsx
+++ b/frontend/public/components/cluster-settings/global-config.tsx
@@ -163,7 +163,9 @@ export const GlobalConfigPage: React.FC = () => {
         setLoading(false);
       }
     });
-    return () => (isSubscribed = false);
+    return () => {
+      isSubscribed = false;
+    };
   }, [clusterOperatorConfigResources, configResources, globalConfigs, t]);
 
   const visibleItems = items.filter(({ label, description = '' }) => {
diff --git a/frontend/public/components/configmap.jsx b/frontend/public/components/configmap.jsx
index 16dbe13a472..aac6fa658e0 100644
--- a/frontend/public/components/configmap.jsx
+++ b/frontend/public/components/configmap.jsx
@@ -1,5 +1,4 @@
 import * as _ from 'lodash-es';
-import * as React from 'react';
 import * as classNames from 'classnames';
 import { sortable } from '@patternfly/react-table';
 import { useTranslation } from 'react-i18next';
diff --git a/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/cluster-setup-getting-started-card.spec.tsx b/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/cluster-setup-getting-started-card.spec.tsx
index 596ac00ffa5..d08faee70b0 100644
--- a/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/cluster-setup-getting-started-card.spec.tsx
+++ b/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/cluster-setup-getting-started-card.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { GettingStartedCard } from '@console/shared/src/components/getting-started';
 import { useCanClusterUpgrade } from '@console/shared';
diff --git a/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/explore-admin-features-getting-started-card.spec.tsx b/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/explore-admin-features-getting-started-card.spec.tsx
index 13c71a6db35..2492b36a426 100644
--- a/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/explore-admin-features-getting-started-card.spec.tsx
+++ b/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/explore-admin-features-getting-started-card.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { GettingStartedCard } from '@console/shared/src/components/getting-started';
 
diff --git a/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/getting-started-section.spec.tsx b/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/getting-started-section.spec.tsx
index 49df03d4bcc..15c97949fff 100644
--- a/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/getting-started-section.spec.tsx
+++ b/frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/__tests__/getting-started-section.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 
 import { useUserSettings } from '@console/shared';
diff --git a/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/DeveloperFeaturesGettingStartedCard.spec.tsx b/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/DeveloperFeaturesGettingStartedCard.spec.tsx
index bbaf6ccd8b1..e27fd7640a6 100644
--- a/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/DeveloperFeaturesGettingStartedCard.spec.tsx
+++ b/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/DeveloperFeaturesGettingStartedCard.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { ALL_NAMESPACES_KEY, useActiveNamespace, useFlag } from '@console/shared/src';
 import { GettingStartedCard } from '@console/shared/src/components/getting-started';
diff --git a/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/GettingStartedSection.spec.tsx b/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/GettingStartedSection.spec.tsx
index cdbabdbe6bd..96c173d2206 100644
--- a/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/GettingStartedSection.spec.tsx
+++ b/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/GettingStartedSection.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { useUserSettings } from '@console/shared';
 import {
diff --git a/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/SampleGettingStartedCard.spec.tsx b/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/SampleGettingStartedCard.spec.tsx
index 332a5c854a8..fd3cf2b606d 100644
--- a/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/SampleGettingStartedCard.spec.tsx
+++ b/frontend/public/components/dashboard/project-dashboard/getting-started/__tests__/SampleGettingStartedCard.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { shallow } from 'enzyme';
 import { useActiveNamespace, CatalogServiceProvider } from '@console/shared/src';
 import { GettingStartedCard } from '@console/shared/src/components/getting-started';
diff --git a/frontend/public/components/environment.jsx b/frontend/public/components/environment.jsx
index 85daac2bea0..a473505dc14 100644
--- a/frontend/public/components/environment.jsx
+++ b/frontend/public/components/environment.jsx
@@ -1,5 +1,4 @@
 /* eslint-disable tsdoc/syntax */
-import * as React from 'react';
 import * as _ from 'lodash-es';
 import * as PropTypes from 'prop-types';
 import { connect } from 'react-redux';
diff --git a/frontend/public/components/global-notifications.tsx b/frontend/public/components/global-notifications.tsx
index 6775fb2a210..8e0e356a186 100644
--- a/frontend/public/components/global-notifications.tsx
+++ b/frontend/public/components/global-notifications.tsx
@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 import { ImpersonateNotifier } from './impersonate-notifier';
 import { KubeAdminNotifier } from './kube-admin-notifier';
 
diff --git a/frontend/public/components/global-telemetry-notifications.tsx b/frontend/public/components/global-telemetry-notifications.tsx
index 00a337fb065..50a78b91de5 100644
--- a/frontend/public/components/global-telemetry-notifications.tsx
+++ b/frontend/public/components/global-telemetry-notifications.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useTranslation, Trans } from 'react-i18next';
 import { Banner, Button, Flex, PageSection } from '@patternfly/react-core';
 
diff --git a/frontend/public/components/graphs/health.jsx b/frontend/public/components/graphs/health.jsx
index 69f1431bb14..823fd9b7ef8 100644
--- a/frontend/public/components/graphs/health.jsx
+++ b/frontend/public/components/graphs/health.jsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { connect } from 'react-redux';
 
 import { Status, errorStatus } from './';
diff --git a/frontend/public/components/graphs/index.tsx b/frontend/public/components/graphs/index.tsx
index a7519a57aa1..af8e1e20e6a 100644
--- a/frontend/public/components/graphs/index.tsx
+++ b/frontend/public/components/graphs/index.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { createContainer } from '@patternfly/react-charts/victory';
 import { AsyncComponent } from '../utils/async';
 
diff --git a/frontend/public/components/impersonate-notifier.jsx b/frontend/public/components/impersonate-notifier.jsx
index f38a0ddfac9..24364f13865 100644
--- a/frontend/public/components/impersonate-notifier.jsx
+++ b/frontend/public/components/impersonate-notifier.jsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { connect } from 'react-redux';
 import { useTranslation, Trans } from 'react-i18next';
 import { useNavigate } from 'react-router-dom-v5-compat';
diff --git a/frontend/public/components/import-yaml-results.tsx b/frontend/public/components/import-yaml-results.tsx
index aecd9bff1c7..4c80d4cb659 100644
--- a/frontend/public/components/import-yaml-results.tsx
+++ b/frontend/public/components/import-yaml-results.tsx
@@ -20,7 +20,7 @@ import { referenceFor } from '../module/k8s';
  * https://github.com/DefinitelyTyped/DefinitelyTyped/blob/3423b4fc3e3da09f8acc386bc2fee6fb8f5e0880/types/react/index.d.ts#L1763
  */
 const reactPropFix = {
-  translate: 'no',
+  translate: 'no' as 'no',
 };
 
 export const ImportYAMLPageStatus: React.FC<ImportYAMLPageStatusProps> = ({ errors, inFlight }) => {
diff --git a/frontend/public/components/import-yaml.tsx b/frontend/public/components/import-yaml.tsx
index 1bf70e3082d..251782f6a68 100644
--- a/frontend/public/components/import-yaml.tsx
+++ b/frontend/public/components/import-yaml.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Helmet } from 'react-helmet';
 import { AsyncComponent } from './utils';
 import { useTranslation } from 'react-i18next';
diff --git a/frontend/public/components/ingress.jsx b/frontend/public/components/ingress.jsx
index 1fe56b2171f..8a817773a86 100644
--- a/frontend/public/components/ingress.jsx
+++ b/frontend/public/components/ingress.jsx
@@ -1,5 +1,4 @@
 import * as _ from 'lodash-es';
-import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import * as classNames from 'classnames';
 import { sortable } from '@patternfly/react-table';
diff --git a/frontend/public/components/kube-admin-notifier.jsx b/frontend/public/components/kube-admin-notifier.jsx
index b2a4db6084f..e45cdb6d2ea 100644
--- a/frontend/public/components/kube-admin-notifier.jsx
+++ b/frontend/public/components/kube-admin-notifier.jsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Link } from 'react-router-dom-v5-compat';
 import { connect } from 'react-redux';
 import { Banner, Flex } from '@patternfly/react-core';
diff --git a/frontend/public/components/modals/__tests__/replace-code-modal.spec.tsx b/frontend/public/components/modals/__tests__/replace-code-modal.spec.tsx
index 99f3f6bd0d5..4c439d07022 100644
--- a/frontend/public/components/modals/__tests__/replace-code-modal.spec.tsx
+++ b/frontend/public/components/modals/__tests__/replace-code-modal.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { render, fireEvent, configure } from '@testing-library/react';
 import '@testing-library/jest-dom/extend-expect';
 import { ReplaceCodeModal } from '../replace-code-modal';
diff --git a/frontend/public/components/modals/configure-ns-pull-secret-modal.jsx b/frontend/public/components/modals/configure-ns-pull-secret-modal.jsx
index dae8e676b51..1cf7b736f03 100644
--- a/frontend/public/components/modals/configure-ns-pull-secret-modal.jsx
+++ b/frontend/public/components/modals/configure-ns-pull-secret-modal.jsx
@@ -1,5 +1,4 @@
 import * as _ from 'lodash-es';
-import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import { Base64 } from 'js-base64';
 import { Alert, CodeBlock, CodeBlockCode } from '@patternfly/react-core';
diff --git a/frontend/public/components/modals/confirm-modal.jsx b/frontend/public/components/modals/confirm-modal.jsx
index da1731d8cb4..32806189bcc 100644
--- a/frontend/public/components/modals/confirm-modal.jsx
+++ b/frontend/public/components/modals/confirm-modal.jsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Translation } from 'react-i18next';
 import * as PropTypes from 'prop-types';
 
diff --git a/frontend/public/components/modals/delete-pvc-modal.tsx b/frontend/public/components/modals/delete-pvc-modal.tsx
index b03d0470adc..f51b28662be 100644
--- a/frontend/public/components/modals/delete-pvc-modal.tsx
+++ b/frontend/public/components/modals/delete-pvc-modal.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useNavigate } from 'react-router-dom-v5-compat';
 import { Stack, StackItem } from '@patternfly/react-core';
 import { Trans, useTranslation } from 'react-i18next';
diff --git a/frontend/public/components/modals/error-modal.tsx b/frontend/public/components/modals/error-modal.tsx
index 417967226d9..1f7845f411c 100644
--- a/frontend/public/components/modals/error-modal.tsx
+++ b/frontend/public/components/modals/error-modal.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ActionGroup, Button } from '@patternfly/react-core';
 import { useTranslation } from 'react-i18next';
 
diff --git a/frontend/public/components/modals/replace-code-modal.tsx b/frontend/public/components/modals/replace-code-modal.tsx
index f220041f9e2..f214ed0258a 100644
--- a/frontend/public/components/modals/replace-code-modal.tsx
+++ b/frontend/public/components/modals/replace-code-modal.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { Button } from '@patternfly/react-core';
 import { Modal, ModalVariant } from '@patternfly/react-core/deprecated';
diff --git a/frontend/public/components/monitoring/alerting.tsx b/frontend/public/components/monitoring/alerting.tsx
index f893791127f..d19e741e62c 100644
--- a/frontend/public/components/monitoring/alerting.tsx
+++ b/frontend/public/components/monitoring/alerting.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Routes, Route, Navigate } from 'react-router-dom-v5-compat';
 import {
   ContainerModel,
diff --git a/frontend/public/components/monitoring/receiver-forms/routing-labels-editor.tsx b/frontend/public/components/monitoring/receiver-forms/routing-labels-editor.tsx
index feedb894922..2f74373c78a 100644
--- a/frontend/public/components/monitoring/receiver-forms/routing-labels-editor.tsx
+++ b/frontend/public/components/monitoring/receiver-forms/routing-labels-editor.tsx
@@ -1,5 +1,4 @@
 import * as _ from 'lodash-es';
-import * as React from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 import { MinusCircleIcon } from '@patternfly/react-icons/dist/esm/icons/minus-circle-icon';
 import { PlusCircleIcon } from '@patternfly/react-icons/dist/esm/icons/plus-circle-icon';
diff --git a/frontend/public/components/monitoring/receiver-forms/send-resolved-alerts-checkbox.tsx b/frontend/public/components/monitoring/receiver-forms/send-resolved-alerts-checkbox.tsx
index 9ee8e09b612..6ecdce677b2 100644
--- a/frontend/public/components/monitoring/receiver-forms/send-resolved-alerts-checkbox.tsx
+++ b/frontend/public/components/monitoring/receiver-forms/send-resolved-alerts-checkbox.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 
 export const SendResolvedAlertsCheckbox = ({ formField, formValues, dispatchFormChange }) => {
diff --git a/frontend/public/components/notification-drawer.tsx b/frontend/public/components/notification-drawer.tsx
index abcda1d432f..d2e9a9ef396 100644
--- a/frontend/public/components/notification-drawer.tsx
+++ b/frontend/public/components/notification-drawer.tsx
@@ -310,7 +310,9 @@ export const NotificationDrawer: React.FC<NotificationDrawerProps> = ({
       dispatch(alertingErrored('silences', new Error(t('public~alertManagerBaseURL not set'))));
     }
 
-    return () => _.each(pollerTimeouts, clearTimeout);
+    return () => {
+      _.each(pollerTimeouts, clearTimeout);
+    };
   }, [dispatch, t]);
 
   const clusterVersion: ClusterVersionKind = useClusterVersion();
diff --git a/frontend/public/components/persistent-volume-claim.jsx b/frontend/public/components/persistent-volume-claim.jsx
index bb2799b3ae3..6412cbfd3b9 100644
--- a/frontend/public/components/persistent-volume-claim.jsx
+++ b/frontend/public/components/persistent-volume-claim.jsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import * as _ from 'lodash-es';
 import * as classNames from 'classnames';
 import { useDispatch, connect } from 'react-redux';
diff --git a/frontend/public/components/persistent-volume.jsx b/frontend/public/components/persistent-volume.jsx
index e24de076aec..49eaf594ffa 100644
--- a/frontend/public/components/persistent-volume.jsx
+++ b/frontend/public/components/persistent-volume.jsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import * as _ from 'lodash-es';
 import { sortable } from '@patternfly/react-table';
 import { Status } from '@console/shared';
diff --git a/frontend/public/components/prometheus.jsx b/frontend/public/components/prometheus.jsx
index d2841a4ff92..d60871addc8 100644
--- a/frontend/public/components/prometheus.jsx
+++ b/frontend/public/components/prometheus.jsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { sortable } from '@patternfly/react-table';
 import { useTranslation } from 'react-i18next';
 
diff --git a/frontend/public/components/replicaset.jsx b/frontend/public/components/replicaset.jsx
index cc67adaedba..27fd5163a3b 100644
--- a/frontend/public/components/replicaset.jsx
+++ b/frontend/public/components/replicaset.jsx
@@ -1,6 +1,5 @@
 // TODO file should be renamed replica-set.jsx to match convention
 
-import * as React from 'react';
 import * as _ from 'lodash-es';
 import * as classNames from 'classnames';
 import { Link } from 'react-router-dom-v5-compat';
diff --git a/frontend/public/components/replication-controller.jsx b/frontend/public/components/replication-controller.jsx
index dfa3482cb1d..23aaccea52b 100644
--- a/frontend/public/components/replication-controller.jsx
+++ b/frontend/public/components/replication-controller.jsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import * as _ from 'lodash-es';
 import * as classNames from 'classnames';
 import { useTranslation } from 'react-i18next';
diff --git a/frontend/public/components/resource-list.tsx b/frontend/public/components/resource-list.tsx
index 2ba1520fea1..4896d93c758 100644
--- a/frontend/public/components/resource-list.tsx
+++ b/frontend/public/components/resource-list.tsx
@@ -1,5 +1,4 @@
 import * as _ from 'lodash-es';
-import * as React from 'react';
 import { Helmet } from 'react-helmet';
 import { useParams, useLocation } from 'react-router-dom-v5-compat';
 import { getBadgeFromType, getTitleForNodeKind } from '@console/shared';
diff --git a/frontend/public/components/resource-quota.jsx b/frontend/public/components/resource-quota.jsx
index ba5b0478910..54fc1deae05 100644
--- a/frontend/public/components/resource-quota.jsx
+++ b/frontend/public/components/resource-quota.jsx
@@ -1,5 +1,4 @@
 import * as _ from 'lodash-es';
-import * as React from 'react';
 import * as classNames from 'classnames';
 import { useParams } from 'react-router-dom-v5-compat';
 import { sortable } from '@patternfly/react-table';
diff --git a/frontend/public/components/routes/route-metrics.tsx b/frontend/public/components/routes/route-metrics.tsx
index c1468b29ef9..7105468162d 100644
--- a/frontend/public/components/routes/route-metrics.tsx
+++ b/frontend/public/components/routes/route-metrics.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { FLAGS } from '@console/shared/src/constants';
 import { Area } from '@console/internal/components/graphs/area';
 import { humanizeDecimalBytesPerSec } from '@console/internal/components/utils';
diff --git a/frontend/public/components/row-filter.jsx b/frontend/public/components/row-filter.jsx
index afd45976b94..045446b2551 100644
--- a/frontend/public/components/row-filter.jsx
+++ b/frontend/public/components/row-filter.jsx
@@ -1,5 +1,4 @@
 /* eslint-disable tsdoc/syntax */
-import * as React from 'react';
 import { Button, Divider, Flex, FlexItem } from '@patternfly/react-core';
 import { useTranslation } from 'react-i18next';
 
diff --git a/frontend/public/components/secret.jsx b/frontend/public/components/secret.jsx
index 3ca749f47dc..c511c3a2150 100644
--- a/frontend/public/components/secret.jsx
+++ b/frontend/public/components/secret.jsx
@@ -1,5 +1,4 @@
 import * as _ from 'lodash-es';
-import * as React from 'react';
 import * as classNames from 'classnames';
 import { sortable } from '@patternfly/react-table';
 import { useTranslation } from 'react-i18next';
diff --git a/frontend/public/components/secrets/create-secret/CreateSecret.tsx b/frontend/public/components/secrets/create-secret/CreateSecret.tsx
index 3c1399d2d15..bf085d62ee1 100644
--- a/frontend/public/components/secrets/create-secret/CreateSecret.tsx
+++ b/frontend/public/components/secrets/create-secret/CreateSecret.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useParams } from 'react-router-dom-v5-compat';
 import { SecretTypeAbstraction } from './types';
 import { SecretFormWrapper } from './SecretFormWrapper';
diff --git a/frontend/public/components/secrets/create-secret/DropableFileInput.tsx b/frontend/public/components/secrets/create-secret/DropableFileInput.tsx
index 3fb08d5623c..7663c0fddbf 100644
--- a/frontend/public/components/secrets/create-secret/DropableFileInput.tsx
+++ b/frontend/public/components/secrets/create-secret/DropableFileInput.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { AsyncComponent } from '../../utils/async';
 
 //TODO :Create a shared LazyDroppableFileInput component.
diff --git a/frontend/public/components/service-account.jsx b/frontend/public/components/service-account.jsx
index ac0b300fcee..fcb94285309 100644
--- a/frontend/public/components/service-account.jsx
+++ b/frontend/public/components/service-account.jsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import * as classNames from 'classnames';
 import { sortable } from '@patternfly/react-table';
 import { useTranslation } from 'react-i18next';
diff --git a/frontend/public/components/service-monitor.jsx b/frontend/public/components/service-monitor.jsx
index a3d42443bd5..3da4d450976 100644
--- a/frontend/public/components/service-monitor.jsx
+++ b/frontend/public/components/service-monitor.jsx
@@ -1,5 +1,4 @@
 import * as _ from 'lodash-es';
-import * as React from 'react';
 import { sortable } from '@patternfly/react-table';
 import { ListPage, Table, TableData } from './factory';
 import { Kebab, ResourceKebab, ResourceLink, Selector } from './utils';
diff --git a/frontend/public/components/service.jsx b/frontend/public/components/service.jsx
index a06e278c311..be6822bbfad 100644
--- a/frontend/public/components/service.jsx
+++ b/frontend/public/components/service.jsx
@@ -1,5 +1,4 @@
 import * as _ from 'lodash-es';
-import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import * as classNames from 'classnames';
 import { sortable } from '@patternfly/react-table';
diff --git a/frontend/public/components/terminal.jsx b/frontend/public/components/terminal.jsx
index 07816e5b6ed..e1272d32283 100644
--- a/frontend/public/components/terminal.jsx
+++ b/frontend/public/components/terminal.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import { createRef, Component } from 'react';
 import PropTypes from 'prop-types';
 import { Terminal as XTerminal } from 'xterm';
 import { FitAddon } from 'xterm-addon-fit';
@@ -7,12 +7,12 @@ import { CompressIcon } from '@patternfly/react-icons/dist/esm/icons/compress-ic
 import { Button } from '@patternfly/react-core';
 import { XtermAddonFullscreen } from '@console/shared';
 
-class Terminal_ extends React.Component {
+class Terminal_ extends Component {
   constructor(props) {
     super(props);
     this.state = { height: 0, width: 0 };
-    this.innerRef = React.createRef();
-    this.outerRef = React.createRef();
+    this.innerRef = createRef();
+    this.outerRef = createRef();
     this.isFullscreen = false;
     this.onResize = () => this.onResize_();
     this.onDataReceived = (data) => this.terminal && this.terminal.write(data);
diff --git a/frontend/public/components/utils/__tests__/firehose.spec.tsx b/frontend/public/components/utils/__tests__/firehose.spec.tsx
index 387bdfcc242..db59e407291 100644
--- a/frontend/public/components/utils/__tests__/firehose.spec.tsx
+++ b/frontend/public/components/utils/__tests__/firehose.spec.tsx
@@ -215,7 +215,9 @@ describe('Firehose', () => {
 
   afterEach(async () => {
     // Ensure that there is no timer left which triggers a rerendering
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     cleanup();
 
@@ -301,7 +303,9 @@ describe('Firehose', () => {
     expect(resourceUpdate.mock.calls[0][0]).toEqual(podsNotLoadedYetProps);
 
     // Finish API call
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Expect updated child-props
     const podsLoaded = {
@@ -389,7 +393,9 @@ describe('Firehose', () => {
     expect(resourceUpdate.mock.calls[0][0]).toEqual(podsNotLoadedYetProps);
 
     // Finish API call
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Expect updated child-props
     const podLoaded = {
@@ -483,7 +489,9 @@ describe('Firehose', () => {
     expect(resourceUpdate.mock.calls[0][0]).toEqual(podsNotLoadedYetProps);
 
     // Finish API call
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Expect updated child-props
     const podsLoaded = {
@@ -565,7 +573,9 @@ describe('Firehose', () => {
     expect(resourceUpdate.mock.calls[0][0]).toEqual(podsNotLoadedYetProps);
 
     // Finish API call
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Expect updated child-props
     const podLoaded = {
@@ -673,7 +683,9 @@ describe('Firehose', () => {
     expect(resourceUpdate.mock.calls[1][0]).toEqual(notLoadedYetProps);
 
     // Finish API call
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Expect updated child-props
     const podsLoaded = {
@@ -820,7 +832,9 @@ describe('Firehose', () => {
     expect(resourceUpdate.mock.calls[1][0]).toEqual(podsNotLoadedYetProps);
 
     // Finish API call
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Expect updated child-props
     const podsLoaded = {
@@ -947,7 +961,9 @@ describe('Firehose together with useK8sWatchResources', () => {
 
   afterEach(async () => {
     // Ensure that there is no timer left which triggers a rerendering
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     cleanup();
 
@@ -1000,7 +1016,9 @@ describe('Firehose together with useK8sWatchResources', () => {
     );
 
     // Finish API calls
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert that API calls are just triggered once
     expect(k8sListMock).toHaveBeenCalledTimes(1);
@@ -1088,7 +1106,9 @@ describe('Firehose together with useK8sWatchResources', () => {
     );
 
     // Finish API calls
-    await act(async () => jest.runAllTimers());
+    await act(async () => {
+      jest.runAllTimers();
+    });
 
     // Assert that API calls are just triggered once
     expect(k8sListMock).toHaveBeenCalledTimes(1);
@@ -1171,7 +1191,9 @@ describe('Firehose together with useK8sWatchResources', () => {
       );
 
       // Finish API calls
-      await act(async () => jest.runAllTimers());
+      await act(async () => {
+        jest.runAllTimers();
+      });
 
       // Assert that API calls are just triggered once
       expect(k8sListMock).toHaveBeenCalledTimes(1);
@@ -1267,7 +1289,9 @@ describe('Firehose together with useK8sWatchResources', () => {
       );
 
       // Finish API calls
-      await act(async () => jest.runAllTimers());
+      await act(async () => {
+        jest.runAllTimers();
+      });
 
       // Assert that API calls are just triggered once
       expect(k8sListMock).toHaveBeenCalledTimes(1);
@@ -1364,7 +1388,9 @@ describe('Firehose together with useK8sWatchResources', () => {
       );
 
       // Finish API calls
-      await act(async () => jest.runAllTimers());
+      await act(async () => {
+        jest.runAllTimers();
+      });
 
       // Assert that API calls are just triggered once
       expect(k8sGetMock).toHaveBeenCalledTimes(1);
@@ -1478,7 +1504,9 @@ describe('Firehose together with useK8sWatchResources', () => {
       );
 
       // Finish API calls
-      await act(async () => jest.runAllTimers());
+      await act(async () => {
+        jest.runAllTimers();
+      });
 
       expect(k8sGetMock).toHaveBeenCalledTimes(1);
       expect(k8sGetMock.mock.calls[0]).toEqual([
diff --git a/frontend/public/components/utils/__tests__/kebab.spec.tsx b/frontend/public/components/utils/__tests__/kebab.spec.tsx
index 7bfc3b32d32..99f9abf276f 100644
--- a/frontend/public/components/utils/__tests__/kebab.spec.tsx
+++ b/frontend/public/components/utils/__tests__/kebab.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { render, fireEvent } from '@testing-library/react';
 import { KebabItem, KebabItemAccessReview_ } from '../kebab';
 import { useAccessReview } from '../rbac';
diff --git a/frontend/public/components/utils/__tests__/single-typeahead-dropdown.spec.tsx b/frontend/public/components/utils/__tests__/single-typeahead-dropdown.spec.tsx
index 174704d2432..255ccf46919 100644
--- a/frontend/public/components/utils/__tests__/single-typeahead-dropdown.spec.tsx
+++ b/frontend/public/components/utils/__tests__/single-typeahead-dropdown.spec.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { mount, shallow } from 'enzyme';
 import { SingleTypeaheadDropdown } from '../single-typeahead-dropdown';
 import { act } from 'react-dom/test-utils';
diff --git a/frontend/public/components/utils/disabled.tsx b/frontend/public/components/utils/disabled.tsx
index dba64358c5b..31ba4be2371 100644
--- a/frontend/public/components/utils/disabled.tsx
+++ b/frontend/public/components/utils/disabled.tsx
@@ -1,3 +1 @@
-import * as React from 'react';
-
 export const Disabled = (props) => <div className="co-disabled">{props.children}</div>;
diff --git a/frontend/public/components/utils/firehose.jsx b/frontend/public/components/utils/firehose.jsx
index 3a856c3465d..107d89109c9 100644
--- a/frontend/public/components/utils/firehose.jsx
+++ b/frontend/public/components/utils/firehose.jsx
@@ -177,7 +177,7 @@ export const Firehose = connect(
       shallowMapEquals(next.k8sModels, prev.k8sModels),
   },
 )(
-  /** @augments {React.Component<{k8sModels?: Map<string, K8sKind>, doNotConnectToState?: boolean}>} */
+  /** @augments {React.Component<React.PropsWithChildren<{k8sModels?: Map<string, K8sKind>, doNotConnectToState?: boolean}>> */
   class Firehose extends React.Component {
     state = {
       firehoses: [],
diff --git a/frontend/public/components/utils/skeleton-catalog.tsx b/frontend/public/components/utils/skeleton-catalog.tsx
index 311f2792c52..188185a6029 100644
--- a/frontend/public/components/utils/skeleton-catalog.tsx
+++ b/frontend/public/components/utils/skeleton-catalog.tsx
@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 // 12 works well because it divides evenly for 2, 3, and 4 column layouts
 const skeletonTiles = Array.from({ length: 12 }, (_, k: number) => (
   <div key={k} className="skeleton-catalog--tile" />
diff --git a/frontend/public/components/utils/timestamp.tsx b/frontend/public/components/utils/timestamp.tsx
index e9a6b1edac3..5ff0a10828e 100644
--- a/frontend/public/components/utils/timestamp.tsx
+++ b/frontend/public/components/utils/timestamp.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { useSelector } from 'react-redux';
 import { Tooltip } from '@patternfly/react-core';
 import * as classNames from 'classnames';
diff --git a/frontend/public/components/utils/workload-pause.tsx b/frontend/public/components/utils/workload-pause.tsx
index 5f5b9948ec3..fc079aec7fe 100644
--- a/frontend/public/components/utils/workload-pause.tsx
+++ b/frontend/public/components/utils/workload-pause.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Alert, AlertActionLink } from '@patternfly/react-core';
 import { useTranslation } from 'react-i18next';
 
diff --git a/frontend/public/reducers/connectToFlags.ts b/frontend/public/reducers/connectToFlags.ts
index 40600e85e82..0c4e0a0070e 100644
--- a/frontend/public/reducers/connectToFlags.ts
+++ b/frontend/public/reducers/connectToFlags.ts
@@ -17,11 +17,7 @@ export type WithFlagsProps = {
 
 export type ConnectToFlags = <P extends WithFlagsProps>(
   ...flags: (FLAGS | string)[]
-) => (
-  C: React.ComponentType<P>,
-) => React.ComponentType<Omit<P, keyof WithFlagsProps>> & {
-  WrappedComponent: React.ComponentType<P>;
-};
+) => (component: React.ComponentType<P>) => React.ComponentType<Omit<P, keyof WithFlagsProps>>;
 
 export const connectToFlags: ConnectToFlags = (...flags) =>
   connect((state: RootState) => stateToProps(state.FLAGS, flags), null, null, {
diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json
index de8b76fd97e..3b93abe96a8 100644
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -6,7 +6,7 @@
     "moduleResolution": "node",
     "outDir": "./public/dist/build/",
     "target": "es2021",
-    "jsx": "react",
+    "jsx": "react-jsx",
     "allowJs": true,
     "experimentalDecorators": true,
     "sourceMap": true,
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index 13d7435b70c..0ffda91c2eb 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -2781,12 +2781,10 @@
   resolved "https://registry.yarnpkg.com/@types/range-parser/-/range-parser-1.2.3.tgz#7ee330ba7caafb98090bece86a5ee44115904c2c"
   integrity sha512-ewFXqrQHlFsgc09MK5jP5iR7vumV/BYayNC6PgJO2LPe8vrnNFyjQjSppfEngITi0qvfKtzFvgKymGheFM9UOA==
 
-"@types/react-dom@16.8.4":
-  version "16.8.4"
-  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.8.4.tgz#7fb7ba368857c7aa0f4e4511c4710ca2c5a12a88"
-  integrity sha512-eIRpEW73DCzPIMaNBDP5pPIpK1KXyZwNgfxiVagb5iGiz6da+9A5hslSX6GAQKdO7SayVCS/Fr2kjqprgAvkfA==
-  dependencies:
-    "@types/react" "*"
+"@types/react-dom@17.x":
+  version "17.0.26"
+  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-17.0.26.tgz#fa7891ba70fd39ddbaa7e85b6ff9175bb546bc1b"
+  integrity sha512-Z+2VcYXJwOqQ79HreLU/1fyQ88eXSSFh6I3JdrEHQIfYSI0kCQpTGvOrbE6jFGGYXKsHuwY9tBa/w5Uo6KzrEg==
 
 "@types/react-helmet@5.x":
   version "5.0.5"
@@ -2849,19 +2847,25 @@
     "@types/prop-types" "*"
     "@types/react" "*"
 
-"@types/react@*", "@types/react@16.8.13":
-  version "16.8.13"
-  resolved "https://registry.yarnpkg.com/@types/react/-/react-16.8.13.tgz#a82b15aad9ab91c40edca0d6889b7745ae24f053"
-  integrity sha512-otJ4ntMuHGrvm67CdDJMAls4WqotmAmW0g3HmWi9LCjSWXrxoXY/nHXrtmMfvPEEmGFNm6NdgMsJmnfH820Qaw==
+"@types/react@*", "@types/react@17.x":
+  version "17.0.83"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.83.tgz#b477c56387b74279281149dcf5ba2a1e2216d131"
+  integrity sha512-l0m4ArKJvmFtR4e8UmKrj1pB4tUgOhJITf+mADyF/p69Ts1YAR/E+G9XEM0mHXKVRa1dQNHseyyDNzeuAXfXQw==
   dependencies:
     "@types/prop-types" "*"
-    csstype "^2.2.0"
+    "@types/scheduler" "^0.16"
+    csstype "^3.0.2"
 
 "@types/retry@0.12.2":
   version "0.12.2"
   resolved "https://registry.yarnpkg.com/@types/retry/-/retry-0.12.2.tgz#ed279a64fa438bb69f2480eda44937912bb7480a"
   integrity sha512-XISRgDJ2Tc5q4TRqvgJtzsRkFYNJzZrhTdtMoGVBttwzzQJkPnS3WWTFc7kuDRoPtPakl+T+OfdEUjYJj7Jbow==
 
+"@types/scheduler@^0.16":
+  version "0.16.8"
+  resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.8.tgz#ce5ace04cfeabe7ef87c0091e50752e36707deff"
+  integrity sha512-WZLiwShhwLRmeV6zH+GkbOFT6Z6VklCItrDioxUnv+u4Ll+8vKeFySoFyK/0ctcRpOmwAicELfmys1sDc/Rw+A==
+
 "@types/semver@^6.0.0":
   version "6.2.2"
   resolved "https://registry.yarnpkg.com/@types/semver/-/semver-6.2.2.tgz#5c27df09ca39e3c9beb4fae6b95f4d71426df0a9"
@@ -5993,10 +5997,6 @@ cssstyle@^1.1.1:
   dependencies:
     cssom "~0.3.6"
 
-csstype@^2.2.0:
-  version "2.5.7"
-  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.5.7.tgz#bf9235d5872141eccfb2d16d82993c6b149179ff"
-
 csstype@^3.0.2:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.3.tgz#2b410bbeba38ba9633353aff34b05d9755d065f8"