From bcdc6b71099c0dcaa30b3e6243af41d1e99c8891 Mon Sep 17 00:00:00 2001 From: Star Richardson <67430892+alicenstar@users.noreply.github.com> Date: Thu, 26 Oct 2023 15:22:58 -0500 Subject: [PATCH] update babel and ts config, remove 'React' imports (#4102) * update babel and ts config, remove 'React' imports * remove new file creation * remove added file * remove dumb component * remove unused file and folder * remove formatting * fix react imports and merge conflict changes --- web/babel.config.js | 8 ++++---- web/src/ConnectionTerminated.jsx | 6 +++--- web/src/Root.tsx | 4 ++-- web/src/components/AirgapUploadProgress.jsx | 4 ++-- web/src/components/AppConfigRenderer.jsx | 4 ++-- web/src/components/BackupRestore.jsx | 5 ++--- web/src/components/Head/KotsPageTitle.tsx | 1 - web/src/components/Home.jsx | 4 ++-- web/src/components/Icon.tsx | 1 - web/src/components/LicenseUploadProgress.jsx | 5 ++--- web/src/components/PreflightRenderer.tsx | 1 - web/src/components/PreflightResultErrors.tsx | 10 +++++----- web/src/components/PreflightResultPage.tsx | 2 +- web/src/components/RestoreCompleted.jsx | 4 ++-- web/src/components/RestoreSnapshotRow.jsx | 5 ++--- web/src/components/UploadAirgapBundle.jsx | 5 ++--- web/src/components/UploadLicenseFile.tsx | 2 +- web/src/components/apps/AppDetailPage.tsx | 2 +- .../apps/AppIdentityServiceSettings.jsx | 2 +- web/src/components/apps/AppLicense.tsx | 4 ++-- web/src/components/apps/AppRegistrySettings.jsx | 2 +- web/src/components/apps/AppVersionHistory.tsx | 8 ++++---- .../apps/EmbeddedClusterManagement.tsx | 2 +- .../components/apps/EmbeddedClusterViewNode.jsx | 2 +- .../components/apps/KurlClusterManagement.jsx | 2 +- web/src/components/apps/KurlNodeRow.jsx | 1 - web/src/components/apps/LicenseTester.jsx | 2 +- web/src/components/clusters/GitOps.tsx | 4 ++-- .../components/config_render/ConfigCheckbox.tsx | 6 +++--- .../config_render/ConfigFileInput.jsx | 5 ++--- .../components/config_render/ConfigGroup.jsx | 7 +++---- .../components/config_render/ConfigGroups.jsx | 4 ++-- .../components/config_render/ConfigInput.jsx | 4 ++-- .../config_render/ConfigItemTitle.jsx | 5 ++--- .../components/config_render/ConfigRadio.jsx | 4 ++-- .../components/config_render/ConfigRender.jsx | 5 ++--- .../config_render/ConfigSelectOne.jsx | 4 ++-- .../components/config_render/ConfigTextarea.jsx | 6 +++--- web/src/components/config_render/FileInput.jsx | 5 ++--- web/src/components/context/withTheme.jsx | 4 ++-- .../gitops/GitOpsFlowIllustration.jsx | 4 ++-- .../components/hooks/useDownloadValues.test.jsx | 1 - web/src/components/hooks/useSaveConfig.test.jsx | 1 - web/src/components/identity/Access.tsx | 2 +- web/src/components/identity/AddRoleGroup.jsx | 2 -- web/src/components/identity/AnnotationRow.jsx | 2 +- .../components/identity/ConfigureIngress.jsx | 2 +- web/src/components/identity/DummyRbacRow.jsx | 2 -- .../components/identity/IdentityProviders.jsx | 2 +- .../components/identity/RBACGroupPolicyRow.jsx | 2 +- .../layout/SidebarLayout/SidebarLayout.jsx | 1 - .../components/modals/AutomaticUpdatesModal.tsx | 7 ++----- .../components/modals/BackupRestoreModal.jsx | 1 - .../ChangePasswordModal/ChangePasswordForm.jsx | 9 ++++----- .../ChangePasswordModal/ChangePasswordModal.jsx | 9 ++++----- .../components/modals/DeleteRedactorModal.jsx | 1 - .../components/modals/DeleteSnapshotModal.tsx | 1 - web/src/components/modals/ErrorModal.jsx | 1 - .../components/modals/RestoreSnapshotModal.jsx | 1 - web/src/components/modals/ShowAllModal.jsx | 1 - web/src/components/modals/ShowDetailsModal.jsx | 1 - web/src/components/modals/ShowLogsModal.jsx | 1 - .../modals/SnapshotDifferencesModal.tsx | 1 - .../components/modals/ViewSnapshotLogsModal.jsx | 1 - web/src/components/redactors/EditRedactor.tsx | 2 +- web/src/components/redactors/RedactorRow.jsx | 4 ++-- web/src/components/redactors/Redactors.jsx | 2 +- .../shared/AirgapRegistrySettings.tsx | 4 ++-- web/src/components/shared/Avatar.jsx | 5 ++--- .../components/shared/ClickOutsideAction.jsx | 4 ++-- web/src/components/shared/CodeSnippet.jsx | 4 ++-- web/src/components/shared/ConfigureGraphs.tsx | 4 ++-- web/src/components/shared/DiffEditor.jsx | 4 ++-- web/src/components/shared/EditConfigIcon.tsx | 1 - web/src/components/shared/ErrorBoundary.jsx | 4 ++-- web/src/components/shared/FileTree.jsx | 4 ++-- web/src/components/shared/Footer.jsx | 4 ++-- web/src/components/shared/InlineDropdown.jsx | 4 ++-- web/src/components/shared/Loader.tsx | 4 ++-- .../MarkdownRenderer/MarkdownRenderer.jsx | 4 ++-- web/src/components/shared/MountAware.jsx | 4 ++-- web/src/components/shared/NavBar.tsx | 4 ++-- web/src/components/shared/NavBarDropdown.jsx | 10 +++++----- web/src/components/shared/Pager.jsx | 4 ++-- .../components/shared/PaperIcon/PaperIcon.jsx | 1 - .../components/shared/ScheduleSnapshotForm.jsx | 2 +- web/src/components/shared/SideBar/SideBar.tsx | 2 +- .../components/shared/SubNavBar/SubNavBar.jsx | 1 - web/src/components/shared/TabView/Tab.jsx | 2 -- web/src/components/shared/TabView/TabView.jsx | 6 +++--- web/src/components/shared/Toast.tsx | 4 ++-- web/src/components/shared/Toggle.tsx | 1 - web/src/components/shared/Tooltip.jsx | 4 ++-- web/src/components/shared/Warning.jsx | 2 -- web/src/components/shared/forms/InputField.jsx | 5 ++--- .../shared/modals/DeployWarningModal.jsx | 4 ++-- .../shared/modals/HelmDeployModal.tsx | 1 - .../shared/modals/SkipPreflightsModal.tsx | 1 - .../components/snapshots/AppSnapshotRestore.jsx | 2 +- web/src/components/snapshots/AppSnapshots.jsx | 2 +- .../components/snapshots/ConfigureSnapshots.jsx | 4 ++-- .../components/snapshots/DummySnapshotRow.jsx | 2 -- .../snapshots/GettingStartedSnapshots.jsx | 1 - .../components/snapshots/SnapshotDetails.jsx | 2 +- .../snapshots/SnapshotInstallationBox.jsx | 2 +- .../components/snapshots/SnapshotRestore.jsx | 2 +- web/src/components/snapshots/SnapshotRow.jsx | 5 ++--- .../components/snapshots/SnapshotSchedule.jsx | 2 +- .../components/snapshots/SnapshotSettings.tsx | 2 +- .../snapshots/SnapshotStorageDestination.tsx | 15 ++++++--------- web/src/components/snapshots/Snapshots.jsx | 2 +- .../components/snapshots/SnapshotsWrapper.jsx | 2 +- .../snapshots/UploadCACertificate.jsx | 1 - web/src/components/static/NotFound.jsx | 4 ++-- .../components/static/UnsupportedBrowser.jsx | 5 ++--- web/src/components/tree/KotsApplicationTree.tsx | 4 ++-- .../troubleshoot/AnalyzerFileTree.jsx | 6 +++--- .../troubleshoot/AnalyzerInsights.jsx | 4 ++-- .../troubleshoot/AnalyzerRedactorReport.jsx | 2 +- .../troubleshoot/AnalyzerRedactorReportRow.jsx | 4 ++-- .../troubleshoot/ConfigureRedactorsModal.jsx | 2 +- .../troubleshoot/GenerateSupportBundle.jsx | 7 ++----- .../troubleshoot/GenerateSupportBundleModal.tsx | 2 +- .../troubleshoot/PodAnalyzerDetails.jsx | 5 ++--- .../troubleshoot/PreflightsProgress.tsx | 1 - .../troubleshoot/SupportBundleAnalysis.jsx | 13 ++++--------- .../SupportBundleCollectProgress.jsx | 1 - .../troubleshoot/SupportBundleList.tsx | 1 - .../troubleshoot/SupportBundleRow.tsx | 4 ++-- .../troubleshoot/TroubleshootContainer.tsx | 2 +- .../troubleshoot/UploadSupportBundleModal.jsx | 4 ++-- .../WatchSidebarItem/HelmChartSidebarItem.jsx | 1 - .../WatchSidebarItem/KotsSidebarItem.jsx | 1 - web/src/context/ToastContext.tsx | 2 +- .../AddNewApp/components/InstallWithHelm.tsx | 2 +- web/src/features/App/PreflightIcon.tsx | 1 - web/src/features/App/api/getApps.test.jsx | 1 - web/src/features/App/api/getApps.tsx | 6 ++---- .../features/AppConfig/components/AppConfig.tsx | 2 +- .../AppConfig/components/ConfigInfo.jsx | 1 - .../AppVersionHistory/AppVersionHistoryRow.tsx | 2 +- .../features/AppVersionHistory/YamlErrors.jsx | 1 - .../Auth/components/SecureAdminConsole.tsx | 8 ++++---- .../components/AirgapUploadProgress.jsx | 6 ++---- .../features/Dashboard/components/AppStatus.tsx | 4 ++-- .../features/Dashboard/components/Dashboard.tsx | 2 +- .../components/DashboardGitOpsCard.jsx | 1 - .../components/DashboardGraphsCard.tsx | 6 +++--- .../components/DashboardLicenseCard.tsx | 4 ++-- .../components/DashboardSnapshotsCard.tsx | 2 +- .../components/DashboardVersionCard.tsx | 4 ++-- .../Dashboard/components/DumbComponent.jsx | 12 ------------ .../Dashboard/components/LicenseFields.tsx | 1 - .../features/Gitops/GitOpsDeploymentManager.jsx | 2 +- .../features/Gitops/components/AppGitops.jsx | 2 +- .../features/Gitops/components/AppSelector.jsx | 1 - .../components/GitOpsProviderSelector.jsx | 2 +- .../Gitops/components/GitOpsRepoDetails.jsx | 2 +- .../Gitops/components/SetupProvider.jsx | 2 +- .../components/modals/ConnectionModal.jsx | 1 - .../Gitops/components/modals/DisableModal.jsx | 1 - web/src/features/Gitops/context.js | 4 ++-- web/src/features/Gitops/utils.js | 1 - web/src/features/VersionDiff/VersionDiff.tsx | 4 ++-- web/src/features/VersionDiff/ViewDiffButton.tsx | 1 - web/src/index.tsx | 1 - web/src/routes/RootRoutes.tsx | 17 ----------------- .../stories/AutomaticUpdatesModal.stories.tsx | 1 - web/src/stories/BackupRestoreModal.stories.tsx | 1 - web/src/stories/ChangePasswordModal.stories.tsx | 1 - web/src/stories/CodeSnippet.stories.tsx | 1 - .../stories/ConfigureRedactorsModal.stories.tsx | 1 - web/src/stories/DeleteRedactorModal.stories.tsx | 1 - web/src/stories/DeleteSnapshotModal.stories.tsx | 1 - web/src/stories/DeployWarningModal.stories.tsx | 1 - web/src/stories/ErrorModal.stories.tsx | 1 - web/src/stories/HelmDeployModal.stories.tsx | 1 - web/src/stories/Icons.stories.tsx | 1 - .../stories/RestoreSnapshotModal.stories.tsx | 10 ++++------ web/src/stories/ShowAllModal.stories.tsx | 1 - web/src/stories/ShowDetailsModal.stories.tsx | 1 - web/src/stories/ShowLogsModal.stories.tsx | 4 ++-- web/src/stories/SkipPrelightsModal.stories.tsx | 1 - .../SnapshotDifferencesModal.stories.tsx | 1 - web/src/stories/Toast.stories.tsx | 1 - web/src/stories/UploadSupportBundle.stories.tsx | 1 - .../stories/ViewSnapshotLogsModal.stories.tsx | 1 - web/src/utilities/react-router-utilities.tsx | 2 +- web/tsconfig.json | 2 +- 189 files changed, 231 insertions(+), 366 deletions(-) delete mode 100644 web/src/features/Dashboard/components/DumbComponent.jsx delete mode 100644 web/src/routes/RootRoutes.tsx diff --git a/web/babel.config.js b/web/babel.config.js index aa825ef353..d1033e4c6c 100644 --- a/web/babel.config.js +++ b/web/babel.config.js @@ -1,11 +1,11 @@ module.exports = { presets: [ "@babel/preset-env", - "@babel/preset-react", - "@babel/preset-typescript" + ["@babel/preset-react", { runtime: "automatic" }], + "@babel/preset-typescript", ], plugins: [ ["@babel/plugin-proposal-class-properties", { loose: true }], - ["@babel/plugin-proposal-optional-chaining", { loose: true }] - ] + ["@babel/plugin-proposal-optional-chaining", { loose: true }], + ], }; diff --git a/web/src/ConnectionTerminated.jsx b/web/src/ConnectionTerminated.jsx index 8656770123..ecb0929e72 100644 --- a/web/src/ConnectionTerminated.jsx +++ b/web/src/ConnectionTerminated.jsx @@ -1,8 +1,8 @@ -import * as React from "react"; -import { Utilities } from "./utilities/utilities"; +import { Component } from "react"; import fetch from "./utilities/fetchWithTimeout"; +import { Utilities } from "./utilities/utilities"; -export default class ConnectionTerminated extends React.Component { +export default class ConnectionTerminated extends Component { state = { seconds: 1, reconnectAttempts: 1, diff --git a/web/src/Root.tsx b/web/src/Root.tsx index 61fb86c592..4144a5d2b0 100644 --- a/web/src/Root.tsx +++ b/web/src/Root.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useReducer } from "react"; +import { useReducer, useEffect, createContext } from "react"; import { createBrowserHistory } from "history"; import { Navigate, Route, Routes, useNavigate } from "react-router-dom"; import { Helmet } from "react-helmet"; @@ -70,7 +70,7 @@ let history = connectHistory(browserHistory); // TODO: pull in the react router hook -const ThemeContext = React.createContext({ +const ThemeContext = createContext({ setThemeState: (themeState?: ThemeState) => { console.log("setThemeState used before being set", themeState); }, diff --git a/web/src/components/AirgapUploadProgress.jsx b/web/src/components/AirgapUploadProgress.jsx index dec45234ad..f77130865a 100644 --- a/web/src/components/AirgapUploadProgress.jsx +++ b/web/src/components/AirgapUploadProgress.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Loader from "./shared/Loader"; import { formatByteSize, @@ -10,9 +9,10 @@ import fetch from "../utilities/fetchWithTimeout"; import "@src/scss/components/AirgapUploadProgress.scss"; import get from "lodash/get"; import Icon from "./Icon"; +import { Component } from "react"; let processingImages = null; -class AirgapUploadProgress extends React.Component { +class AirgapUploadProgress extends Component { constructor(props) { super(props); diff --git a/web/src/components/AppConfigRenderer.jsx b/web/src/components/AppConfigRenderer.jsx index 72f5f2733e..73073e968a 100644 --- a/web/src/components/AppConfigRenderer.jsx +++ b/web/src/components/AppConfigRenderer.jsx @@ -1,11 +1,11 @@ -import React from "react"; import ConfigRender from "./config_render/ConfigRender"; import PropTypes from "prop-types"; import map from "lodash/map"; import sortBy from "lodash/sortBy"; import keyBy from "lodash/keyBy"; +import { Component } from "react"; -export class AppConfigRenderer extends React.Component { +export class AppConfigRenderer extends Component { static propTypes = { groups: PropTypes.array.isRequired, // Config groups items to render handleChange: PropTypes.func, diff --git a/web/src/components/BackupRestore.jsx b/web/src/components/BackupRestore.jsx index b1ed3c1807..57ada916df 100644 --- a/web/src/components/BackupRestore.jsx +++ b/web/src/components/BackupRestore.jsx @@ -1,18 +1,17 @@ -import * as React from "react"; import { Link } from "react-router-dom"; import { KotsPageTitle } from "@components/Head"; import isEmpty from "lodash/isEmpty"; import "../scss/components/UploadLicenseFile.scss"; -import { Utilities } from "../utilities/utilities"; import RestoreSnapshotRow from "./RestoreSnapshotRow"; import UploadLicenseFile from "./UploadLicenseFile"; import Loader from "./shared/Loader"; import ConfigureSnapshots from "./snapshots/ConfigureSnapshots"; import Icon from "./Icon"; +import { Component } from "react"; -class BackupRestore extends React.Component { +class BackupRestore extends Component { state = { backups: [], isLoadingBackups: false, diff --git a/web/src/components/Head/KotsPageTitle.tsx b/web/src/components/Head/KotsPageTitle.tsx index addcdd1fbf..49105bee97 100644 --- a/web/src/components/Head/KotsPageTitle.tsx +++ b/web/src/components/Head/KotsPageTitle.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { useParams } from "react-router-dom"; import { Helmet } from "react-helmet"; diff --git a/web/src/components/Home.jsx b/web/src/components/Home.jsx index 0322b6bc6b..0321a60a0c 100644 --- a/web/src/components/Home.jsx +++ b/web/src/components/Home.jsx @@ -1,11 +1,11 @@ -import * as React from "react"; import { Route, Routes } from "react-router-dom"; import NotFound from "../static/NotFound"; import GitHubAuthBegin from "./GitHubAuthBegin"; import GitHubAuthCallback from "./GitHubAuthCallback"; +import { Component } from "react"; -export default class GitHubAuth extends React.Component { +export default class GitHubAuth extends Component { render() { return (
diff --git a/web/src/components/Icon.tsx b/web/src/components/Icon.tsx index bb35490f0d..f586583c4d 100644 --- a/web/src/components/Icon.tsx +++ b/web/src/components/Icon.tsx @@ -1,5 +1,4 @@ // Icon.jsx -import React from "react"; import IcoMoon from "react-icomoon"; import iconSet from "./selection.json"; import "@src/css/icon.css"; diff --git a/web/src/components/LicenseUploadProgress.jsx b/web/src/components/LicenseUploadProgress.jsx index a21bdbf0a3..1a0b7a1952 100644 --- a/web/src/components/LicenseUploadProgress.jsx +++ b/web/src/components/LicenseUploadProgress.jsx @@ -1,9 +1,8 @@ -import React from "react"; -import { Utilities } from "@src/utilities/utilities"; +import { Component } from "react"; import { Repeater } from "@src/utilities/repeater"; import "@src/scss/components/AirgapUploadProgress.scss"; -class LicenseUploadProgress extends React.Component { +class LicenseUploadProgress extends Component { constructor(props) { super(props); diff --git a/web/src/components/PreflightRenderer.tsx b/web/src/components/PreflightRenderer.tsx index fc5981189b..2b234c3497 100644 --- a/web/src/components/PreflightRenderer.tsx +++ b/web/src/components/PreflightRenderer.tsx @@ -1,4 +1,3 @@ -import React from "react"; import classNames from "classnames"; // TODO: find replacement for react-remarkable // @ts-ignore diff --git a/web/src/components/PreflightResultErrors.tsx b/web/src/components/PreflightResultErrors.tsx index a8be328232..b081c218d6 100644 --- a/web/src/components/PreflightResultErrors.tsx +++ b/web/src/components/PreflightResultErrors.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useReducer } from "react"; +import { useEffect, useReducer, useState } from "react"; import { useParams } from "react-router-dom"; import MonacoEditor from "@monaco-editor/react"; import CodeSnippet from "./shared/CodeSnippet"; @@ -63,10 +63,10 @@ const PreflightResultErrors = (props: Props) => { const { slug, sequence = "0" } = useParams() as KotsParams; const selectedApp = useSelectedApp(); - const [previousAppSlug, setPreviousAppSlug] = React.useState(slug); - const [previousSequence, setPreviousSequence] = React.useState< - string | undefined - >(sequence); + const [previousAppSlug, setPreviousAppSlug] = useState(slug); + const [previousSequence, setPreviousSequence] = useState( + sequence + ); const getPreflightCommand = async () => { try { diff --git a/web/src/components/PreflightResultPage.tsx b/web/src/components/PreflightResultPage.tsx index 7b10999629..6007c67e1a 100644 --- a/web/src/components/PreflightResultPage.tsx +++ b/web/src/components/PreflightResultPage.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import { Link, useNavigate } from "react-router-dom"; import { KotsPageTitle } from "@components/Head"; import { useParams, useLocation } from "react-router-dom"; diff --git a/web/src/components/RestoreCompleted.jsx b/web/src/components/RestoreCompleted.jsx index 5a68c1c5aa..442b756e1a 100644 --- a/web/src/components/RestoreCompleted.jsx +++ b/web/src/components/RestoreCompleted.jsx @@ -1,8 +1,8 @@ -import * as React from "react"; +import { Component } from "react"; import { Link } from "react-router-dom"; import Icon from "./Icon"; -export default class RestoreCompleted extends React.Component { +export default class RestoreCompleted extends Component { render() { return (
diff --git a/web/src/components/RestoreSnapshotRow.jsx b/web/src/components/RestoreSnapshotRow.jsx index 2be4166a9b..845f6bc5c6 100644 --- a/web/src/components/RestoreSnapshotRow.jsx +++ b/web/src/components/RestoreSnapshotRow.jsx @@ -1,10 +1,9 @@ -import React from "react"; - +import { Component } from "react"; import { Utilities } from "../utilities/utilities"; import "../scss/components/RestoreSnapshotRow.scss"; import Icon from "./Icon"; -class RestoreSnapshotRow extends React.Component { +class RestoreSnapshotRow extends Component { state = { toggleVolumes: false, isLoadingBackupInfo: false, diff --git a/web/src/components/UploadAirgapBundle.jsx b/web/src/components/UploadAirgapBundle.jsx index a399b0d7e0..036c45d1ae 100644 --- a/web/src/components/UploadAirgapBundle.jsx +++ b/web/src/components/UploadAirgapBundle.jsx @@ -1,4 +1,4 @@ -import * as React from "react"; +import { Component } from "react"; import classNames from "classnames"; import { KotsPageTitle } from "@components/Head"; import isEmpty from "lodash/isEmpty"; @@ -8,7 +8,6 @@ import MountAware from "@src/components/shared/MountAware"; import AirgapUploadProgress from "@features/Dashboard/components/AirgapUploadProgress"; import LicenseUploadProgress from "./LicenseUploadProgress"; import AirgapRegistrySettings from "./shared/AirgapRegistrySettings"; -import { Utilities } from "../utilities/utilities"; import { AirgapUploader } from "../utilities/airgapUploader"; import { withRouter } from "@src/utilities/react-router-utilities"; @@ -21,7 +20,7 @@ const COMMON_ERRORS = { "no such host": "No such host", }; -class UploadAirgapBundle extends React.Component { +class UploadAirgapBundle extends Component { state = { bundleFile: {}, fileUploading: false, diff --git a/web/src/components/UploadLicenseFile.tsx b/web/src/components/UploadLicenseFile.tsx index 9af2e5e3c4..08113fdfec 100644 --- a/web/src/components/UploadLicenseFile.tsx +++ b/web/src/components/UploadLicenseFile.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useReducer } from "react"; +import { useEffect, useReducer } from "react"; import { Link, useNavigate } from "react-router-dom"; import yaml from "js-yaml"; import isEmpty from "lodash/isEmpty"; diff --git a/web/src/components/apps/AppDetailPage.tsx b/web/src/components/apps/AppDetailPage.tsx index aa0b2d0ef1..9e9cbf90cd 100644 --- a/web/src/components/apps/AppDetailPage.tsx +++ b/web/src/components/apps/AppDetailPage.tsx @@ -1,4 +1,4 @@ -import React, { Fragment, useEffect, useReducer, useState } from "react"; +import { Fragment, useReducer, useEffect, useState } from "react"; import classNames from "classnames"; import { Outlet, useNavigate, useParams } from "react-router-dom"; import Modal from "react-modal"; diff --git a/web/src/components/apps/AppIdentityServiceSettings.jsx b/web/src/components/apps/AppIdentityServiceSettings.jsx index cbe1aa8a53..582ba18025 100644 --- a/web/src/components/apps/AppIdentityServiceSettings.jsx +++ b/web/src/components/apps/AppIdentityServiceSettings.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import IdentityProviders from "@src/components/identity/IdentityProviders"; import "@src/scss/components/identity/IdentityManagement.scss"; diff --git a/web/src/components/apps/AppLicense.tsx b/web/src/components/apps/AppLicense.tsx index b17331f848..cd83b7aee7 100644 --- a/web/src/components/apps/AppLicense.tsx +++ b/web/src/components/apps/AppLicense.tsx @@ -1,4 +1,4 @@ -import React, { useReducer, useEffect } from "react"; +import { useReducer, useEffect, ReactNode } from "react"; import { KotsPageTitle } from "@components/Head"; // @ts-ignore import Dropzone from "react-dropzone"; @@ -323,7 +323,7 @@ const AppLicenseComponent = () => { const gitops = app.downstream?.gitops; const appName = app?.name || "Your application"; - let nextModalBody: React.ReactNode; + let nextModalBody: ReactNode; if (isHelmManaged) { const sequence = app?.downstream?.currentVersion?.sequence; const versionLabel = app?.downstream?.currentVersion?.versionLabel; diff --git a/web/src/components/apps/AppRegistrySettings.jsx b/web/src/components/apps/AppRegistrySettings.jsx index fdb91c74fb..702e60f9fd 100644 --- a/web/src/components/apps/AppRegistrySettings.jsx +++ b/web/src/components/apps/AppRegistrySettings.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { KotsPageTitle } from "@components/Head"; import AirgapRegistrySettings from "../shared/AirgapRegistrySettings"; diff --git a/web/src/components/apps/AppVersionHistory.tsx b/web/src/components/apps/AppVersionHistory.tsx index a0a9277c3d..69fff01985 100644 --- a/web/src/components/apps/AppVersionHistory.tsx +++ b/web/src/components/apps/AppVersionHistory.tsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { ChangeEvent, Component, Fragment } from "react"; import { Link } from "react-router-dom"; import dayjs from "dayjs"; import relativeTime from "dayjs/plugin/relativeTime"; @@ -365,7 +365,7 @@ class AppVersionHistory extends Component { } }; - setPageSize = (e: React.ChangeEvent) => { + setPageSize = (e: ChangeEvent) => { this.setState( { pageSize: parseInt(e.target.value), currentPage: 0 }, () => { @@ -1456,7 +1456,7 @@ class AppVersionHistory extends Component { } return ( - + { }} )} - + ); }; diff --git a/web/src/components/apps/EmbeddedClusterManagement.tsx b/web/src/components/apps/EmbeddedClusterManagement.tsx index 55834092c9..59e8dc7a6d 100644 --- a/web/src/components/apps/EmbeddedClusterManagement.tsx +++ b/web/src/components/apps/EmbeddedClusterManagement.tsx @@ -1,7 +1,7 @@ import { useQuery } from "@tanstack/react-query"; import classNames from "classnames"; import MaterialReactTable, { MRT_ColumnDef } from "material-react-table"; -import React, { ChangeEvent, useMemo, useReducer, useState } from "react"; +import { ChangeEvent, useMemo, useReducer, useState } from "react"; import Modal from "react-modal"; import { Link, useParams } from "react-router-dom"; diff --git a/web/src/components/apps/EmbeddedClusterViewNode.jsx b/web/src/components/apps/EmbeddedClusterViewNode.jsx index c138aa79c5..8ec80a3658 100644 --- a/web/src/components/apps/EmbeddedClusterViewNode.jsx +++ b/web/src/components/apps/EmbeddedClusterViewNode.jsx @@ -1,5 +1,5 @@ import { MaterialReactTable } from "material-react-table"; -import React, { useMemo } from "react"; +import { useMemo } from "react"; import { useQuery } from "@tanstack/react-query"; import { Link, useParams } from "react-router-dom"; import Loader from "@components/shared/Loader"; diff --git a/web/src/components/apps/KurlClusterManagement.jsx b/web/src/components/apps/KurlClusterManagement.jsx index 46f6ade1fd..4052527bf6 100644 --- a/web/src/components/apps/KurlClusterManagement.jsx +++ b/web/src/components/apps/KurlClusterManagement.jsx @@ -1,4 +1,4 @@ -import React, { Component, Fragment } from "react"; +import { Component, Fragment } from "react"; import classNames from "classnames"; import dayjs from "dayjs"; import { KotsPageTitle } from "@components/Head"; diff --git a/web/src/components/apps/KurlNodeRow.jsx b/web/src/components/apps/KurlNodeRow.jsx index 4b95385cfb..d363d13cb3 100644 --- a/web/src/components/apps/KurlNodeRow.jsx +++ b/web/src/components/apps/KurlNodeRow.jsx @@ -1,4 +1,3 @@ -import React from "react"; import classNames from "classnames"; import Loader from "../shared/Loader"; import { rbacRoles } from "../../constants/rbac"; diff --git a/web/src/components/apps/LicenseTester.jsx b/web/src/components/apps/LicenseTester.jsx index affd32e7db..104d1087a8 100644 --- a/web/src/components/apps/LicenseTester.jsx +++ b/web/src/components/apps/LicenseTester.jsx @@ -1,6 +1,6 @@ import useLicense from "@features/App/api/getLicense"; import { useLicenseWithIntercept } from "@features/App/api/useLicense"; -import React, { useEffect } from "react"; +import { useEffect } from "react"; import { usePrevious } from "@src/hooks/usePrevious"; const LicenseTester = ({ appSlug, setLoader }) => { diff --git a/web/src/components/clusters/GitOps.tsx b/web/src/components/clusters/GitOps.tsx index e8ddac38b3..10fc7b0237 100644 --- a/web/src/components/clusters/GitOps.tsx +++ b/web/src/components/clusters/GitOps.tsx @@ -1,4 +1,4 @@ -import * as React from "react"; +import { Component } from "react"; import { KotsPageTitle } from "@components/Head"; import GitOpsDeploymentManager from "../../features/Gitops/GitOpsDeploymentManager"; import { GitOpsProvider } from "../../features/Gitops/context"; @@ -9,7 +9,7 @@ import "../../scss/components/watches/WatchCard.scss"; interface Props { appName: string; } -export class GitOps extends React.Component { +export class GitOps extends Component { render() { return ( diff --git a/web/src/components/config_render/ConfigCheckbox.tsx b/web/src/components/config_render/ConfigCheckbox.tsx index ffd2e37bef..e31635a3e7 100644 --- a/web/src/components/config_render/ConfigCheckbox.tsx +++ b/web/src/components/config_render/ConfigCheckbox.tsx @@ -1,4 +1,4 @@ -import React, { createRef } from "react"; +import { ChangeEvent, Component, createRef } from "react"; // TODO: add type checking support for react-remarkable or add a global ignore // @ts-ignore import Markdown from "react-remarkable"; @@ -26,10 +26,10 @@ type Props = { recommended: boolean; }; -export default class ConfigCheckbox extends React.Component { +export default class ConfigCheckbox extends Component { private checkbox = createRef(); - handleOnChange = (e: React.ChangeEvent): void => { + handleOnChange = (e: ChangeEvent): void => { const { handleOnChange, name } = this.props; var val = e.target.checked ? "1" : "0"; if (this.props.handleOnChange && typeof handleOnChange === "function") { diff --git a/web/src/components/config_render/ConfigFileInput.jsx b/web/src/components/config_render/ConfigFileInput.jsx index 03d293770c..63c152f080 100644 --- a/web/src/components/config_render/ConfigFileInput.jsx +++ b/web/src/components/config_render/ConfigFileInput.jsx @@ -1,11 +1,10 @@ -import React from "react"; +import { Component } from "react"; import FileInput from "./FileInput"; import ConfigItemTitle from "./ConfigItemTitle"; import map from "lodash/map"; -import { Utilities } from "../../utilities/utilities"; import Markdown from "react-remarkable"; -export default class ConfigFileInput extends React.Component { +export default class ConfigFileInput extends Component { handleOnChange = (files) => { if (this.props.handleChange) { if (this.props.repeatable) { diff --git a/web/src/components/config_render/ConfigGroup.jsx b/web/src/components/config_render/ConfigGroup.jsx index 96dcf41ce6..352a05e9e9 100644 --- a/web/src/components/config_render/ConfigGroup.jsx +++ b/web/src/components/config_render/ConfigGroup.jsx @@ -1,6 +1,5 @@ -import React from "react"; +import { createRef } from "react"; import Markdown from "react-remarkable"; -import each from "lodash/each"; import some from "lodash/some"; import isEmpty from "lodash/isEmpty"; import { ConfigService } from "../../services/ConfigService"; @@ -12,11 +11,11 @@ import ConfigItemTitle from "./ConfigItemTitle"; import ConfigCheckbox from "./ConfigCheckbox"; import ConfigFileInput from "./ConfigFileInput"; import { setOrder } from "./ConfigUtil"; -import { ConfigWrapper, ConfigItems } from "./ConfigComponents"; +import { ConfigWrapper } from "./ConfigComponents"; import Icon from "../Icon"; const ConfigGroup = (props) => { - const markdownNode = React.createRef(); + const markdownNode = createRef(); const handleItemChange = (itemName, value, data) => { if (props.handleChange) { diff --git a/web/src/components/config_render/ConfigGroups.jsx b/web/src/components/config_render/ConfigGroups.jsx index e87ccf66a1..d0c8c7059e 100644 --- a/web/src/components/config_render/ConfigGroups.jsx +++ b/web/src/components/config_render/ConfigGroups.jsx @@ -1,7 +1,7 @@ -import React from "react"; +import { Component } from "react"; import ConfigGroup from "./ConfigGroup"; -export default class ConfigGroups extends React.Component { +export default class ConfigGroups extends Component { handleGroupChange = (groupName, itemName, value, data) => { if (this.props.handleChange) { this.props.handleChange(groupName, itemName, value, data); diff --git a/web/src/components/config_render/ConfigInput.jsx b/web/src/components/config_render/ConfigInput.jsx index 38b34cdc97..975f0a2be4 100644 --- a/web/src/components/config_render/ConfigInput.jsx +++ b/web/src/components/config_render/ConfigInput.jsx @@ -1,4 +1,4 @@ -import React from "react"; +import { Component } from "react"; import ConfigItemTitle from "./ConfigItemTitle"; import Markdown from "react-remarkable"; import { setOrder } from "./ConfigUtil"; @@ -6,7 +6,7 @@ import { ConfigWrapper } from "./ConfigComponents"; import Icon from "../Icon"; import InputField from "@components/shared/forms/InputField"; -export default class ConfigInput extends React.Component { +export default class ConfigInput extends Component { constructor(props) { super(props); this.state = { diff --git a/web/src/components/config_render/ConfigItemTitle.jsx b/web/src/components/config_render/ConfigItemTitle.jsx index 8787faa82b..7a22cafdcc 100644 --- a/web/src/components/config_render/ConfigItemTitle.jsx +++ b/web/src/components/config_render/ConfigItemTitle.jsx @@ -1,9 +1,8 @@ -import React from "react"; +import { Component } from "react"; import Markdown from "react-remarkable"; import classNames from "classnames"; -import { setOrder } from "./ConfigUtil"; -export default class ConfigItemTitle extends React.Component { +export default class ConfigItemTitle extends Component { render() { const { title, diff --git a/web/src/components/config_render/ConfigRadio.jsx b/web/src/components/config_render/ConfigRadio.jsx index 451f4bfb89..60c7446155 100644 --- a/web/src/components/config_render/ConfigRadio.jsx +++ b/web/src/components/config_render/ConfigRadio.jsx @@ -1,7 +1,7 @@ -import React from "react"; +import { Component } from "react"; import get from "lodash/get"; -export default class ConfigRadio extends React.Component { +export default class ConfigRadio extends Component { handleOnChange = (e) => { const { group } = this.props; if ( diff --git a/web/src/components/config_render/ConfigRender.jsx b/web/src/components/config_render/ConfigRender.jsx index 64e6153400..65bed6fb60 100644 --- a/web/src/components/config_render/ConfigRender.jsx +++ b/web/src/components/config_render/ConfigRender.jsx @@ -1,14 +1,13 @@ -import React from "react"; +import { Component } from "react"; import keyBy from "lodash/keyBy"; import find from "lodash/find"; import debounce from "lodash/debounce"; -import uniqBy from "lodash/uniqBy"; import _ from "lodash/core"; import ConfigGroups from "./ConfigGroups"; import { ConfigService } from "../../services/ConfigService"; -export default class ConfigRender extends React.Component { +export default class ConfigRender extends Component { constructor(props) { super(props); this.state = { diff --git a/web/src/components/config_render/ConfigSelectOne.jsx b/web/src/components/config_render/ConfigSelectOne.jsx index 04fcb45318..83fad612e0 100644 --- a/web/src/components/config_render/ConfigSelectOne.jsx +++ b/web/src/components/config_render/ConfigSelectOne.jsx @@ -1,4 +1,4 @@ -import React from "react"; +import { Component } from "react"; import map from "lodash/map"; import isEmpty from "lodash/isEmpty"; @@ -9,7 +9,7 @@ import { setOrder } from "./ConfigUtil"; import { ConfigWrapper } from "./ConfigComponents"; import Icon from "../Icon"; -export default class ConfigSelectOne extends React.Component { +export default class ConfigSelectOne extends Component { handleOnChange = (itemName, val) => { if ( this.props.handleOnChange && diff --git a/web/src/components/config_render/ConfigTextarea.jsx b/web/src/components/config_render/ConfigTextarea.jsx index 2cc468013b..9ab1ca90bd 100644 --- a/web/src/components/config_render/ConfigTextarea.jsx +++ b/web/src/components/config_render/ConfigTextarea.jsx @@ -1,13 +1,13 @@ -import React from "react"; +import { Component, createRef } from "react"; import ConfigItemTitle from "./ConfigItemTitle"; import Markdown from "react-remarkable"; import { setOrder } from "./ConfigUtil"; import { ConfigWrapper } from "./ConfigComponents"; -export default class ConfigTextarea extends React.Component { +export default class ConfigTextarea extends Component { constructor(props) { super(props); - this.textareaRef = React.createRef(); + this.textareaRef = createRef(); this.state = { textareaVal: "", focused: false, diff --git a/web/src/components/config_render/FileInput.jsx b/web/src/components/config_render/FileInput.jsx index 037719d6e5..f78984feba 100644 --- a/web/src/components/config_render/FileInput.jsx +++ b/web/src/components/config_render/FileInput.jsx @@ -1,10 +1,9 @@ -import React from "react"; -import map from "lodash/map"; +import { Component } from "react"; import after from "lodash/after"; import forEach from "lodash/forEach"; import Icon from "../Icon"; -export default class FileInput extends React.Component { +export default class FileInput extends Component { constructor(props) { super(props); this.state = { diff --git a/web/src/components/context/withTheme.jsx b/web/src/components/context/withTheme.jsx index 3b93c1e924..1eea7e7960 100644 --- a/web/src/components/context/withTheme.jsx +++ b/web/src/components/context/withTheme.jsx @@ -1,5 +1,5 @@ -import React from "react"; import { ThemeContext } from "@src/Root"; +import { useContext } from "react"; export default function withTheme(Component) { return function withThemeComponent(props) { @@ -12,7 +12,7 @@ export default function withTheme(Component) { } function useTheme() { - const context = React.useContext(ThemeContext); + const context = useContext(ThemeContext); if (context === undefined) { throw new Error("useTheme must be used within a ThemeProvider"); } diff --git a/web/src/components/gitops/GitOpsFlowIllustration.jsx b/web/src/components/gitops/GitOpsFlowIllustration.jsx index 31080c8d6b..c08189acc7 100644 --- a/web/src/components/gitops/GitOpsFlowIllustration.jsx +++ b/web/src/components/gitops/GitOpsFlowIllustration.jsx @@ -1,7 +1,7 @@ -import * as React from "react"; +import { Component } from "react"; import "../../scss/components/gitops/GitOpsFlowIllustration.scss"; -export default class GitOpsFlowIllustration extends React.Component { +export default class GitOpsFlowIllustration extends Component { render() { const useTag1 = ``; const useTag2 = ``; diff --git a/web/src/components/hooks/useDownloadValues.test.jsx b/web/src/components/hooks/useDownloadValues.test.jsx index 9e6cd4467f..d528d0da68 100644 --- a/web/src/components/hooks/useDownloadValues.test.jsx +++ b/web/src/components/hooks/useDownloadValues.test.jsx @@ -1,7 +1,6 @@ /** * @jest-environment jsdom */ -import React from "react"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { act, renderHook } from "@testing-library/react-hooks"; import { getValues, useDownloadValues } from "./useDownloadValues"; diff --git a/web/src/components/hooks/useSaveConfig.test.jsx b/web/src/components/hooks/useSaveConfig.test.jsx index 795bc06ed8..02e7447bde 100644 --- a/web/src/components/hooks/useSaveConfig.test.jsx +++ b/web/src/components/hooks/useSaveConfig.test.jsx @@ -1,7 +1,6 @@ /** * @jest-environment jsdom */ -import React from "react"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { renderHook } from "@testing-library/react-hooks"; import { useSaveConfig, putConfig } from "./useSaveConfig"; diff --git a/web/src/components/identity/Access.tsx b/web/src/components/identity/Access.tsx index d1bca16d11..7b3aff8946 100644 --- a/web/src/components/identity/Access.tsx +++ b/web/src/components/identity/Access.tsx @@ -1,4 +1,4 @@ -import React, { useEffect } from "react"; +import { useEffect } from "react"; import { useNavigate } from "react-router-dom"; // import NotFound from "../static/NotFound"; diff --git a/web/src/components/identity/AddRoleGroup.jsx b/web/src/components/identity/AddRoleGroup.jsx index d1e0820664..0364e2c38d 100644 --- a/web/src/components/identity/AddRoleGroup.jsx +++ b/web/src/components/identity/AddRoleGroup.jsx @@ -1,5 +1,3 @@ -import React from "react"; - export default function AddRoleGroup(props) { const { addGroup } = props; diff --git a/web/src/components/identity/AnnotationRow.jsx b/web/src/components/identity/AnnotationRow.jsx index 68e06e3481..88032c8fe7 100644 --- a/web/src/components/identity/AnnotationRow.jsx +++ b/web/src/components/identity/AnnotationRow.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import Icon from "../Icon"; export default class AnnotationRow extends Component { diff --git a/web/src/components/identity/ConfigureIngress.jsx b/web/src/components/identity/ConfigureIngress.jsx index 587ab678b9..624fd07075 100644 --- a/web/src/components/identity/ConfigureIngress.jsx +++ b/web/src/components/identity/ConfigureIngress.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { KotsPageTitle } from "@components/Head"; import Dropzone from "react-dropzone"; import isEmpty from "lodash/isEmpty"; diff --git a/web/src/components/identity/DummyRbacRow.jsx b/web/src/components/identity/DummyRbacRow.jsx index f27ca0136d..c7c2ebc51b 100644 --- a/web/src/components/identity/DummyRbacRow.jsx +++ b/web/src/components/identity/DummyRbacRow.jsx @@ -1,5 +1,3 @@ -import React from "react"; - export default function DummyRbacRow() { return (
diff --git a/web/src/components/identity/IdentityProviders.jsx b/web/src/components/identity/IdentityProviders.jsx index cf56e5c0e5..7e2cc650c2 100644 --- a/web/src/components/identity/IdentityProviders.jsx +++ b/web/src/components/identity/IdentityProviders.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { KotsPageTitle } from "@components/Head"; import ReactTooltip from "react-tooltip"; import isEmpty from "lodash/isEmpty"; diff --git a/web/src/components/identity/RBACGroupPolicyRow.jsx b/web/src/components/identity/RBACGroupPolicyRow.jsx index bc6af7eea6..4fccc0f4c5 100644 --- a/web/src/components/identity/RBACGroupPolicyRow.jsx +++ b/web/src/components/identity/RBACGroupPolicyRow.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import Icon from "../Icon"; export default class RBACGroupPolicyRow extends Component { diff --git a/web/src/components/layout/SidebarLayout/SidebarLayout.jsx b/web/src/components/layout/SidebarLayout/SidebarLayout.jsx index 9cbe4b6a93..6becb1529f 100644 --- a/web/src/components/layout/SidebarLayout/SidebarLayout.jsx +++ b/web/src/components/layout/SidebarLayout/SidebarLayout.jsx @@ -1,4 +1,3 @@ -import React from "react"; import classNames from "classnames"; export default function SidebarLayout(props) { diff --git a/web/src/components/modals/AutomaticUpdatesModal.tsx b/web/src/components/modals/AutomaticUpdatesModal.tsx index 09ab6daef7..5f2812b0e8 100644 --- a/web/src/components/modals/AutomaticUpdatesModal.tsx +++ b/web/src/components/modals/AutomaticUpdatesModal.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import { Component } from "react"; import Modal from "react-modal"; import Select from "react-select"; import find from "lodash/find"; @@ -96,10 +96,7 @@ type State = { updateCheckerSpec: string; }; -export default class AutomaticUpdatesModal extends React.Component< - Props, - State -> { +export default class AutomaticUpdatesModal extends Component { constructor(props: Props) { super(props); let selectedSchedule = find(SCHEDULES, { value: props.updateCheckerSpec }); diff --git a/web/src/components/modals/BackupRestoreModal.jsx b/web/src/components/modals/BackupRestoreModal.jsx index b6946e47d7..89b69674a4 100644 --- a/web/src/components/modals/BackupRestoreModal.jsx +++ b/web/src/components/modals/BackupRestoreModal.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; import Select from "react-select"; diff --git a/web/src/components/modals/ChangePasswordModal/ChangePasswordForm.jsx b/web/src/components/modals/ChangePasswordModal/ChangePasswordForm.jsx index 55c9b4a426..01a50bdb83 100644 --- a/web/src/components/modals/ChangePasswordModal/ChangePasswordForm.jsx +++ b/web/src/components/modals/ChangePasswordModal/ChangePasswordForm.jsx @@ -1,6 +1,5 @@ -import React from "react"; +import { useState } from "react"; import InputField from "../../shared/forms/InputField"; -import { Utilities } from "@src/utilities/utilities"; import "@src/scss/components/modals/ChangePasswordModal/ChangePasswordForm.scss"; @@ -8,12 +7,12 @@ const ChangePasswordForm = ({ handleClose, handleSetPasswordChangeSuccessful, }) => { - const [err, setErr] = React.useState({ + const [err, setErr] = useState({ status: false, message: "", }); - const [loading, setLoading] = React.useState(false); - const [inputs, setInputs] = React.useState({ + const [loading, setLoading] = useState(false); + const [inputs, setInputs] = useState({ currentPassword: "", newPassword: "", confirmPassword: "", diff --git a/web/src/components/modals/ChangePasswordModal/ChangePasswordModal.jsx b/web/src/components/modals/ChangePasswordModal/ChangePasswordModal.jsx index 3897f25f54..b2e8257b01 100644 --- a/web/src/components/modals/ChangePasswordModal/ChangePasswordModal.jsx +++ b/web/src/components/modals/ChangePasswordModal/ChangePasswordModal.jsx @@ -1,4 +1,4 @@ -import React from "react"; +import { useEffect, useState } from "react"; import Modal from "react-modal"; import Warning from "../../shared/Warning"; import ChangePasswordForm from "./ChangePasswordForm"; @@ -9,9 +9,8 @@ import Icon from "@src/components/Icon"; const ChangePasswordModal = ({ closeModal, isOpen }) => { const [passwordChangeSuccessful, setPasswordChangeSuccessful] = - React.useState(false); - const [identityServiceEnabled, setIdentityServiceEnabled] = - React.useState(false); + useState(false); + const [identityServiceEnabled, setIdentityServiceEnabled] = useState(false); const handleClose = () => { closeModal(); @@ -21,7 +20,7 @@ const ChangePasswordModal = ({ closeModal, isOpen }) => { const handleSetPasswordChangeSuccessful = (val) => setPasswordChangeSuccessful(val); - React.useEffect(() => { + useEffect(() => { const getLoginInfo = async () => { try { const response = await fetch(`${process.env.API_ENDPOINT}/login/info`, { diff --git a/web/src/components/modals/DeleteRedactorModal.jsx b/web/src/components/modals/DeleteRedactorModal.jsx index 0dff837ff1..295c0eb396 100644 --- a/web/src/components/modals/DeleteRedactorModal.jsx +++ b/web/src/components/modals/DeleteRedactorModal.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; import { Utilities } from "../../utilities/utilities"; diff --git a/web/src/components/modals/DeleteSnapshotModal.tsx b/web/src/components/modals/DeleteSnapshotModal.tsx index 768c202ad5..58ef8dbe89 100644 --- a/web/src/components/modals/DeleteSnapshotModal.tsx +++ b/web/src/components/modals/DeleteSnapshotModal.tsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; import { Utilities } from "@src/utilities/utilities"; import { Snapshot } from "@src/types"; diff --git a/web/src/components/modals/ErrorModal.jsx b/web/src/components/modals/ErrorModal.jsx index feafe0c98e..fac5c35041 100644 --- a/web/src/components/modals/ErrorModal.jsx +++ b/web/src/components/modals/ErrorModal.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; import { Link } from "react-router-dom"; import Icon from "../Icon"; diff --git a/web/src/components/modals/RestoreSnapshotModal.jsx b/web/src/components/modals/RestoreSnapshotModal.jsx index ea88f951cc..fe1bbc88cb 100644 --- a/web/src/components/modals/RestoreSnapshotModal.jsx +++ b/web/src/components/modals/RestoreSnapshotModal.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; import { Utilities } from "../../utilities/utilities"; diff --git a/web/src/components/modals/ShowAllModal.jsx b/web/src/components/modals/ShowAllModal.jsx index 111a92add5..6ee0660d32 100644 --- a/web/src/components/modals/ShowAllModal.jsx +++ b/web/src/components/modals/ShowAllModal.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; export default function ShowAllModal(props) { diff --git a/web/src/components/modals/ShowDetailsModal.jsx b/web/src/components/modals/ShowDetailsModal.jsx index 0e01b00f62..ad03f29660 100644 --- a/web/src/components/modals/ShowDetailsModal.jsx +++ b/web/src/components/modals/ShowDetailsModal.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; import { Link } from "react-router-dom"; diff --git a/web/src/components/modals/ShowLogsModal.jsx b/web/src/components/modals/ShowLogsModal.jsx index 8067d76178..0f94dd9490 100644 --- a/web/src/components/modals/ShowLogsModal.jsx +++ b/web/src/components/modals/ShowLogsModal.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; import Loader from "../shared/Loader"; import { Link } from "react-router-dom"; diff --git a/web/src/components/modals/SnapshotDifferencesModal.tsx b/web/src/components/modals/SnapshotDifferencesModal.tsx index 75b1cce7be..07dc8ee4b0 100644 --- a/web/src/components/modals/SnapshotDifferencesModal.tsx +++ b/web/src/components/modals/SnapshotDifferencesModal.tsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; interface SnapshotDifferencesModalProps { diff --git a/web/src/components/modals/ViewSnapshotLogsModal.jsx b/web/src/components/modals/ViewSnapshotLogsModal.jsx index e35425bed0..5084dfb888 100644 --- a/web/src/components/modals/ViewSnapshotLogsModal.jsx +++ b/web/src/components/modals/ViewSnapshotLogsModal.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; import MonacoEditor from "@monaco-editor/react"; diff --git a/web/src/components/redactors/EditRedactor.tsx b/web/src/components/redactors/EditRedactor.tsx index 46679ee7f4..f93a5ac85f 100644 --- a/web/src/components/redactors/EditRedactor.tsx +++ b/web/src/components/redactors/EditRedactor.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useReducer } from "react"; +import { useEffect, useReducer } from "react"; import { Link, useParams, useNavigate } from "react-router-dom"; import { KotsPageTitle } from "@components/Head"; import AceEditor, { Marker } from "react-ace"; diff --git a/web/src/components/redactors/RedactorRow.jsx b/web/src/components/redactors/RedactorRow.jsx index 8ee30270c3..3d61f2d5d8 100644 --- a/web/src/components/redactors/RedactorRow.jsx +++ b/web/src/components/redactors/RedactorRow.jsx @@ -1,10 +1,10 @@ +import { Component } from "react"; import Icon from "@components/Icon"; -import React from "react"; import { Link } from "react-router-dom"; import { Utilities } from "../../utilities/utilities"; -class RedactorRow extends React.Component { +class RedactorRow extends Component { state = { redactorEnabled: false, }; diff --git a/web/src/components/redactors/Redactors.jsx b/web/src/components/redactors/Redactors.jsx index 27925d64b5..7c99c69342 100644 --- a/web/src/components/redactors/Redactors.jsx +++ b/web/src/components/redactors/Redactors.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { Link } from "react-router-dom"; import { withRouter } from "@src/utilities/react-router-utilities"; import { KotsPageTitle } from "@components/Head"; diff --git a/web/src/components/shared/AirgapRegistrySettings.tsx b/web/src/components/shared/AirgapRegistrySettings.tsx index 82e0471497..b2290806f3 100644 --- a/web/src/components/shared/AirgapRegistrySettings.tsx +++ b/web/src/components/shared/AirgapRegistrySettings.tsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { ChangeEvent, Component } from "react"; import { withRouter } from "@src/utilities/react-router-utilities"; import get from "lodash/get"; @@ -510,7 +510,7 @@ class AirgapRegistrySettings extends Component { className="tw-gap-0" placeholder="password" value={password || ""} - onChange={(e: React.ChangeEvent) => { + onChange={(e: ChangeEvent) => { this.handleFormChange("password", e.target.value); }} id={"airgap-registry-password"} diff --git a/web/src/components/shared/Avatar.jsx b/web/src/components/shared/Avatar.jsx index aaf544801e..8434772f65 100644 --- a/web/src/components/shared/Avatar.jsx +++ b/web/src/components/shared/Avatar.jsx @@ -1,8 +1,7 @@ -import * as React from "react"; - +import { Component } from "react"; import "../../scss/components/shared/Avatar.scss"; -export default class Avatar extends React.Component { +export default class Avatar extends Component { render() { return (
- {preText && React.isValidElement(preText) ? ( + {preText && isValidElement(preText) ? ( preText ) : (
diff --git a/web/src/components/shared/ConfigureGraphs.tsx b/web/src/components/shared/ConfigureGraphs.tsx index ee9e4d548e..4e7f538e58 100644 --- a/web/src/components/shared/ConfigureGraphs.tsx +++ b/web/src/components/shared/ConfigureGraphs.tsx @@ -1,4 +1,4 @@ -import * as React from "react"; +import { ChangeEvent } from "react"; const ConfigureGraphs = ({ toggleConfigureGraphs, @@ -14,7 +14,7 @@ const ConfigureGraphs = ({ promValue?: string; savingPromValue?: boolean; savingPromError?: string; - onPromValueChange?: (e: React.ChangeEvent) => void; + onPromValueChange?: (e: ChangeEvent) => void; placeholder?: string; }) => { return ( diff --git a/web/src/components/shared/DiffEditor.jsx b/web/src/components/shared/DiffEditor.jsx index 1ad63f2cc3..2f672112ae 100644 --- a/web/src/components/shared/DiffEditor.jsx +++ b/web/src/components/shared/DiffEditor.jsx @@ -1,9 +1,9 @@ -import * as React from "react"; +import { Component } from "react"; import { DiffEditor as MonacoDiffEditor } from "@monaco-editor/react"; import { diffContent } from "../../utilities/utilities"; -export default class DiffEditor extends React.Component { +export default class DiffEditor extends Component { state = { addedLines: 0, removedLines: 0, diff --git a/web/src/components/shared/EditConfigIcon.tsx b/web/src/components/shared/EditConfigIcon.tsx index 29d1d5b9ef..76e505edec 100644 --- a/web/src/components/shared/EditConfigIcon.tsx +++ b/web/src/components/shared/EditConfigIcon.tsx @@ -1,6 +1,5 @@ import { useSelectedApp } from "@features/App"; import { Version } from "@types"; -import React from "react"; import { Link } from "react-router-dom"; import { useIsHelmManaged } from "@src/components//hooks"; import Icon from "@components/Icon"; diff --git a/web/src/components/shared/ErrorBoundary.jsx b/web/src/components/shared/ErrorBoundary.jsx index f44b56d1f9..6cfdf9fdfd 100644 --- a/web/src/components/shared/ErrorBoundary.jsx +++ b/web/src/components/shared/ErrorBoundary.jsx @@ -1,7 +1,7 @@ -import React from "react"; +import { Component } from "react"; import Icon from "../Icon"; -export default class ErrorBoundaryComponent extends React.Component { +export default class ErrorBoundaryComponent extends Component { constructor(props) { super(props); this.state = { diff --git a/web/src/components/shared/FileTree.jsx b/web/src/components/shared/FileTree.jsx index bf69c2fdde..9896dab03a 100644 --- a/web/src/components/shared/FileTree.jsx +++ b/web/src/components/shared/FileTree.jsx @@ -1,7 +1,7 @@ -import * as React from "react"; +import { Component } from "react"; import { rootPath } from "../../utilities/utilities"; -export default class FileTree extends React.Component { +export default class FileTree extends Component { state = { selected: {}, }; diff --git a/web/src/components/shared/Footer.jsx b/web/src/components/shared/Footer.jsx index a1bfb68a27..cf603fb74b 100644 --- a/web/src/components/shared/Footer.jsx +++ b/web/src/components/shared/Footer.jsx @@ -1,10 +1,10 @@ -import * as React from "react"; +import { Component } from "react"; import semverjs from "semver"; import { getBuildVersion } from "@src/utilities/utilities"; import "@src/scss/components/shared/Footer.scss"; import Icon from "../Icon"; -export class Footer extends React.Component { +export class Footer extends Component { state = { targetKotsVersion: "", }; diff --git a/web/src/components/shared/InlineDropdown.jsx b/web/src/components/shared/InlineDropdown.jsx index dbe014d10d..c6045a524e 100644 --- a/web/src/components/shared/InlineDropdown.jsx +++ b/web/src/components/shared/InlineDropdown.jsx @@ -1,10 +1,10 @@ -import * as React from "react"; +import { Component } from "react"; import { Link } from "react-router-dom"; import ClickOutsideAction from "./ClickOutsideAction"; import "../../scss/components/shared/InlineDropdown.scss"; import Icon from "../Icon"; -export default class InlineDropdown extends React.Component { +export default class InlineDropdown extends Component { state = { showOptions: false, }; diff --git a/web/src/components/shared/Loader.tsx b/web/src/components/shared/Loader.tsx index ea8e32b35c..36303a7d6d 100644 --- a/web/src/components/shared/Loader.tsx +++ b/web/src/components/shared/Loader.tsx @@ -1,4 +1,4 @@ -import * as React from "react"; +import { Component } from "react"; import classNames from "classnames"; interface Props { @@ -7,7 +7,7 @@ interface Props { size?: string; } -export default class Loader extends React.Component { +export default class Loader extends Component { render() { const { className, displayBlock, size } = this.props; diff --git a/web/src/components/shared/MarkdownRenderer/MarkdownRenderer.jsx b/web/src/components/shared/MarkdownRenderer/MarkdownRenderer.jsx index 48a56b936b..ada4e7ac86 100644 --- a/web/src/components/shared/MarkdownRenderer/MarkdownRenderer.jsx +++ b/web/src/components/shared/MarkdownRenderer/MarkdownRenderer.jsx @@ -1,11 +1,11 @@ -import React from "react"; +import { Component } from "react"; import Markdown from "markdown-it"; import "@src/scss/components/shared/MarkdownRenderer.scss"; const md = Markdown(); -export default class MarkdownRenderer extends React.Component { +export default class MarkdownRenderer extends Component { componentDidMount() { const anchors = document .getElementById(this.props.id) diff --git a/web/src/components/shared/MountAware.jsx b/web/src/components/shared/MountAware.jsx index 2891ab368a..90cb9a7940 100644 --- a/web/src/components/shared/MountAware.jsx +++ b/web/src/components/shared/MountAware.jsx @@ -1,6 +1,6 @@ -import * as React from "react"; +import { Component } from "react"; -export default class MountAware extends React.Component { +export default class MountAware extends Component { componentDidMount() { if (this.props.onMount) { const element = document.getElementById("mount-aware-wrapper"); diff --git a/web/src/components/shared/NavBar.tsx b/web/src/components/shared/NavBar.tsx index 48ee8c0624..fb3e13c80b 100644 --- a/web/src/components/shared/NavBar.tsx +++ b/web/src/components/shared/NavBar.tsx @@ -1,4 +1,4 @@ -import React, { PureComponent } from "react"; +import { ChangeEvent, PureComponent } from "react"; import PropTypes from "prop-types"; import classNames from "classnames"; import { RouterProps, withRouter } from "@src/utilities/react-router-utilities"; @@ -47,7 +47,7 @@ export class NavBar extends PureComponent { refetchAppsList: PropTypes.func.isRequired, }; - handleLogOut = async (e: React.ChangeEvent) => { + handleLogOut = async (e: ChangeEvent) => { const { onLogoutError } = this.props; e.preventDefault(); try { diff --git a/web/src/components/shared/NavBarDropdown.jsx b/web/src/components/shared/NavBarDropdown.jsx index ae66180aef..8a401b1362 100644 --- a/web/src/components/shared/NavBarDropdown.jsx +++ b/web/src/components/shared/NavBarDropdown.jsx @@ -1,12 +1,12 @@ -import React from "react"; import { useNavigate } from "react-router-dom"; import Icon from "../Icon"; import ChangePasswordModal from "../modals/ChangePasswordModal/ChangePasswordModal"; +import { useEffect, useRef, useState } from "react"; const NavBarDropdown = ({ handleLogOut, isHelmManaged }) => { - const [showDropdown, setShowDropdown] = React.useState(false); - const [showModal, setShowModal] = React.useState(false); - const testRef = React.useRef(null); + const [showDropdown, setShowDropdown] = useState(false); + const [showModal, setShowModal] = useState(false); + const testRef = useRef(null); const navigate = useNavigate(); const closeModal = () => { setShowModal(false); @@ -27,7 +27,7 @@ const NavBarDropdown = ({ handleLogOut, isHelmManaged }) => { setShowDropdown(false); }; - React.useEffect(() => { + useEffect(() => { // focus the dropdown when open so when clicked outside, // the onBlur event triggers and closes the dropdown if (showDropdown) { diff --git a/web/src/components/shared/Pager.jsx b/web/src/components/shared/Pager.jsx index e1a891c65d..8de503e870 100644 --- a/web/src/components/shared/Pager.jsx +++ b/web/src/components/shared/Pager.jsx @@ -1,4 +1,4 @@ -import * as React from "react"; +import { Component } from "react"; import PropTypes from "prop-types"; import { formatNumber } from "accounting"; import Loader from "./Loader"; @@ -6,7 +6,7 @@ import Loader from "./Loader"; import "../../scss/components/shared/Pager.scss"; import Icon from "../Icon"; -class Pager extends React.Component { +class Pager extends Component { pageCount() { return Math.ceil(this.props.totalCount / this.props.pageSize); } diff --git a/web/src/components/shared/PaperIcon/PaperIcon.jsx b/web/src/components/shared/PaperIcon/PaperIcon.jsx index 84aa7dc042..95834433c0 100644 --- a/web/src/components/shared/PaperIcon/PaperIcon.jsx +++ b/web/src/components/shared/PaperIcon/PaperIcon.jsx @@ -1,4 +1,3 @@ -import React from "react"; import classNames from "classnames"; import "@src/scss/components/shared/PaperIcon.scss"; diff --git a/web/src/components/shared/ScheduleSnapshotForm.jsx b/web/src/components/shared/ScheduleSnapshotForm.jsx index a64cffac92..defff42837 100644 --- a/web/src/components/shared/ScheduleSnapshotForm.jsx +++ b/web/src/components/shared/ScheduleSnapshotForm.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { getCronFrequency, getReadableCronDescriptor, diff --git a/web/src/components/shared/SideBar/SideBar.tsx b/web/src/components/shared/SideBar/SideBar.tsx index c982829997..38f4702a4d 100644 --- a/web/src/components/shared/SideBar/SideBar.tsx +++ b/web/src/components/shared/SideBar/SideBar.tsx @@ -1,4 +1,4 @@ -import React, { Component, Fragment } from "react"; +import { Component, Fragment } from "react"; import classNames from "classnames"; import Loader from "@src/components/shared/Loader"; diff --git a/web/src/components/shared/SubNavBar/SubNavBar.jsx b/web/src/components/shared/SubNavBar/SubNavBar.jsx index ff7e4afb41..3ca867a273 100644 --- a/web/src/components/shared/SubNavBar/SubNavBar.jsx +++ b/web/src/components/shared/SubNavBar/SubNavBar.jsx @@ -1,4 +1,3 @@ -import React from "react"; import classNames from "classnames"; import PropTypes from "prop-types"; import { Link } from "react-router-dom"; diff --git a/web/src/components/shared/TabView/Tab.jsx b/web/src/components/shared/TabView/Tab.jsx index d23595d916..3c0b8a797c 100644 --- a/web/src/components/shared/TabView/Tab.jsx +++ b/web/src/components/shared/TabView/Tab.jsx @@ -1,5 +1,3 @@ -import React from "react"; - export default function Tab(props) { const { className, children } = props; diff --git a/web/src/components/shared/TabView/TabView.jsx b/web/src/components/shared/TabView/TabView.jsx index de40aeab86..e8e5be529a 100644 --- a/web/src/components/shared/TabView/TabView.jsx +++ b/web/src/components/shared/TabView/TabView.jsx @@ -1,4 +1,4 @@ -import React, { Component, Fragment } from "react"; +import { Children, Component, Fragment } from "react"; import PropTypes from "prop-types"; import classNames from "classnames"; @@ -43,13 +43,13 @@ export default class TabView extends Component { render() { const { className, children, separator } = this.props; const { currentTab } = this.state; - const childToRender = React.Children.toArray(children).find( + const childToRender = Children.toArray(children).find( (child) => child.props.name === currentTab ); return (
- {React.Children.map(children, (child, idx) => { + {Children.map(children, (child, idx) => { const { displayText, name } = child.props; return ( diff --git a/web/src/components/shared/Toast.tsx b/web/src/components/shared/Toast.tsx index f7bf6ae6a7..17f54ba165 100644 --- a/web/src/components/shared/Toast.tsx +++ b/web/src/components/shared/Toast.tsx @@ -1,9 +1,9 @@ -import React from "react"; +import { ReactNode } from "react"; export interface ToastProps { isToastVisible: boolean; type: "success" | "error" | "warning"; - children: React.ReactNode; + children: ReactNode; } const toastType = (type: "success" | "error" | "warning") => { diff --git a/web/src/components/shared/Toggle.tsx b/web/src/components/shared/Toggle.tsx index 96d5c9c041..4af0d915bf 100644 --- a/web/src/components/shared/Toggle.tsx +++ b/web/src/components/shared/Toggle.tsx @@ -1,4 +1,3 @@ -import React from "react"; import "../../scss/components/shared/Toggle.scss"; interface Props { diff --git a/web/src/components/shared/Tooltip.jsx b/web/src/components/shared/Tooltip.jsx index f47305ffaa..c9e8b88714 100644 --- a/web/src/components/shared/Tooltip.jsx +++ b/web/src/components/shared/Tooltip.jsx @@ -1,8 +1,8 @@ -import * as React from "react"; +import { Component } from "react"; import * as PropTypes from "prop-types"; import "../../scss/components/shared/Tooltip.scss"; -export default class Tooltip extends React.Component { +export default class Tooltip extends Component { static propTypes = { className: PropTypes.string, visible: PropTypes.bool, diff --git a/web/src/components/shared/Warning.jsx b/web/src/components/shared/Warning.jsx index 1a58444907..7b2004755f 100644 --- a/web/src/components/shared/Warning.jsx +++ b/web/src/components/shared/Warning.jsx @@ -1,5 +1,3 @@ -import React from "react"; - import "../../scss/components/shared/Warning.scss"; const Warning = ({ children }) => { diff --git a/web/src/components/shared/forms/InputField.jsx b/web/src/components/shared/forms/InputField.jsx index b1844ebc77..4b4b2b72cf 100644 --- a/web/src/components/shared/forms/InputField.jsx +++ b/web/src/components/shared/forms/InputField.jsx @@ -1,7 +1,6 @@ -import React from "react"; - import "@src/scss/components/shared/forms/InputField.scss"; import Icon from "@components/Icon"; +import { useState } from "react"; const InputField = ({ label, @@ -20,7 +19,7 @@ const InputField = ({ disabled = false, readOnly = false, }) => { - const [show, setShow] = React.useState(false); + const [show, setShow] = useState(false); const handleToggleShow = () => { setShow(!show); diff --git a/web/src/components/shared/modals/DeployWarningModal.jsx b/web/src/components/shared/modals/DeployWarningModal.jsx index ea8ac66265..baae7807ce 100644 --- a/web/src/components/shared/modals/DeployWarningModal.jsx +++ b/web/src/components/shared/modals/DeployWarningModal.jsx @@ -1,7 +1,7 @@ -import * as React from "react"; +import { Component } from "react"; import Modal from "react-modal"; -class DeployWarningModal extends React.Component { +class DeployWarningModal extends Component { render() { const { showDeployWarningModal, diff --git a/web/src/components/shared/modals/HelmDeployModal.tsx b/web/src/components/shared/modals/HelmDeployModal.tsx index f383dfaf9f..d35b87e78c 100644 --- a/web/src/components/shared/modals/HelmDeployModal.tsx +++ b/web/src/components/shared/modals/HelmDeployModal.tsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; // TODO: add type to CodeSnippet // @ts-ignore diff --git a/web/src/components/shared/modals/SkipPreflightsModal.tsx b/web/src/components/shared/modals/SkipPreflightsModal.tsx index f11d4c3018..18b16b3f4a 100644 --- a/web/src/components/shared/modals/SkipPreflightsModal.tsx +++ b/web/src/components/shared/modals/SkipPreflightsModal.tsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; interface Props { diff --git a/web/src/components/snapshots/AppSnapshotRestore.jsx b/web/src/components/snapshots/AppSnapshotRestore.jsx index 57734f44f1..e034f53ff5 100644 --- a/web/src/components/snapshots/AppSnapshotRestore.jsx +++ b/web/src/components/snapshots/AppSnapshotRestore.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { withRouter } from "@src/utilities/react-router-utilities"; import { KotsPageTitle } from "@components/Head"; import { Line } from "rc-progress"; diff --git a/web/src/components/snapshots/AppSnapshots.jsx b/web/src/components/snapshots/AppSnapshots.jsx index 8e5ce160f5..7ef5bc6917 100644 --- a/web/src/components/snapshots/AppSnapshots.jsx +++ b/web/src/components/snapshots/AppSnapshots.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { withRouter } from "@src/utilities/react-router-utilities"; import { Link } from "react-router-dom"; import { KotsPageTitle } from "@components/Head"; diff --git a/web/src/components/snapshots/ConfigureSnapshots.jsx b/web/src/components/snapshots/ConfigureSnapshots.jsx index 258154d6c6..9a87879d51 100644 --- a/web/src/components/snapshots/ConfigureSnapshots.jsx +++ b/web/src/components/snapshots/ConfigureSnapshots.jsx @@ -1,4 +1,4 @@ -import React from "react"; +import { Component } from "react"; import Modal from "react-modal"; import semverjs from "semver"; import SnapshotInstallationBox from "./SnapshotInstallationBox"; @@ -12,7 +12,7 @@ import Icon from "../Icon"; const VELERO_IS_NOT_INSTALLED_TAB = "velero-not-installed"; const VELERO_IS_INSTALLED_TAB = "velero-installed"; -class ConfigureSnapshots extends React.Component { +class ConfigureSnapshots extends Component { constructor(props) { super(props); diff --git a/web/src/components/snapshots/DummySnapshotRow.jsx b/web/src/components/snapshots/DummySnapshotRow.jsx index d50cc7855c..633b89b5c3 100644 --- a/web/src/components/snapshots/DummySnapshotRow.jsx +++ b/web/src/components/snapshots/DummySnapshotRow.jsx @@ -1,5 +1,3 @@ -import React from "react"; - export default function DummySnapshotRow() { return (
diff --git a/web/src/components/snapshots/GettingStartedSnapshots.jsx b/web/src/components/snapshots/GettingStartedSnapshots.jsx index 051beb9d1e..836fba1e56 100644 --- a/web/src/components/snapshots/GettingStartedSnapshots.jsx +++ b/web/src/components/snapshots/GettingStartedSnapshots.jsx @@ -1,5 +1,4 @@ import Icon from "@components/Icon"; -import React from "react"; import { Link } from "react-router-dom"; function navigateToConfiguration(props) { diff --git a/web/src/components/snapshots/SnapshotDetails.jsx b/web/src/components/snapshots/SnapshotDetails.jsx index 2398b6c52c..901e30eb53 100644 --- a/web/src/components/snapshots/SnapshotDetails.jsx +++ b/web/src/components/snapshots/SnapshotDetails.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { withRouter } from "@src/utilities/react-router-utilities"; import MonacoEditor from "@monaco-editor/react"; import Modal from "react-modal"; diff --git a/web/src/components/snapshots/SnapshotInstallationBox.jsx b/web/src/components/snapshots/SnapshotInstallationBox.jsx index d6694330d9..c284c85740 100644 --- a/web/src/components/snapshots/SnapshotInstallationBox.jsx +++ b/web/src/components/snapshots/SnapshotInstallationBox.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import Icon from "../Icon"; export default class SnapshotInstallationBox extends Component { diff --git a/web/src/components/snapshots/SnapshotRestore.jsx b/web/src/components/snapshots/SnapshotRestore.jsx index 5051be432c..56faeb1057 100644 --- a/web/src/components/snapshots/SnapshotRestore.jsx +++ b/web/src/components/snapshots/SnapshotRestore.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { withRouter } from "@src/utilities/react-router-utilities"; import { KotsPageTitle } from "@components/Head"; import { Line } from "rc-progress"; diff --git a/web/src/components/snapshots/SnapshotRow.jsx b/web/src/components/snapshots/SnapshotRow.jsx index 631302d411..9ee583fec7 100644 --- a/web/src/components/snapshots/SnapshotRow.jsx +++ b/web/src/components/snapshots/SnapshotRow.jsx @@ -1,5 +1,4 @@ -import React from "react"; -import { Link } from "react-router-dom"; +import { Component } from "react"; import ReactTooltip from "react-tooltip"; import dayjs from "dayjs"; import isSameOrAfter from "dayjs/plugin/isSameOrAfter"; @@ -9,7 +8,7 @@ import { Utilities } from "../../utilities/utilities"; import Icon from "../Icon"; import { withRouter } from "@src/utilities/react-router-utilities"; -class SnapshotRow extends React.Component { +class SnapshotRow extends Component { handleDeleteClick = (e, snapshot) => { e.stopPropagation(); this.props.toggleConfirmDeleteModal(snapshot); diff --git a/web/src/components/snapshots/SnapshotSchedule.jsx b/web/src/components/snapshots/SnapshotSchedule.jsx index 6f6a997698..b6b7d89409 100644 --- a/web/src/components/snapshots/SnapshotSchedule.jsx +++ b/web/src/components/snapshots/SnapshotSchedule.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import Select from "react-select"; import { withRouter } from "@src/utilities/react-router-utilities"; import { diff --git a/web/src/components/snapshots/SnapshotSettings.tsx b/web/src/components/snapshots/SnapshotSettings.tsx index 7b7bb990e1..991b8cb769 100644 --- a/web/src/components/snapshots/SnapshotSettings.tsx +++ b/web/src/components/snapshots/SnapshotSettings.tsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { RouterProps, withRouter } from "@src/utilities/react-router-utilities"; import { KotsPageTitle } from "@components/Head"; import isEmpty from "lodash/isEmpty"; diff --git a/web/src/components/snapshots/SnapshotStorageDestination.tsx b/web/src/components/snapshots/SnapshotStorageDestination.tsx index 9a8fbbb3a3..ca0ff2a3da 100644 --- a/web/src/components/snapshots/SnapshotStorageDestination.tsx +++ b/web/src/components/snapshots/SnapshotStorageDestination.tsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import React, { ChangeEvent, Component } from "react"; import Select from "react-select"; import MonacoEditor from "@monaco-editor/react"; import find from "lodash/find"; @@ -572,10 +572,7 @@ class SnapshotStorageDestination extends Component { }); }; - handleFormChange = ( - field: FieldName, - e: React.ChangeEvent - ) => { + handleFormChange = (field: FieldName, e: ChangeEvent) => { let nextState: { [K in FieldName]?: string | boolean; } = {}; @@ -615,7 +612,7 @@ class SnapshotStorageDestination extends Component { this.setState({ gcsJsonFile: value || "" }); }; - onSubmit = async (e: React.MouseEvent) => { + onSubmit = async (e: React.MouseEvent) => { e.preventDefault(); let s3CompatibleFieldErrors = this.state.s3CompatibleFieldErrors; switch (this.state.selectedDestination?.value) { @@ -973,7 +970,7 @@ class SnapshotStorageDestination extends Component { type="password" placeholder="access key" value={this.state.s3KeySecret} - onChange={(e: React.ChangeEvent) => + onChange={(e: ChangeEvent) => this.handleFormChange("s3KeySecret", e) } onFocus={undefined} @@ -1070,7 +1067,7 @@ class SnapshotStorageDestination extends Component { type="password" placeholder="Client Secret" value={this.state.azureClientSecret} - onChange={(e: React.ChangeEvent) => + onChange={(e: ChangeEvent) => this.handleFormChange("azureClientSecret", e) } onFocus={undefined} @@ -1296,7 +1293,7 @@ class SnapshotStorageDestination extends Component { type="password" placeholder="access key" value={this.state.s3CompatibleKeySecret} - onChange={(e: React.ChangeEvent) => + onChange={(e: ChangeEvent) => this.handleFormChange("s3CompatibleKeySecret", e) } onFocus={undefined} diff --git a/web/src/components/snapshots/Snapshots.jsx b/web/src/components/snapshots/Snapshots.jsx index 77285807bc..795a522700 100644 --- a/web/src/components/snapshots/Snapshots.jsx +++ b/web/src/components/snapshots/Snapshots.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { withRouter } from "@src/utilities/react-router-utilities"; import { Link } from "react-router-dom"; import { KotsPageTitle } from "@components/Head"; diff --git a/web/src/components/snapshots/SnapshotsWrapper.jsx b/web/src/components/snapshots/SnapshotsWrapper.jsx index 4678faa2c4..4aedd0350e 100644 --- a/web/src/components/snapshots/SnapshotsWrapper.jsx +++ b/web/src/components/snapshots/SnapshotsWrapper.jsx @@ -1,4 +1,4 @@ -import React, { Component, Fragment } from "react"; +import { Component, Fragment } from "react"; import { Outlet } from "react-router-dom"; import { withRouter } from "@src/utilities/react-router-utilities"; import { KotsPageTitle } from "@components/Head"; diff --git a/web/src/components/snapshots/UploadCACertificate.jsx b/web/src/components/snapshots/UploadCACertificate.jsx index 61fb47efce..0d6df80a5d 100644 --- a/web/src/components/snapshots/UploadCACertificate.jsx +++ b/web/src/components/snapshots/UploadCACertificate.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Dropzone from "react-dropzone"; import isEmpty from "lodash/isEmpty"; import { getFileContent } from "../../utilities/utilities"; diff --git a/web/src/components/static/NotFound.jsx b/web/src/components/static/NotFound.jsx index 6b38f9150c..7c7d028200 100644 --- a/web/src/components/static/NotFound.jsx +++ b/web/src/components/static/NotFound.jsx @@ -1,7 +1,7 @@ -import * as React from "react"; +import { Component } from "react"; import { Link } from "react-router-dom"; -export default class NotFound extends React.Component { +export default class NotFound extends Component { render() { return (
diff --git a/web/src/components/static/UnsupportedBrowser.jsx b/web/src/components/static/UnsupportedBrowser.jsx index 5b7210f645..0fc5688686 100644 --- a/web/src/components/static/UnsupportedBrowser.jsx +++ b/web/src/components/static/UnsupportedBrowser.jsx @@ -1,6 +1,5 @@ -import * as React from "react"; - -export default class UnsupportedBrowser extends React.Component { +import { Component } from "react"; +export default class UnsupportedBrowser extends Component { render() { return (
diff --git a/web/src/components/tree/KotsApplicationTree.tsx b/web/src/components/tree/KotsApplicationTree.tsx index 75c0bc2736..f8f67b8029 100644 --- a/web/src/components/tree/KotsApplicationTree.tsx +++ b/web/src/components/tree/KotsApplicationTree.tsx @@ -1,4 +1,4 @@ -import * as React from "react"; +import { Component } from "react"; import { withRouter } from "@src/utilities/react-router-utilities"; import { Utilities } from "../../utilities/utilities"; import { KotsPageTitle } from "@components/Head"; @@ -36,7 +36,7 @@ type State = { displayInstructionsModal: boolean; applicationTree: object[]; }; -class KotsApplicationTree extends React.Component { +class KotsApplicationTree extends Component { constructor(props: Props) { super(props); this.state = { diff --git a/web/src/components/troubleshoot/AnalyzerFileTree.jsx b/web/src/components/troubleshoot/AnalyzerFileTree.jsx index 3949590243..25a544e9c5 100644 --- a/web/src/components/troubleshoot/AnalyzerFileTree.jsx +++ b/web/src/components/troubleshoot/AnalyzerFileTree.jsx @@ -1,7 +1,7 @@ -import * as React from "react"; +import { Component } from "react"; import AceEditor from "react-ace"; import { withRouter } from "@src/utilities/react-router-utilities"; -import { getFileFormat, rootPath, Utilities } from "../../utilities/utilities"; +import { getFileFormat, rootPath } from "../../utilities/utilities"; import sortBy from "lodash/sortBy"; import find from "lodash/find"; import has from "lodash/has"; @@ -18,7 +18,7 @@ import "brace/mode/yaml"; import "brace/theme/chrome"; import Icon from "../Icon"; -class AnalyzerFileTree extends React.Component { +class AnalyzerFileTree extends Component { constructor(props) { super(); this.state = { diff --git a/web/src/components/troubleshoot/AnalyzerInsights.jsx b/web/src/components/troubleshoot/AnalyzerInsights.jsx index 3af9ccf5d4..c73ab4b301 100644 --- a/web/src/components/troubleshoot/AnalyzerInsights.jsx +++ b/web/src/components/troubleshoot/AnalyzerInsights.jsx @@ -1,4 +1,4 @@ -import * as React from "react"; +import { Component } from "react"; import Loader from "../shared/Loader"; import isEmpty from "lodash/isEmpty"; import filter from "lodash/filter"; @@ -6,7 +6,7 @@ import MarkdownRenderer from "@src/components/shared/MarkdownRenderer"; import { sortAnalyzers, parseIconUri } from "../../utilities/utilities"; import { withRouter } from "@src/utilities/react-router-utilities"; -export class AnalyzerInsights extends React.Component { +export class AnalyzerInsights extends Component { constructor(props) { super(props); this.state = { diff --git a/web/src/components/troubleshoot/AnalyzerRedactorReport.jsx b/web/src/components/troubleshoot/AnalyzerRedactorReport.jsx index 4fec6b351d..2beb077550 100644 --- a/web/src/components/troubleshoot/AnalyzerRedactorReport.jsx +++ b/web/src/components/troubleshoot/AnalyzerRedactorReport.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { withRouter } from "@src/utilities/react-router-utilities"; import isEmpty from "lodash/isEmpty"; diff --git a/web/src/components/troubleshoot/AnalyzerRedactorReportRow.jsx b/web/src/components/troubleshoot/AnalyzerRedactorReportRow.jsx index b96e11c0fb..77f3138c89 100644 --- a/web/src/components/troubleshoot/AnalyzerRedactorReportRow.jsx +++ b/web/src/components/troubleshoot/AnalyzerRedactorReportRow.jsx @@ -1,9 +1,9 @@ -import React from "react"; +import { Component } from "react"; import groupBy from "lodash/groupBy"; import Icon from "../Icon"; import { withRouter } from "@src/utilities/react-router-utilities"; -class AnalyzerRedactorReportRow extends React.Component { +class AnalyzerRedactorReportRow extends Component { state = { toggleDetails: false, }; diff --git a/web/src/components/troubleshoot/ConfigureRedactorsModal.jsx b/web/src/components/troubleshoot/ConfigureRedactorsModal.jsx index 3825d7d9c5..4d39b8b0b5 100644 --- a/web/src/components/troubleshoot/ConfigureRedactorsModal.jsx +++ b/web/src/components/troubleshoot/ConfigureRedactorsModal.jsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import Modal from "react-modal"; import AceEditor from "react-ace"; import yaml from "js-yaml"; diff --git a/web/src/components/troubleshoot/GenerateSupportBundle.jsx b/web/src/components/troubleshoot/GenerateSupportBundle.jsx index f7b8ff6c20..b2ea0664a6 100644 --- a/web/src/components/troubleshoot/GenerateSupportBundle.jsx +++ b/web/src/components/troubleshoot/GenerateSupportBundle.jsx @@ -1,22 +1,19 @@ -import * as React from "react"; +import { Component } from "react"; import { KotsPageTitle } from "@components/Head"; -import { Link } from "react-router-dom"; import { withRouter } from "@src/utilities/react-router-utilities"; import Modal from "react-modal"; import Toggle from "../shared/Toggle"; -import SupportBundleCollectProgress from "../troubleshoot/SupportBundleCollectProgress"; import CodeSnippet from "@src/components/shared/CodeSnippet"; import UploadSupportBundleModal from "../troubleshoot/UploadSupportBundleModal"; import ConfigureRedactorsModal from "./ConfigureRedactorsModal"; import ErrorModal from "../modals/ErrorModal"; -import { Utilities } from "../../utilities/utilities"; import { Repeater } from "../../utilities/repeater"; import "../../scss/components/troubleshoot/GenerateSupportBundle.scss"; import Icon from "../Icon"; -class GenerateSupportBundle extends React.Component { +class GenerateSupportBundle extends Component { constructor(props) { super(props); diff --git a/web/src/components/troubleshoot/GenerateSupportBundleModal.tsx b/web/src/components/troubleshoot/GenerateSupportBundleModal.tsx index cb3f1305c4..712e945dd0 100644 --- a/web/src/components/troubleshoot/GenerateSupportBundleModal.tsx +++ b/web/src/components/troubleshoot/GenerateSupportBundleModal.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useReducer } from "react"; +import { useEffect, useReducer } from "react"; import Modal from "react-modal"; import CodeSnippet from "@components/shared/CodeSnippet"; import { useNavigate, useParams } from "react-router-dom"; diff --git a/web/src/components/troubleshoot/PodAnalyzerDetails.jsx b/web/src/components/troubleshoot/PodAnalyzerDetails.jsx index 3e488f3d20..4f1bda39e1 100644 --- a/web/src/components/troubleshoot/PodAnalyzerDetails.jsx +++ b/web/src/components/troubleshoot/PodAnalyzerDetails.jsx @@ -1,12 +1,11 @@ -import * as React from "react"; +import { Component } from "react"; import AceEditor from "react-ace"; import Select from "react-select"; import Loader from "../shared/Loader"; import yaml from "js-yaml"; -import { Utilities } from "../../utilities/utilities"; import "brace/ext/searchbox"; -export class PodAnalyzerDetails extends React.Component { +export class PodAnalyzerDetails extends Component { state = { activeTab: "podLogs", podContainers: [], diff --git a/web/src/components/troubleshoot/PreflightsProgress.tsx b/web/src/components/troubleshoot/PreflightsProgress.tsx index 744e47b42d..ecc2c93c7a 100644 --- a/web/src/components/troubleshoot/PreflightsProgress.tsx +++ b/web/src/components/troubleshoot/PreflightsProgress.tsx @@ -1,4 +1,3 @@ -import React from "react"; import Loader from "../shared/Loader"; import "@src/scss/components/AirgapUploadProgress.scss"; diff --git a/web/src/components/troubleshoot/SupportBundleAnalysis.jsx b/web/src/components/troubleshoot/SupportBundleAnalysis.jsx index d875e4b5ef..3b418f22de 100644 --- a/web/src/components/troubleshoot/SupportBundleAnalysis.jsx +++ b/web/src/components/troubleshoot/SupportBundleAnalysis.jsx @@ -1,17 +1,13 @@ -import * as React from "react"; -import { Switch, Route, Link, Outlet } from "react-router-dom"; +import { Component, createRef } from "react"; +import { Link, Outlet } from "react-router-dom"; import { withRouter } from "@src/utilities/react-router-utilities"; import dayjs from "dayjs"; import Modal from "react-modal"; import Loader from "../shared/Loader"; -import AnalyzerInsights from "./AnalyzerInsights"; -import AnalyzerFileTree from "./AnalyzerFileTree"; -import AnalyzerRedactorReport from "./AnalyzerRedactorReport"; import PodAnalyzerDetails from "./PodAnalyzerDetails"; import ErrorModal from "../modals/ErrorModal"; import { Utilities } from "../../utilities/utilities"; -import { Repeater } from "@src/utilities/repeater"; import "../../scss/components/troubleshoot/SupportBundleAnalysis.scss"; import "@src/scss/components/AirgapUploadProgress.scss"; import download from "downloadjs"; @@ -19,10 +15,9 @@ import Icon from "../Icon"; import { KotsPageTitle } from "@components/Head"; import { isEmpty } from "lodash"; -import { useSelectedApp } from "@features/App"; let percentage; -export class SupportBundleAnalysis extends React.Component { +export class SupportBundleAnalysis extends Component { constructor(props) { super(); this.state = { @@ -39,7 +34,7 @@ export class SupportBundleAnalysis extends React.Component { sendingBundleErrMsg: "", showPodAnalyzerDetailsModal: false, }; - this.pollingRef = React.createRef(); + this.pollingRef = createRef(); } togglePodDetailsModal = (selectedPod) => { diff --git a/web/src/components/troubleshoot/SupportBundleCollectProgress.jsx b/web/src/components/troubleshoot/SupportBundleCollectProgress.jsx index 0048d467fc..ef23445b97 100644 --- a/web/src/components/troubleshoot/SupportBundleCollectProgress.jsx +++ b/web/src/components/troubleshoot/SupportBundleCollectProgress.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Loader from "../shared/Loader"; import "@src/scss/components/AirgapUploadProgress.scss"; diff --git a/web/src/components/troubleshoot/SupportBundleList.tsx b/web/src/components/troubleshoot/SupportBundleList.tsx index e23af7509d..20bff39ed8 100644 --- a/web/src/components/troubleshoot/SupportBundleList.tsx +++ b/web/src/components/troubleshoot/SupportBundleList.tsx @@ -1,4 +1,3 @@ -import * as React from "react"; import { useReducer, useEffect, useContext } from "react"; import { KotsPageTitle } from "@components/Head"; import { withRouter } from "@src/utilities/react-router-utilities"; diff --git a/web/src/components/troubleshoot/SupportBundleRow.tsx b/web/src/components/troubleshoot/SupportBundleRow.tsx index 4971722e09..225d2e312b 100644 --- a/web/src/components/troubleshoot/SupportBundleRow.tsx +++ b/web/src/components/troubleshoot/SupportBundleRow.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useContext } from "react"; +import { useEffect, useContext, useReducer } from "react"; import Loader from "../shared/Loader"; import dayjs from "dayjs"; import filter from "lodash/filter"; @@ -57,7 +57,7 @@ export const SupportBundleRow = (props: Props) => { const params = useParams(); - const [state, setState] = React.useReducer( + const [state, setState] = useReducer( (currentState: State, newState: Partial) => ({ ...currentState, ...newState, diff --git a/web/src/components/troubleshoot/TroubleshootContainer.tsx b/web/src/components/troubleshoot/TroubleshootContainer.tsx index a20c317cb3..39df0e9c60 100644 --- a/web/src/components/troubleshoot/TroubleshootContainer.tsx +++ b/web/src/components/troubleshoot/TroubleshootContainer.tsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { Outlet } from "react-router-dom"; import { withRouter, RouterProps } from "@src/utilities/react-router-utilities"; diff --git a/web/src/components/troubleshoot/UploadSupportBundleModal.jsx b/web/src/components/troubleshoot/UploadSupportBundleModal.jsx index 88f5623c44..54bcf37c20 100644 --- a/web/src/components/troubleshoot/UploadSupportBundleModal.jsx +++ b/web/src/components/troubleshoot/UploadSupportBundleModal.jsx @@ -1,4 +1,4 @@ -import * as React from "react"; +import { Component } from "react"; import Clipboard from "clipboard"; import isEmpty from "lodash/isEmpty"; import Dropzone from "react-dropzone"; @@ -6,7 +6,7 @@ import randomstring from "randomstring"; import "../../scss/components/troubleshoot/UploadSupportBundleModal.scss"; -class UploadSupportBundleModal extends React.Component { +class UploadSupportBundleModal extends Component { constructor() { super(); this.state = { diff --git a/web/src/components/watches/WatchSidebarItem/HelmChartSidebarItem.jsx b/web/src/components/watches/WatchSidebarItem/HelmChartSidebarItem.jsx index 9d7653a8da..0ce9b406c6 100644 --- a/web/src/components/watches/WatchSidebarItem/HelmChartSidebarItem.jsx +++ b/web/src/components/watches/WatchSidebarItem/HelmChartSidebarItem.jsx @@ -1,4 +1,3 @@ -import React from "react"; import classNames from "classnames"; import { Link } from "react-router-dom"; import Icon from "@src/components/Icon"; diff --git a/web/src/components/watches/WatchSidebarItem/KotsSidebarItem.jsx b/web/src/components/watches/WatchSidebarItem/KotsSidebarItem.jsx index e6d4d0b49c..761abd9876 100644 --- a/web/src/components/watches/WatchSidebarItem/KotsSidebarItem.jsx +++ b/web/src/components/watches/WatchSidebarItem/KotsSidebarItem.jsx @@ -1,4 +1,3 @@ -import React from "react"; import classNames from "classnames"; import { Link } from "react-router-dom"; import Icon from "@src/components/Icon"; diff --git a/web/src/context/ToastContext.tsx b/web/src/context/ToastContext.tsx index 631feea724..a6975de73b 100644 --- a/web/src/context/ToastContext.tsx +++ b/web/src/context/ToastContext.tsx @@ -1,4 +1,4 @@ -import React, { createContext, ReactNode, useState } from "react"; +import { createContext, ReactNode, useState } from "react"; interface ToastContextProps { isToastVisible: boolean; diff --git a/web/src/features/AddNewApp/components/InstallWithHelm.tsx b/web/src/features/AddNewApp/components/InstallWithHelm.tsx index f38988e79a..d6eb7687fa 100644 --- a/web/src/features/AddNewApp/components/InstallWithHelm.tsx +++ b/web/src/features/AddNewApp/components/InstallWithHelm.tsx @@ -1,5 +1,5 @@ import { useApps } from "@features/App"; -import React, { useEffect } from "react"; +import { useEffect } from "react"; import { useNavigate } from "react-router-dom"; function InstallWithHelm() { diff --git a/web/src/features/App/PreflightIcon.tsx b/web/src/features/App/PreflightIcon.tsx index 4c2a718721..da3fb7eee9 100644 --- a/web/src/features/App/PreflightIcon.tsx +++ b/web/src/features/App/PreflightIcon.tsx @@ -1,4 +1,3 @@ -import React from "react"; import Icon from "@components/Icon"; import { Link } from "react-router-dom"; import { App, Version } from "@types"; diff --git a/web/src/features/App/api/getApps.test.jsx b/web/src/features/App/api/getApps.test.jsx index f732f7074b..0190863465 100644 --- a/web/src/features/App/api/getApps.test.jsx +++ b/web/src/features/App/api/getApps.test.jsx @@ -1,7 +1,6 @@ /** * @jest-environment jsdom */ -import React from "react"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { renderHook } from "@testing-library/react-hooks"; import { getApps, useApps } from "./getApps"; diff --git a/web/src/features/App/api/getApps.tsx b/web/src/features/App/api/getApps.tsx index d4c1dd3df6..119dc54366 100644 --- a/web/src/features/App/api/getApps.tsx +++ b/web/src/features/App/api/getApps.tsx @@ -1,8 +1,8 @@ // This hook has not been integrated yet. -import React from "react"; import { useQuery, UseQueryResult } from "@tanstack/react-query"; import { Utilities } from "../../../utilities/utilities"; import { App } from "@types"; +import { ReactNode } from "react"; async function getApps({ apiEndpoint = process.env.API_ENDPOINT, @@ -54,9 +54,7 @@ function useApps({ function UseApps({ children, }: { - children: ( - props: UseQueryResult<{ apps: App[] | null }, Error> - ) => React.ReactNode; + children: (props: UseQueryResult<{ apps: App[] | null }, Error>) => ReactNode; }) { const query = useApps(); diff --git a/web/src/features/AppConfig/components/AppConfig.tsx b/web/src/features/AppConfig/components/AppConfig.tsx index c17455a3c0..e9214d58f2 100644 --- a/web/src/features/AppConfig/components/AppConfig.tsx +++ b/web/src/features/AppConfig/components/AppConfig.tsx @@ -1,4 +1,4 @@ -import React, { Component } from "react"; +import { Component } from "react"; import { AppConfigRenderer } from "../../../components/AppConfigRenderer"; import { Link, useLocation, useNavigate } from "react-router-dom"; import { withRouter } from "@src/utilities/react-router-utilities"; diff --git a/web/src/features/AppConfig/components/ConfigInfo.jsx b/web/src/features/AppConfig/components/ConfigInfo.jsx index 0402db9485..f0dfa9aaf3 100644 --- a/web/src/features/AppConfig/components/ConfigInfo.jsx +++ b/web/src/features/AppConfig/components/ConfigInfo.jsx @@ -1,4 +1,3 @@ -import React from "react"; import size from "lodash/size"; import findIndex from "lodash/findIndex"; import { Link } from "react-router-dom"; diff --git a/web/src/features/AppVersionHistory/AppVersionHistoryRow.tsx b/web/src/features/AppVersionHistory/AppVersionHistoryRow.tsx index a15c191ea7..3b6243aae3 100644 --- a/web/src/features/AppVersionHistory/AppVersionHistoryRow.tsx +++ b/web/src/features/AppVersionHistory/AppVersionHistoryRow.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; import { Link, useNavigate } from "react-router-dom"; import find from "lodash/find"; import classNames from "classnames"; diff --git a/web/src/features/AppVersionHistory/YamlErrors.jsx b/web/src/features/AppVersionHistory/YamlErrors.jsx index 1db89c828c..a264c97072 100644 --- a/web/src/features/AppVersionHistory/YamlErrors.jsx +++ b/web/src/features/AppVersionHistory/YamlErrors.jsx @@ -1,5 +1,4 @@ import Icon from "@src/components/Icon"; -import React from "react"; const YamlErrors = ({ yamlErrors, handleShowDetailsClicked }) => { return ( diff --git a/web/src/features/Auth/components/SecureAdminConsole.tsx b/web/src/features/Auth/components/SecureAdminConsole.tsx index 9701afcae4..064bedcdf5 100644 --- a/web/src/features/Auth/components/SecureAdminConsole.tsx +++ b/web/src/features/Auth/components/SecureAdminConsole.tsx @@ -1,4 +1,4 @@ -import * as React from "react"; +import { Component, RefObject, createRef } from "react"; import { KotsPageTitle } from "@components/Head"; import { Utilities, dynamicallyResizeText } from "@src/utilities/utilities"; import Loader from "@src/components/shared/Loader"; @@ -30,8 +30,8 @@ type LoginResponse = { expires?: number; sessionRoles: string; }; -class SecureAdminConsole extends React.Component { - loginText: React.RefObject; +class SecureAdminConsole extends Component { + loginText: RefObject; constructor(props: Props) { super(props); @@ -44,7 +44,7 @@ class SecureAdminConsole extends React.Component { loginInfo: null, }; - this.loginText = React.createRef(); + this.loginText = createRef(); } completeLogin = async (data: LoginResponse) => { diff --git a/web/src/features/Dashboard/components/AirgapUploadProgress.jsx b/web/src/features/Dashboard/components/AirgapUploadProgress.jsx index 1a7d0174a0..f226c8cdc1 100644 --- a/web/src/features/Dashboard/components/AirgapUploadProgress.jsx +++ b/web/src/features/Dashboard/components/AirgapUploadProgress.jsx @@ -1,10 +1,8 @@ -import React from "react"; -import { withRouter } from "@src/utilities/react-router-utilities"; +import { Component } from "react"; import Loader from "../../../components/shared/Loader"; import { formatByteSize, calculateTimeDifference, - Utilities, } from "@src/utilities/utilities"; import { Repeater } from "@src/utilities/repeater"; import fetch from "../../../utilities/fetchWithTimeout"; @@ -13,7 +11,7 @@ import get from "lodash/get"; import Icon from "../../../components/Icon"; let processingImages = null; -class AirgapUploadProgress extends React.Component { +class AirgapUploadProgress extends Component { constructor(props) { super(props); diff --git a/web/src/features/Dashboard/components/AppStatus.tsx b/web/src/features/Dashboard/components/AppStatus.tsx index b7d5f3ea14..03cc616495 100644 --- a/web/src/features/Dashboard/components/AppStatus.tsx +++ b/web/src/features/Dashboard/components/AppStatus.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import { Component } from "react"; import { Link } from "react-router-dom"; import InlineDropdown from "@src/components/shared/InlineDropdown"; import isEmpty from "lodash/isEmpty"; @@ -28,7 +28,7 @@ type Props = { type State = { dropdownOptions: OptionLink[]; }; -export default class AppStatus extends React.Component { +export default class AppStatus extends Component { constructor(props: Props) { super(props); this.state = { diff --git a/web/src/features/Dashboard/components/Dashboard.tsx b/web/src/features/Dashboard/components/Dashboard.tsx index d4e337143a..8c80dd1f85 100644 --- a/web/src/features/Dashboard/components/Dashboard.tsx +++ b/web/src/features/Dashboard/components/Dashboard.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useReducer, useRef } from "react"; +import { useEffect, useReducer, useRef } from "react"; import { KotsPageTitle } from "@components/Head"; import get from "lodash/get"; import sortBy from "lodash/sortBy"; diff --git a/web/src/features/Dashboard/components/DashboardGitOpsCard.jsx b/web/src/features/Dashboard/components/DashboardGitOpsCard.jsx index 9882bfff69..d8aaea6519 100644 --- a/web/src/features/Dashboard/components/DashboardGitOpsCard.jsx +++ b/web/src/features/Dashboard/components/DashboardGitOpsCard.jsx @@ -1,4 +1,3 @@ -import React from "react"; import { Link } from "react-router-dom"; import Loader from "@src/components/shared/Loader"; import { getReadableGitOpsProviderName } from "@src/utilities/utilities"; diff --git a/web/src/features/Dashboard/components/DashboardGraphsCard.tsx b/web/src/features/Dashboard/components/DashboardGraphsCard.tsx index 9158a0bc1f..e489218ad8 100644 --- a/web/src/features/Dashboard/components/DashboardGraphsCard.tsx +++ b/web/src/features/Dashboard/components/DashboardGraphsCard.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import { ChangeEvent, Component } from "react"; import dayjs from "dayjs"; import localizedFormat from "dayjs/plugin/localizedFormat"; import Handlebars from "handlebars"; @@ -40,7 +40,7 @@ type State = { savingPromValue: boolean; showConfigureGraphs: boolean; }; -export default class DashboardGraphsCard extends React.Component { +export default class DashboardGraphsCard extends Component { constructor(props: Props) { super(props); this.state = { @@ -102,7 +102,7 @@ export default class DashboardGraphsCard extends React.Component { }); }; - onPromValueChange = (e: React.ChangeEvent) => { + onPromValueChange = (e: ChangeEvent) => { const { value } = e.target; this.setState({ promValue: value, diff --git a/web/src/features/Dashboard/components/DashboardLicenseCard.tsx b/web/src/features/Dashboard/components/DashboardLicenseCard.tsx index 931f4e38b4..13529f0805 100644 --- a/web/src/features/Dashboard/components/DashboardLicenseCard.tsx +++ b/web/src/features/Dashboard/components/DashboardLicenseCard.tsx @@ -1,4 +1,4 @@ -import React, { useReducer } from "react"; +import { ReactNode, useReducer } from "react"; import size from "lodash/size"; // @ts-ignore import yaml from "js-yaml"; @@ -24,7 +24,7 @@ type Props = { appLicense: AppLicense | null; gettingAppLicenseErrMsg: string | null; syncCallback: () => void; - children: React.ReactNode; + children: ReactNode; refetchLicense: () => void; }; diff --git a/web/src/features/Dashboard/components/DashboardSnapshotsCard.tsx b/web/src/features/Dashboard/components/DashboardSnapshotsCard.tsx index e0470d0d7f..1b3717896b 100644 --- a/web/src/features/Dashboard/components/DashboardSnapshotsCard.tsx +++ b/web/src/features/Dashboard/components/DashboardSnapshotsCard.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useReducer } from "react"; +import { useEffect, useReducer } from "react"; import { withRouter } from "@src/utilities/react-router-utilities"; import { Link, useNavigate } from "react-router-dom"; import find from "lodash/find"; diff --git a/web/src/features/Dashboard/components/DashboardVersionCard.tsx b/web/src/features/Dashboard/components/DashboardVersionCard.tsx index d3659b4a52..3ce4873402 100644 --- a/web/src/features/Dashboard/components/DashboardVersionCard.tsx +++ b/web/src/features/Dashboard/components/DashboardVersionCard.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useReducer } from "react"; +import { RefObject, useEffect, useReducer } from "react"; import { Link, useNavigate, useParams } from "react-router-dom"; import ReactTooltip from "react-tooltip"; import DashboardGitOpsCard from "./DashboardGitOpsCard"; @@ -1794,7 +1794,7 @@ const DashboardVersionCard = (props: Props) => { error: string; isDownloading: boolean; name: string; - ref: React.RefObject; + ref: RefObject; url: string; }) => { const showDownloadValues = diff --git a/web/src/features/Dashboard/components/DumbComponent.jsx b/web/src/features/Dashboard/components/DumbComponent.jsx deleted file mode 100644 index 4cb7782e2c..0000000000 --- a/web/src/features/Dashboard/components/DumbComponent.jsx +++ /dev/null @@ -1,12 +0,0 @@ -import React from "react"; -import { useOutletContext } from "react-router-dom"; -import { withRouter } from "@src/utilities/react-router-utilities"; - -class dumbComponent extends React.Component { - render() { - console.log(this.props); - return
dumbComponent
; - } -} - -export default withRouter(dumbComponent); diff --git a/web/src/features/Dashboard/components/LicenseFields.tsx b/web/src/features/Dashboard/components/LicenseFields.tsx index f0aa83454a..79a8d598f1 100644 --- a/web/src/features/Dashboard/components/LicenseFields.tsx +++ b/web/src/features/Dashboard/components/LicenseFields.tsx @@ -1,4 +1,3 @@ -import React from "react"; // TODO: add type checking support for styled components or add a global ignore // @ts-ignore import styled from "styled-components"; diff --git a/web/src/features/Gitops/GitOpsDeploymentManager.jsx b/web/src/features/Gitops/GitOpsDeploymentManager.jsx index 633e5f5546..78eaa4d117 100644 --- a/web/src/features/Gitops/GitOpsDeploymentManager.jsx +++ b/web/src/features/Gitops/GitOpsDeploymentManager.jsx @@ -1,4 +1,4 @@ -import React, { useContext } from "react"; +import { useContext } from "react"; import find from "lodash/find"; import Loader from "../../components/shared/Loader"; import ErrorModal from "../../components/modals/ErrorModal"; diff --git a/web/src/features/Gitops/components/AppGitops.jsx b/web/src/features/Gitops/components/AppGitops.jsx index 3f97b3f1a4..f031111147 100644 --- a/web/src/features/Gitops/components/AppGitops.jsx +++ b/web/src/features/Gitops/components/AppGitops.jsx @@ -1,4 +1,4 @@ -import React, { useContext, useState, useEffect } from "react"; +import { useContext, useState, useEffect } from "react"; import { KotsPageTitle } from "@components/Head"; import CodeSnippet from "@src/components/shared/CodeSnippet"; import { getAddKeyUri, Utilities } from "../../../utilities/utilities"; diff --git a/web/src/features/Gitops/components/AppSelector.jsx b/web/src/features/Gitops/components/AppSelector.jsx index b83004e2b8..6299976cc7 100644 --- a/web/src/features/Gitops/components/AppSelector.jsx +++ b/web/src/features/Gitops/components/AppSelector.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Select from "react-select"; import { getLabel } from "../utils"; diff --git a/web/src/features/Gitops/components/GitOpsProviderSelector.jsx b/web/src/features/Gitops/components/GitOpsProviderSelector.jsx index b9d1855609..e775c3d0d8 100644 --- a/web/src/features/Gitops/components/GitOpsProviderSelector.jsx +++ b/web/src/features/Gitops/components/GitOpsProviderSelector.jsx @@ -1,4 +1,4 @@ -import React, { useContext } from "react"; +import { useContext } from "react"; import { Flex, Paragraph } from "../../../styles/common"; import Select from "react-select"; import { GitOpsContext, withGitOpsConsumer } from "../context"; diff --git a/web/src/features/Gitops/components/GitOpsRepoDetails.jsx b/web/src/features/Gitops/components/GitOpsRepoDetails.jsx index 550a828d96..5738b0056f 100644 --- a/web/src/features/Gitops/components/GitOpsRepoDetails.jsx +++ b/web/src/features/Gitops/components/GitOpsRepoDetails.jsx @@ -1,4 +1,4 @@ -import React, { useState, useContext } from "react"; +import { useState, useContext } from "react"; import { GitOpsContext, withGitOpsConsumer } from "../context"; import { Flex, Paragraph } from "../../../styles/common"; import Loader from "../../../components/shared/Loader"; diff --git a/web/src/features/Gitops/components/SetupProvider.jsx b/web/src/features/Gitops/components/SetupProvider.jsx index b0d874c5b2..63b57330df 100644 --- a/web/src/features/Gitops/components/SetupProvider.jsx +++ b/web/src/features/Gitops/components/SetupProvider.jsx @@ -1,4 +1,4 @@ -import React, { useContext, useCallback, useEffect, useState } from "react"; +import { useContext, useCallback, useEffect, useState } from "react"; import { Utilities } from "../../../utilities/utilities"; import DisableModal from "./modals/DisableModal"; import { GitOpsContext, withGitOpsConsumer } from "../context"; diff --git a/web/src/features/Gitops/components/modals/ConnectionModal.jsx b/web/src/features/Gitops/components/modals/ConnectionModal.jsx index 125d7fb617..866701d038 100644 --- a/web/src/features/Gitops/components/modals/ConnectionModal.jsx +++ b/web/src/features/Gitops/components/modals/ConnectionModal.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; import Loader from "../../../../components/shared/Loader"; import { useNavigate } from "react-router-dom"; diff --git a/web/src/features/Gitops/components/modals/DisableModal.jsx b/web/src/features/Gitops/components/modals/DisableModal.jsx index 25d5faa47a..6ac38065ee 100644 --- a/web/src/features/Gitops/components/modals/DisableModal.jsx +++ b/web/src/features/Gitops/components/modals/DisableModal.jsx @@ -1,4 +1,3 @@ -import React from "react"; import Modal from "react-modal"; const DisableModal = ({ isOpen, setOpen, disableGitOps, provider }) => { diff --git a/web/src/features/Gitops/context.js b/web/src/features/Gitops/context.js index 129e124cf0..cd4f1e5276 100644 --- a/web/src/features/Gitops/context.js +++ b/web/src/features/Gitops/context.js @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from "react"; +import { useState, useEffect, createContext } from "react"; import { isEmpty, find } from "lodash"; import { getGitOpsUri, @@ -11,7 +11,7 @@ import { BITBUCKET_SERVER_DEFAULT_SSH_PORT, } from "./constants"; import useGitops from "./hooks/useGitops"; -const GitOpsContext = React.createContext(); +const GitOpsContext = createContext(); const GitOpsProvider = ({ children }) => { const [step, setStep] = useState("provider"); diff --git a/web/src/features/Gitops/utils.js b/web/src/features/Gitops/utils.js index ff1ece6653..c717abdfd5 100644 --- a/web/src/features/Gitops/utils.js +++ b/web/src/features/Gitops/utils.js @@ -1,4 +1,3 @@ -import React from "react"; import enabled from "../../images/enabled.svg"; import not_enabled from "../../images/not_enabled.svg"; import warning from "../../images/warning.svg"; diff --git a/web/src/features/VersionDiff/VersionDiff.tsx b/web/src/features/VersionDiff/VersionDiff.tsx index 1fcb04322e..acba80d9ed 100644 --- a/web/src/features/VersionDiff/VersionDiff.tsx +++ b/web/src/features/VersionDiff/VersionDiff.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import { Component } from "react"; import { withRouter } from "@src/utilities/react-router-utilities"; import Loader from "../../components/shared/Loader"; @@ -34,7 +34,7 @@ type ApplicationTree = { [key: string]: string; }; }; -class VersionDiff extends React.Component { +class VersionDiff extends Component { constructor(props: Props) { super(props); this.state = { diff --git a/web/src/features/VersionDiff/ViewDiffButton.tsx b/web/src/features/VersionDiff/ViewDiffButton.tsx index b21315a50e..34583a6063 100644 --- a/web/src/features/VersionDiff/ViewDiffButton.tsx +++ b/web/src/features/VersionDiff/ViewDiffButton.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { Version } from "@types"; import { useSelectedApp } from "@features/App/hooks/useSelectedApp"; import { useIsHelmManaged } from "@components/hooks"; diff --git a/web/src/index.tsx b/web/src/index.tsx index 2fd5872507..6c6c1f230b 100644 --- a/web/src/index.tsx +++ b/web/src/index.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { createRoot } from "react-dom/client"; import { BrowserRouter } from "react-router-dom"; import ReplicatedErrorBoundary from "./components/shared/ErrorBoundary"; diff --git a/web/src/routes/RootRoutes.tsx b/web/src/routes/RootRoutes.tsx deleted file mode 100644 index ab2a0d4902..0000000000 --- a/web/src/routes/RootRoutes.tsx +++ /dev/null @@ -1,17 +0,0 @@ -// import React from "react"; - -const RootRoutes: [] = [ - // { - // path: '/app', - // element: , - // children: [ - // { path: '/discussions/*', element: }, - // { path: '/users', element: }, - // { path: '/profile', element: }, - // { path: '/', element: }, - // { path: '*', element: }, - // ], - // }, -]; - -export { RootRoutes }; diff --git a/web/src/stories/AutomaticUpdatesModal.stories.tsx b/web/src/stories/AutomaticUpdatesModal.stories.tsx index b03a4da0b7..7f82c5fd92 100644 --- a/web/src/stories/AutomaticUpdatesModal.stories.tsx +++ b/web/src/stories/AutomaticUpdatesModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import AutomaticUpdatesModal from "@src/components/modals/AutomaticUpdatesModal"; diff --git a/web/src/stories/BackupRestoreModal.stories.tsx b/web/src/stories/BackupRestoreModal.stories.tsx index 363e5e196c..660155028f 100644 --- a/web/src/stories/BackupRestoreModal.stories.tsx +++ b/web/src/stories/BackupRestoreModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import BackupRestoreModal from "@src/components/modals/BackupRestoreModal"; diff --git a/web/src/stories/ChangePasswordModal.stories.tsx b/web/src/stories/ChangePasswordModal.stories.tsx index 4d7a597567..9f9c1fa8a7 100644 --- a/web/src/stories/ChangePasswordModal.stories.tsx +++ b/web/src/stories/ChangePasswordModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import ChangePasswordModal from "@src/components/modals/ChangePasswordModal/ChangePasswordModal"; diff --git a/web/src/stories/CodeSnippet.stories.tsx b/web/src/stories/CodeSnippet.stories.tsx index 52f13a665d..16120a57db 100644 --- a/web/src/stories/CodeSnippet.stories.tsx +++ b/web/src/stories/CodeSnippet.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import CodeSnippet from "../components/shared/CodeSnippet"; diff --git a/web/src/stories/ConfigureRedactorsModal.stories.tsx b/web/src/stories/ConfigureRedactorsModal.stories.tsx index fdfb0b3f2d..097975525e 100644 --- a/web/src/stories/ConfigureRedactorsModal.stories.tsx +++ b/web/src/stories/ConfigureRedactorsModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import ConfigureRedactorsModal from "@src/components/troubleshoot/ConfigureRedactorsModal"; diff --git a/web/src/stories/DeleteRedactorModal.stories.tsx b/web/src/stories/DeleteRedactorModal.stories.tsx index 11011c3250..b106ff2c30 100644 --- a/web/src/stories/DeleteRedactorModal.stories.tsx +++ b/web/src/stories/DeleteRedactorModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import DeleteRedactorModal from "@src/components/modals/DeleteRedactorModal"; diff --git a/web/src/stories/DeleteSnapshotModal.stories.tsx b/web/src/stories/DeleteSnapshotModal.stories.tsx index 6feb344d7e..fb61109760 100644 --- a/web/src/stories/DeleteSnapshotModal.stories.tsx +++ b/web/src/stories/DeleteSnapshotModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import DeleteSnapshotModal from "@src/components/modals/DeleteSnapshotModal"; diff --git a/web/src/stories/DeployWarningModal.stories.tsx b/web/src/stories/DeployWarningModal.stories.tsx index 7e28c04a9d..6aa5684102 100644 --- a/web/src/stories/DeployWarningModal.stories.tsx +++ b/web/src/stories/DeployWarningModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import DeployWarningModalModal from "@src/components/shared/modals/DeployWarningModal"; diff --git a/web/src/stories/ErrorModal.stories.tsx b/web/src/stories/ErrorModal.stories.tsx index ad21307358..7f121b309d 100644 --- a/web/src/stories/ErrorModal.stories.tsx +++ b/web/src/stories/ErrorModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import ErrorModal from "@src/components/modals/ErrorModal"; diff --git a/web/src/stories/HelmDeployModal.stories.tsx b/web/src/stories/HelmDeployModal.stories.tsx index c5376cfc06..7aa0956298 100644 --- a/web/src/stories/HelmDeployModal.stories.tsx +++ b/web/src/stories/HelmDeployModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import { HelmDeployModal } from "@src/components/shared/modals/HelmDeployModal"; diff --git a/web/src/stories/Icons.stories.tsx b/web/src/stories/Icons.stories.tsx index 226690e6c8..70acc195ff 100644 --- a/web/src/stories/Icons.stories.tsx +++ b/web/src/stories/Icons.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import Icon from "@src/components/Icon"; import data from "../components/selection.json"; diff --git a/web/src/stories/RestoreSnapshotModal.stories.tsx b/web/src/stories/RestoreSnapshotModal.stories.tsx index d968bb9176..7eccf36988 100644 --- a/web/src/stories/RestoreSnapshotModal.stories.tsx +++ b/web/src/stories/RestoreSnapshotModal.stories.tsx @@ -1,7 +1,7 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import RestoreSnapshotModal from "@src/components/modals/RestoreSnapshotModal"; +import { ChangeEvent, useState } from "react"; export default { title: "Example/RestoreSnapshotModal", @@ -9,11 +9,9 @@ export default { } as ComponentMeta; const Template: ComponentStory = (args) => { - const [appSlugMismatch, setAppSlugMismatch] = React.useState(false); - const [appSlugToRestore, setAppSlugToRestore] = React.useState(""); - const handleApplicationSlugChange = ( - e: React.ChangeEvent - ) => { + const [appSlugMismatch, setAppSlugMismatch] = useState(false); + const [appSlugToRestore, setAppSlugToRestore] = useState(""); + const handleApplicationSlugChange = (e: ChangeEvent) => { if (appSlugMismatch) { setAppSlugMismatch(false); } diff --git a/web/src/stories/ShowAllModal.stories.tsx b/web/src/stories/ShowAllModal.stories.tsx index 9c70976ee1..915aa9340d 100644 --- a/web/src/stories/ShowAllModal.stories.tsx +++ b/web/src/stories/ShowAllModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentMeta } from "@storybook/react"; import ShowAllModal from "@src/components/modals/ShowAllModal"; diff --git a/web/src/stories/ShowDetailsModal.stories.tsx b/web/src/stories/ShowDetailsModal.stories.tsx index 48f48b82f3..f3336ce678 100644 --- a/web/src/stories/ShowDetailsModal.stories.tsx +++ b/web/src/stories/ShowDetailsModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import ShowDetailsModal from "@src/components/modals/ShowDetailsModal"; diff --git a/web/src/stories/ShowLogsModal.stories.tsx b/web/src/stories/ShowLogsModal.stories.tsx index 8b203891c9..815d7748dd 100644 --- a/web/src/stories/ShowLogsModal.stories.tsx +++ b/web/src/stories/ShowLogsModal.stories.tsx @@ -1,7 +1,7 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import ShowLogsModal from "@src/components/modals/ShowLogsModal"; +import { useState } from "react"; export default { title: "Example/ShowLogsModal", @@ -9,7 +9,7 @@ export default { } as ComponentMeta; const Template: ComponentStory = (args) => { - const [selectedTab, setSelectedTab] = React.useState("dryrunStdout"); + const [selectedTab, setSelectedTab] = useState("dryrunStdout"); const renderLogsTab = () => { const isHelmManaged = false; const filterNonHelmTabs = (tab: string) => { diff --git a/web/src/stories/SkipPrelightsModal.stories.tsx b/web/src/stories/SkipPrelightsModal.stories.tsx index 1b841ad92d..114416394d 100644 --- a/web/src/stories/SkipPrelightsModal.stories.tsx +++ b/web/src/stories/SkipPrelightsModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import SkipPreflightsModalModal from "@src/components/shared/modals/SkipPreflightsModal"; diff --git a/web/src/stories/SnapshotDifferencesModal.stories.tsx b/web/src/stories/SnapshotDifferencesModal.stories.tsx index 9141683828..8ed55b9c3b 100644 --- a/web/src/stories/SnapshotDifferencesModal.stories.tsx +++ b/web/src/stories/SnapshotDifferencesModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import SnapshotDifferencesModal from "@src/components/modals/SnapshotDifferencesModal"; diff --git a/web/src/stories/Toast.stories.tsx b/web/src/stories/Toast.stories.tsx index b8b7fca355..43ab03c9c5 100644 --- a/web/src/stories/Toast.stories.tsx +++ b/web/src/stories/Toast.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import Toast from "@src/components/shared/Toast"; import Icon from "@src/components/Icon"; diff --git a/web/src/stories/UploadSupportBundle.stories.tsx b/web/src/stories/UploadSupportBundle.stories.tsx index e125cac91a..80d397e601 100644 --- a/web/src/stories/UploadSupportBundle.stories.tsx +++ b/web/src/stories/UploadSupportBundle.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import UploadSupportBundleModal from "@src/components/troubleshoot/UploadSupportBundleModal"; diff --git a/web/src/stories/ViewSnapshotLogsModal.stories.tsx b/web/src/stories/ViewSnapshotLogsModal.stories.tsx index 7ced64bae4..27b552b111 100644 --- a/web/src/stories/ViewSnapshotLogsModal.stories.tsx +++ b/web/src/stories/ViewSnapshotLogsModal.stories.tsx @@ -1,4 +1,3 @@ -import React from "react"; import { ComponentStory, ComponentMeta } from "@storybook/react"; import { MemoryRouter } from "react-router-dom"; import ViewSnapshotLogsModal from "@src/components/modals/ViewSnapshotLogsModal"; diff --git a/web/src/utilities/react-router-utilities.tsx b/web/src/utilities/react-router-utilities.tsx index 776f4b0b72..18126be23d 100644 --- a/web/src/utilities/react-router-utilities.tsx +++ b/web/src/utilities/react-router-utilities.tsx @@ -1,6 +1,6 @@ import { useSelectedApp } from "@features/App"; import useApps from "@features/Gitops/hooks/useApps"; -import React, { ComponentType } from "react"; +import { ComponentType } from "react"; import { useNavigate, useLocation, diff --git a/web/tsconfig.json b/web/tsconfig.json index 629be8cd09..eb52fa0378 100644 --- a/web/tsconfig.json +++ b/web/tsconfig.json @@ -129,7 +129,7 @@ "isolatedModules": true, // Unconditionally emit imports for unresolved files "resolveJsonModule": true, // Include modules imported with .json extension "noEmit": true, // Do not emit output (meaning do not compile code, only perform type checking) - "jsx": "react", // Support JSX in .tsx files + "jsx": "react-jsx", // Support JSX in .tsx files "sourceMap": true, // Generate corrresponding .map file "declaration": true, // Generate corresponding .d.ts file "noUnusedLocals": true, // Report errors on unused locals