From 5d27f2b8f289d71120f094330dc62f26e21f07d3 Mon Sep 17 00:00:00 2001
From: Wroud <wrouds@gmail.com>
Date: Mon, 5 Oct 2020 19:36:24 +0300
Subject: [PATCH] chore: lint improvements

---
 webapp/.eslintrc.js                           |  19 ++-
 webapp/package.json                           |  10 +-
 .../AdministrationItemService.ts              |  10 +-
 .../AdministrationScreen.tsx                  |   7 +-
 .../AdministrationScreenService.ts            |   4 +-
 .../AdministrationScreenServiceBootstrap.ts   |  16 +--
 .../ConfigurationWizardScreen.tsx             |   8 +-
 .../ConfigurationWizardService.ts             |  27 ++--
 .../Pages/Finish/FinishPageDrawerItem.tsx     |   4 +-
 .../ServerConfigurationService.ts             |   8 +-
 .../NavigationNode/useNavigationNode.ts       |  13 +-
 .../TreeNodeMenu/TreeNodeMenu.tsx             |   4 +-
 .../ConnectionSchemaManagerService.ts         |  12 +-
 .../ConnectionSelectorController.ts           |   8 +-
 .../SettingsMenu/SettingsMenuService.ts       |   4 +-
 .../src/TopNavBar/shared/TopMenuItem.tsx      |   5 +-
 .../src/shared/InlineEditor/EditorDialog.tsx  |  14 +-
 .../NavigationTabs/NavigationTabsService.ts   |   4 +-
 .../NodesManager/ConnectionDialogsService.ts  |   8 +-
 .../NodesManager/NavNodeManagerService.ts     |   4 +-
 .../SessionExpire/SessionExpireService.ts     |   6 +-
 .../shared/TabEntity/TabContainerEntity.ts    |   2 +-
 .../ToolsPanel/LogViewTab/LogViewerService.ts |  12 +-
 .../core-app/src/shared/useChildren.ts        |   9 +-
 .../ObjectPropertyInfoForm.tsx                |  10 +-
 .../core-blocks/src/Table/TableItem.tsx       |   2 +-
 .../core-blocks/src/Table/TableItemExpand.tsx |   2 +-
 .../core-blocks/src/TextPlaceholder.tsx       |   2 +-
 .../core-blocks/src/layout/AppLogo.tsx        |   2 +-
 .../core-blocks/src/layout/TopAppBar.tsx      |   2 +-
 webapp/packages/core-blocks/src/useFocus.ts   |  16 ++-
 .../ConnectionAccess/ConnectionAccess.tsx     |   8 +-
 .../ConnectionAccess/Controller.ts            |   2 +-
 .../ConnectionForm/ConnectionForm.tsx         |   2 +
 .../Options/OptionsController.ts              |   6 +-
 .../ConnectionsTable/ConnectionEdit.tsx       |   2 +-
 .../CreateConnection/CreateConnection.tsx     |   2 +-
 .../src/CommonDialog/DialogsPortal.tsx        |   6 +-
 .../src/Menu/MenuPanel/MenuTrigger.tsx        |   6 +-
 .../packages/core-events/src/INotification.ts |   7 +-
 .../core-events/src/NotificationService.ts    |  20 +--
 .../core-extensions/src/createExtension.ts    |   6 +-
 .../core-localization/src/Translate.tsx       |  20 ++-
 .../core-localization/src/useTranslate.ts     |  12 +-
 .../core-notifications/src/Notifications.tsx  |   2 +-
 .../ErrorDetailsDialog/ErrorDetailsDialog.tsx |  10 +-
 .../NotificationsItem/NotificationsItem.tsx   |   7 +-
 .../src/LocalStorageSaveService.ts            |   2 +-
 .../core-settings/src/SettingsService.ts      |   2 +-
 webapp/packages/core-theming/src/useStyles.ts |   3 -
 .../src/Administration/Users/CreateUser.tsx   |   2 +-
 .../Users/UserForm/GrantedConnections.tsx     |  12 +-
 .../Users/UserForm/UserForm.tsx               |  18 +--
 .../Users/UserForm/UserFormController.ts      |   4 +-
 .../Users/UsersAdministration.tsx             |   2 +-
 .../Administration/Users/UsersDrawerItem.tsx  |   2 +-
 .../Administration/Users/UsersTable/User.tsx  |   2 +-
 .../Users/UsersTable/UserEdit.tsx             |   2 +-
 .../Users/UsersTable/UsersTable.tsx           |   8 +-
 .../src/Dialog/AuthDialog.tsx                 |   2 +-
 .../src/Dialog/AuthDialogFooter.tsx           |   2 +-
 .../AuthProviderForm/AuthProviderForm.tsx     |   6 +-
 .../ConnectionForm/ConnectionForm.tsx         |   8 +-
 .../ConnectionForm/ParametersForm.tsx         |   8 +-
 .../ConnectionFormDialog.tsx                  |   9 +-
 .../ConnectionFormDialogFooter.tsx            |   8 +-
 .../CustomConnectionDialog.tsx                |   5 +-
 .../DriverSelectorDialog/Driver.tsx           |   2 +-
 .../DriverSelectorDialog/DriverSelector.tsx   |   4 +-
 .../DriverSelectorDialog.tsx                  |   2 +-
 .../src/ConnectionDialog/ConnectionDialog.tsx |   2 +-
 .../ConnectionDialogFooter.tsx                |   6 +-
 .../TemplateConnectionItem.tsx                |   2 +-
 .../src/DataExportMenuService.ts              |   4 +-
 .../src/DataExportProcessService.ts           |  10 +-
 .../src/DataExportService.ts                  |  14 +-
 .../src/Dialog/DataExportDialog.tsx           |   2 +-
 .../ExportProcessorList.tsx                   |   2 +-
 .../ExportProcessorList/ProcessorItem.tsx     |   2 +-
 .../src/Dialog/ProcessorConfigureDialog.tsx   |   6 +-
 .../Dialog/ProcessorConfigureDialogFooter.tsx |   8 +-
 .../src/Dialog/ProcessorSelectDialog.tsx      |   2 +-
 .../ExportNotificationController.ts           |  32 ++---
 .../src/AgGridTable/IndexCellRenderer.tsx     |   2 +-
 .../PlainTextEditor/PlainTextEditor.tsx       |   8 +-
 .../TableColumnHeader/TableColumnHeader.tsx   |  10 +-
 .../modules/RangeSelection/rangeController.ts |  10 +-
 .../src/DataViewerPage/DataViewerPanel.tsx    |  14 +-
 .../src/DataViewerPage/DataViewerTab.tsx      |   2 +-
 .../src/TableViewer/ErrorDialog.tsx           |   6 +-
 .../TableDataModel/TableDataModel.ts          |   4 +-
 .../TableViewer/TableDataModel/TableRow.ts    |   2 +-
 .../TableViewer/TableFooter/TableFooter.tsx   |   6 +-
 .../TableFooterMenu/TableFooterMenu.tsx       |   2 +-
 .../TableFooterMenu/TableFooterMenuItem.tsx   |  11 +-
 .../src/TableViewer/TableGrid.tsx             |   2 +-
 .../TableViewer/TableHeader/TableHeader.tsx   |   2 +-
 .../TableHeader/TableWhereFilter.tsx          |   6 +-
 .../TableLeftBar/PresentationTab.tsx          |  18 +--
 .../TableViewer/TableLeftBar/TableLeftBar.tsx |   2 +-
 .../src/TableViewer/TableViewer.tsx           |   2 +-
 .../src/DdlViewer/DdlViewer.tsx               |   7 +-
 .../src/ObjectPage/DBObjectPageTab.tsx        |   2 +-
 .../ObjectPropertiesPage/ObjectFolders.tsx    |   2 +-
 .../ObjectInfoTab/ObjectInfoTab.tsx           |   2 +-
 .../ObjectInfoTab/ObjectInfoTabService.ts     |   4 +-
 .../ObjectInfoTab/ObjectProperty.tsx          |   4 +-
 .../ObjectPropertiesPageTab.tsx               |   4 +-
 .../ObjectPropertyTable/Header.tsx            |  13 +-
 .../ObjectPropertyTable/Item.tsx              |   7 +-
 .../ObjectPropertyTable.tsx                   |   4 +-
 .../formControls/ObjectPropertyCheckbox.tsx   |   2 +-
 .../formControls/ObjectPropertyInput.tsx      |   9 +-
 .../src/ObjectViewerPanel.tsx                 |   2 +-
 .../src/ObjectViewerTab.tsx                   |   2 +-
 .../src/ObjectViewerTabService.ts             |  14 +-
 .../src/useObjectFolder.ts                    |   4 +-
 .../src/SqlEditor/CodeEditor/CodeEditor.tsx   |   3 +-
 .../src/SqlEditor/SqlEditor.tsx               |  12 +-
 .../src/SqlEditor/SqlEditorController.tsx     |   4 +-
 .../src/SqlEditorBootstrap.ts                 |   4 +-
 .../plugin-sql-editor/src/SqlEditorPanel.tsx  |   6 +-
 .../src/SqlEditorTabService.ts                |  16 +--
 .../SqlResultPanel/SqlResultPanel.tsx         |   2 +-
 .../src/SqlResultTabs/SqlResultTabs.tsx       |   4 +-
 .../src/SqlResultTabs/SqlResultTabsService.ts |   8 +-
 webapp/yarn.lock                              | 122 +++++++++++++++---
 127 files changed, 537 insertions(+), 414 deletions(-)

diff --git a/webapp/.eslintrc.js b/webapp/.eslintrc.js
index 23c6e97778..8680bd84fd 100644
--- a/webapp/.eslintrc.js
+++ b/webapp/.eslintrc.js
@@ -1,9 +1,10 @@
 module.exports = {
   parser: '@typescript-eslint/parser',
   extends: [
-    'airbnb-base',
-    'eslint:recommended',
-    'plugin:react/recommended',
+    // 'airbnb-typescript',
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react-hooks/recommended",
     'plugin:@typescript-eslint/recommended',
   ],
 
@@ -36,6 +37,17 @@ module.exports = {
     },
   },
 
+  parserOptions: {
+    ecmaFeatures: {
+      "jsx": true
+    }
+  },
+
+  // parserOptions: {
+  //   tsconfigRootDir: __dirname,
+  //   project: './packages/**/tsconfig.json',
+  // },
+
   rules: {
     'arrow-parens': ['error', 'as-needed', { 'requireForBlockBody': true }],
     'curly': ['error', 'all'],
@@ -78,6 +90,7 @@ module.exports = {
     'react/jsx-curly-spacing': ['error', { "when": "never", "children": true }],
     'react/jsx-equals-spacing': ['error', 'never'],
     'react/jsx-first-prop-new-line': ['warn', 'multiline'],
+    'react/jsx-fragments': ['error', 'syntax'],
     'brace-style': 'off', // prefer 1tbs or stroustrup styles, avoid allman style
     'operator-linebreak': 'warn',
     'consistent-return': 'off',
diff --git a/webapp/package.json b/webapp/package.json
index b857aa97f0..54ff8bb9fa 100644
--- a/webapp/package.json
+++ b/webapp/package.json
@@ -22,7 +22,7 @@
     "@csstools/postcss-sass": "^4.0.0",
     "@types/react": "^16.9.49",
     "@types/react-dom": "^16.9.8",
-    "@typescript-eslint/eslint-plugin": "^4.1.0",
+    "@typescript-eslint/eslint-plugin": "^4.3.0",
     "@typescript-eslint/parser": "^4.1.0",
     "babel-loader": "^8.1.0",
     "babel-plugin-module-resolver": "^4.0.0",
@@ -33,14 +33,16 @@
     "declaration-bundler-webpack-plugin": "^1.0.3",
     "eslint": "^7.8.1",
     "eslint-config-airbnb-base": "^14.2.0",
+    "eslint-config-airbnb-typescript": "^11.0.0",
     "eslint-import-resolver-typescript": "^2.3.0",
     "eslint-loader": "^4.0.2",
-    "eslint-plugin-import": "^2.22.0",
+    "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-import-helpers": "^1.1.0",
     "eslint-plugin-jest": "^24.0.0",
     "eslint-plugin-jsx-a11y": "^6.3.1",
-    "eslint-plugin-react": "^7.20.6",
-    "eslint-plugin-react-hooks": "^4.1.0",
+    "eslint-plugin-react": "^7.21.3",
+    "eslint-plugin-react-hooks": "^4.1.2",
+    "eslint-plugin-standard": "^4.0.1",
     "fork-ts-checker-webpack-plugin": "^5.1.0",
     "html-webpack-plugin": "^4.4.1",
     "json5-loader": "^4.0.0",
diff --git a/webapp/packages/core-administration/src/AdministrationItem/AdministrationItemService.ts b/webapp/packages/core-administration/src/AdministrationItem/AdministrationItemService.ts
index 6accc556af..28c3d65356 100644
--- a/webapp/packages/core-administration/src/AdministrationItem/AdministrationItemService.ts
+++ b/webapp/packages/core-administration/src/AdministrationItem/AdministrationItemService.ts
@@ -32,8 +32,8 @@ export class AdministrationItemService {
 
   getItem(name: string, configurationWizard: boolean): IAdministrationItem | null {
     const item = this.items.find(item => (
-      filterConfigurationWizard(configurationWizard)(item)
-      && item.name === name
+      filterConfigurationWizard(configurationWizard)(item) &&
+      item.name === name
     ));
     if (!item) {
       return null;
@@ -55,9 +55,9 @@ export class AdministrationItemService {
     const type = options.type ?? AdministrationItemType.Administration;
 
     if (this.items.some(item => item.name === options.name && (
-      item.type === type
-      || item.type === AdministrationItemType.Default
-      || type === AdministrationItemType.Default
+      item.type === type ||
+      item.type === AdministrationItemType.Default ||
+      type === AdministrationItemType.Default
     ))) {
       throw new Error(`Administration item "${options.name}" already exists in the same visibility scope`);
     }
diff --git a/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreen.tsx b/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreen.tsx
index a916bad7b6..9fec15b9de 100644
--- a/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreen.tsx
+++ b/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreen.tsx
@@ -20,14 +20,15 @@ import { AdministrationTopAppBar } from './AdministrationTopAppBar/Administratio
 
 export const AdministrationScreen = observer(function AdministrationScreen() {
   const administrationScreenService = useService(AdministrationScreenService);
-  if (!usePermission(EAdminPermission.admin)) {
-    return <Translate token='root_permission_denied' />;
-  }
 
   const handleSelect = useCallback(
     (item: string) => administrationScreenService.navigateToItem(item),
     [administrationScreenService]
   );
+  
+  if (!usePermission(EAdminPermission.admin)) {
+    return <Translate token='root_permission_denied' />;
+  }
 
   return (
     <>
diff --git a/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreenService.ts b/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreenService.ts
index ed98975f4a..c4952f1041 100644
--- a/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreenService.ts
+++ b/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreenService.ts
@@ -128,7 +128,7 @@ export class AdministrationScreenService {
   }
 
   isAdministrationRouteActive() {
-    return this.screenService.isActive(AdministrationScreenService.screenName)
-    || this.screenService.isActive(AdministrationScreenService.setupName);
+    return this.screenService.isActive(AdministrationScreenService.screenName) ||
+    this.screenService.isActive(AdministrationScreenService.setupName);
   }
 }
diff --git a/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreenServiceBootstrap.ts b/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreenServiceBootstrap.ts
index 9500f22cd9..f2f82c418f 100644
--- a/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreenServiceBootstrap.ts
+++ b/webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreenServiceBootstrap.ts
@@ -93,8 +93,8 @@ export class AdministrationScreenServiceBootstrap extends Bootstrap {
   async load() {
     await this.serverConfigResource.load(null);
 
-    if (this.administrationScreenService.isConfigurationMode
-      && !this.screenService.isActive(AdministrationScreenService.setupName)) {
+    if (this.administrationScreenService.isConfigurationMode &&
+      !this.screenService.isActive(AdministrationScreenService.setupName)) {
       this.administrationScreenService.navigateToRoot();
     }
   }
@@ -104,8 +104,8 @@ export class AdministrationScreenServiceBootstrap extends Bootstrap {
       this.administrationScreenService.activationEvent.execute(false);
     }
 
-    if (this.administrationScreenService.isConfigurationMode
-      && !this.screenService.isActive(AdministrationScreenService.setupName)) {
+    if (this.administrationScreenService.isConfigurationMode &&
+      !this.screenService.isActive(AdministrationScreenService.setupName)) {
       this.administrationScreenService.navigateToRoot();
     }
   }
@@ -149,13 +149,13 @@ export class AdministrationScreenServiceBootstrap extends Bootstrap {
 
   private async isAccessProvided() {
     await this.serverConfigResource.load(null);
-    if (!await this.permissionsService.hasAsync(EAdminPermission.admin)
-          && !this.administrationScreenService.isConfigurationMode) {
+    if (!await this.permissionsService.hasAsync(EAdminPermission.admin) &&
+          !this.administrationScreenService.isConfigurationMode) {
       return false;
     }
 
-    if (!this.administrationScreenService.isConfigurationMode
-        && this.screenService.isActive(AdministrationScreenService.setupName)) {
+    if (!this.administrationScreenService.isConfigurationMode &&
+        this.screenService.isActive(AdministrationScreenService.setupName)) {
       return false;
     }
 
diff --git a/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/ConfigurationWizardScreen.tsx b/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/ConfigurationWizardScreen.tsx
index 83da8fbb7d..64c141c1bc 100644
--- a/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/ConfigurationWizardScreen.tsx
+++ b/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/ConfigurationWizardScreen.tsx
@@ -23,17 +23,17 @@ import { WizardTopAppBar } from './WizardTopAppBar/WizardTopAppBar';
 export const ConfigurationWizardScreen = observer(function ConfigurationWizardScreen() {
   const administrationItemService = useService(AdministrationItemService);
   const administrationScreenService = useService(AdministrationScreenService);
-  if (!usePermission(EAdminPermission.admin)) {
-    return <Translate token='root_permission_denied' />;
-  }
 
   const handleSelect = useCallback(
     (item: string) => {
       const route = administrationItemService.getItem(item, true)?.configurationWizardOptions?.defaultRoute;
       administrationScreenService.navigateTo(item, route);
     },
-    [administrationScreenService]
+    [administrationItemService, administrationScreenService]
   );
+  if (!usePermission(EAdminPermission.admin)) {
+    return <Translate token='root_permission_denied' />;
+  }
 
   return (
     <>
diff --git a/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/ConfigurationWizardService.ts b/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/ConfigurationWizardService.ts
index 3c2d3025ab..4edbea1665 100644
--- a/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/ConfigurationWizardService.ts
+++ b/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/ConfigurationWizardService.ts
@@ -14,29 +14,30 @@ import { ScreenService } from '@cloudbeaver/core-routing';
 
 import { AdministrationItemService } from '../../AdministrationItem/AdministrationItemService';
 import { filterConfigurationWizard } from '../../AdministrationItem/filterConfigurationWizard';
+import { IAdministrationItem } from '../../AdministrationItem/IAdministrationItem';
 import { orderAdministrationItems } from '../../AdministrationItem/orderAdministrationItems';
 import { AdministrationScreenService } from '../AdministrationScreenService';
 
 @injectable()
 export class ConfigurationWizardService {
 
-  @computed get steps() {
+  @computed get steps(): IAdministrationItem[] {
     return this.administrationItemService.items
       .filter(filterConfigurationWizard(true))
       .sort(orderAdministrationItems);
   }
 
-  @computed get stepsToFinish() {
+  @computed get stepsToFinish(): IAdministrationItem[] {
     return this.steps.filter(step => step.configurationWizardOptions?.isDone);
   }
 
-  @computed get finishedSteps() {
+  @computed get finishedSteps(): IAdministrationItem[] {
     return this.steps.filter(step => (
       step.configurationWizardOptions?.isDone && step.configurationWizardOptions.isDone()
     ));
   }
 
-  @computed get currentStepIndex() {
+  @computed get currentStepIndex(): number {
     if (!this.currentStep) {
       return 0;
     }
@@ -44,10 +45,10 @@ export class ConfigurationWizardService {
     return this.steps.indexOf(this.currentStep) || 0;
   }
 
-  @computed get canFinish() {
+  @computed get canFinish(): boolean {
     return this.steps.every((step) => {
-      if (step.configurationWizardOptions?.isDone
-          && !step.configurationWizardOptions?.isDone()) {
+      if (step.configurationWizardOptions?.isDone &&
+          !step.configurationWizardOptions?.isDone()) {
         return false;
       }
 
@@ -55,7 +56,7 @@ export class ConfigurationWizardService {
     });
   }
 
-  @computed get nextStep() {
+  @computed get nextStep(): IAdministrationItem | undefined {
     return this.steps.find((item, index) => {
       if (index <= this.currentStepIndex) {
         return false;
@@ -69,7 +70,7 @@ export class ConfigurationWizardService {
     });
   }
 
-  @computed get currentStep() {
+  @computed get currentStep(): IAdministrationItem | undefined {
     return this.steps.find(step => step.name === this.administrationScreenService.activeItem);
   }
 
@@ -81,7 +82,7 @@ export class ConfigurationWizardService {
     private serverConfigResource: ServerConfigResource
   ) { }
 
-  isStepAvailable(name: string) {
+  isStepAvailable(name: string): boolean {
     if (this.currentStep?.name === name) {
       return true;
     }
@@ -99,7 +100,7 @@ export class ConfigurationWizardService {
     return false;
   }
 
-  async finishStep(name: string) {
+  async finishStep(name: string): Promise<boolean> {
     const step = this.getStep(name);
 
     if (!step) {
@@ -119,7 +120,7 @@ export class ConfigurationWizardService {
     return true;
   }
 
-  async next() {
+  async next(): Promise<void> {
     if (!this.currentStep) {
       return;
     }
@@ -140,7 +141,7 @@ export class ConfigurationWizardService {
     }
   }
 
-  back() {
+  back(): void {
     if (!this.currentStep) {
       return;
     }
diff --git a/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/Pages/Finish/FinishPageDrawerItem.tsx b/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/Pages/Finish/FinishPageDrawerItem.tsx
index 31b4fc3be8..25bc95ded6 100644
--- a/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/Pages/Finish/FinishPageDrawerItem.tsx
+++ b/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/Pages/Finish/FinishPageDrawerItem.tsx
@@ -25,8 +25,8 @@ export const FinishPageDrawerItem = observer(function FinishPageDrawerItem({
   return styled(useStyles(...style))(
     <Tab
       tabId={item.name}
-      disabled={disabled
-        || (item.configurationWizardOptions?.isDisabled && item.configurationWizardOptions.isDisabled())}
+      disabled={disabled ||
+        (item.configurationWizardOptions?.isDisabled && item.configurationWizardOptions.isDisabled())}
       onOpen={() => onSelect(item.name)}
     >
       <TabIcon icon='/icons/confirmation.svg' viewBox='0 0 16 16' />
diff --git a/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/Pages/ServerConfiguration/ServerConfigurationService.ts b/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/Pages/ServerConfiguration/ServerConfigurationService.ts
index 4359be4db8..7ad2c5a127 100644
--- a/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/Pages/ServerConfiguration/ServerConfigurationService.ts
+++ b/webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/Pages/ServerConfiguration/ServerConfigurationService.ts
@@ -76,10 +76,10 @@ export class ServerConfigurationService {
 
   private isFormFilled() {
     return !!(
-      this.state?.serverConfig.serverName
-      && this.state.serverConfig.adminName
-      && this.state.serverConfig.adminName.length > 5
-      && this.state.serverConfig.adminPassword
+      this.state?.serverConfig.serverName &&
+      this.state.serverConfig.adminName &&
+      this.state.serverConfig.adminName.length > 5 &&
+      this.state.serverConfig.adminPassword
     );
   }
 
diff --git a/webapp/packages/core-app/src/NavigationTree/NavigationTreeNode/NavigationNode/useNavigationNode.ts b/webapp/packages/core-app/src/NavigationTree/NavigationTreeNode/NavigationNode/useNavigationNode.ts
index 40787fb2d2..9c5a28650c 100644
--- a/webapp/packages/core-app/src/NavigationTree/NavigationTreeNode/NavigationNode/useNavigationNode.ts
+++ b/webapp/packages/core-app/src/NavigationTree/NavigationTreeNode/NavigationNode/useNavigationNode.ts
@@ -23,6 +23,8 @@ export function useNavigationNode(node: NavNode, nodeLoading: boolean, nodeLoade
   const [isSelected, switchSelect] = useState(false);
   const [isExpanding, setExpanding] = useState(false);
   const children = useChildren(node.id);
+  const connectionId = NodeManagerUtils.connectionNodeIdToConnectionId(node.id);
+  const { connectionInfo } = useConnectionInfo(connectionId);
 
   const isLoading = nodeLoading || children.isLoading || isExpanding;
   const isLoaded = children.isLoaded || nodeLoaded;
@@ -31,14 +33,9 @@ export function useNavigationNode(node: NavNode, nodeLoading: boolean, nodeLoade
   );
   let isExpandedActually = isExpanded && (children.children?.length || 0) > 0;
 
-  if (node.objectFeatures.includes(EObjectFeature.dataSource)) {
-    const connectionId = NodeManagerUtils.connectionNodeIdToConnectionId(node.id);
-    const { connectionInfo } = useConnectionInfo(connectionId);
-
-    if (!connectionInfo?.connected) {
-      isExpandable = true;
-      isExpandedActually = false;
-    }
+  if (node.objectFeatures.includes(EObjectFeature.dataSource) && !connectionInfo?.connected) {
+    isExpandable = true;
+    isExpandedActually = false;
   }
 
   const handleDoubleClick = useCallback(
diff --git a/webapp/packages/core-app/src/NavigationTree/NavigationTreeNode/TreeNodeMenu/TreeNodeMenu.tsx b/webapp/packages/core-app/src/NavigationTree/NavigationTreeNode/TreeNodeMenu/TreeNodeMenu.tsx
index f99a1f7242..100dc8148d 100644
--- a/webapp/packages/core-app/src/NavigationTree/NavigationTreeNode/TreeNodeMenu/TreeNodeMenu.tsx
+++ b/webapp/packages/core-app/src/NavigationTree/NavigationTreeNode/TreeNodeMenu/TreeNodeMenu.tsx
@@ -35,8 +35,8 @@ export const TreeNodeMenu = observer(function TreeNodeMenu({
     [node]
   );
   const isHidden = useMemo(
-    () => computed(() => !menuPanel.menuItems.length
-      || menuPanel.menuItems.every(item => item.isHidden)),
+    () => computed(() => !menuPanel.menuItems.length ||
+      menuPanel.menuItems.every(item => item.isHidden)),
     [menuPanel]
   );
 
diff --git a/webapp/packages/core-app/src/TopNavBar/ConnectionSchemaManager/ConnectionSchemaManagerService.ts b/webapp/packages/core-app/src/TopNavBar/ConnectionSchemaManager/ConnectionSchemaManagerService.ts
index 0a6977f13b..078c0ea129 100644
--- a/webapp/packages/core-app/src/TopNavBar/ConnectionSchemaManager/ConnectionSchemaManagerService.ts
+++ b/webapp/packages/core-app/src/TopNavBar/ConnectionSchemaManager/ConnectionSchemaManagerService.ts
@@ -99,18 +99,18 @@ export class ConnectionSchemaManagerService {
   }
 
   get isConnectionChangeable(): boolean {
-    return !!this.activeItem?.changeConnectionId
-      && !this.connectionsManagerService.connectionObjectContainers.isLoading();
+    return !!this.activeItem?.changeConnectionId &&
+      !this.connectionsManagerService.connectionObjectContainers.isLoading();
   }
 
   get isObjectCatalogChangeable(): boolean {
-    return !!this.activeItem?.changeCatalogId
-      && !this.connectionsManagerService.connectionObjectContainers.isLoading();
+    return !!this.activeItem?.changeCatalogId &&
+      !this.connectionsManagerService.connectionObjectContainers.isLoading();
   }
 
   get isObjectSchemaChangeable(): boolean {
-    return !!this.activeItem?.changeSchemaId
-      && !this.connectionsManagerService.connectionObjectContainers.isLoading();
+    return !!this.activeItem?.changeSchemaId &&
+      !this.connectionsManagerService.connectionObjectContainers.isLoading();
   }
 
   @observable private activeItem: IActiveItem<any> | null = null;
diff --git a/webapp/packages/core-app/src/TopNavBar/ConnectionSchemaManager/ConnectionSelector/ConnectionSelectorController.ts b/webapp/packages/core-app/src/TopNavBar/ConnectionSchemaManager/ConnectionSelector/ConnectionSelectorController.ts
index 3bd058a8a6..2ca24794d9 100644
--- a/webapp/packages/core-app/src/TopNavBar/ConnectionSchemaManager/ConnectionSelector/ConnectionSelectorController.ts
+++ b/webapp/packages/core-app/src/TopNavBar/ConnectionSchemaManager/ConnectionSelector/ConnectionSelectorController.ts
@@ -48,13 +48,13 @@ export class ConnectionSelectorController {
     return !!this.currentConnection;
   }
   get isObjectContainerSelectorVisible() {
-    return !!this.connectionSelectorService.currentObjectCatalogId
-      || !!this.connectionSelectorService.currentObjectSchemaId;
+    return !!this.connectionSelectorService.currentObjectCatalogId ||
+      !!this.connectionSelectorService.currentObjectSchemaId;
   }
 
   @computed get objectContainerSelectionDisabled(): boolean {
-    return !this.connectionSelectorService.isConnectionChangeable
-      || this.getObjectContainerItems().length === 0;
+    return !this.connectionSelectorService.isConnectionChangeable ||
+      this.getObjectContainerItems().length === 0;
   }
 
   private get currentObjectContainerTitle(): string | undefined {
diff --git a/webapp/packages/core-app/src/TopNavBar/SettingsMenu/SettingsMenuService.ts b/webapp/packages/core-app/src/TopNavBar/SettingsMenu/SettingsMenuService.ts
index 2ec83460fe..572ea04f54 100644
--- a/webapp/packages/core-app/src/TopNavBar/SettingsMenu/SettingsMenuService.ts
+++ b/webapp/packages/core-app/src/TopNavBar/SettingsMenu/SettingsMenuService.ts
@@ -57,8 +57,8 @@ export class SettingsMenuService extends Bootstrap {
       {
         id: 'administrationMenuEnter',
         order: 0,
-        isHidden: () => !this.permissionsService.has(EAdminPermission.admin)
-          || this.screenService.isActive(AdministrationScreenService.screenName),
+        isHidden: () => !this.permissionsService.has(EAdminPermission.admin) ||
+          this.screenService.isActive(AdministrationScreenService.screenName),
         title: 'administration_menu_enter',
         onClick: () => this.administrationScreenService.navigateToRoot(),
       }
diff --git a/webapp/packages/core-app/src/TopNavBar/shared/TopMenuItem.tsx b/webapp/packages/core-app/src/TopNavBar/shared/TopMenuItem.tsx
index 13898b5e96..50ed140b76 100644
--- a/webapp/packages/core-app/src/TopNavBar/shared/TopMenuItem.tsx
+++ b/webapp/packages/core-app/src/TopNavBar/shared/TopMenuItem.tsx
@@ -52,9 +52,10 @@ const buttonStyle = composes(
 
 export const TopMenuItem = observer(function TopMenuItem({ menuItem, style = [], ...props }: TopMenuItemProps) {
   const translate = useTranslate();
+  const styles = useStyles(!menuItem.panel ? buttonStyle : [...style, topMenuStyles]);
 
   if (!menuItem.panel) {
-    return styled(useStyles(buttonStyle))(
+    return styled(styles)(
       <Button
         as="button"
         {...props}
@@ -66,7 +67,7 @@ export const TopMenuItem = observer(function TopMenuItem({ menuItem, style = [],
     );
   }
 
-  return styled(useStyles(...style, topMenuStyles))(
+  return styled(styles)(
     <MenuTrigger
       {...props}
       panel={menuItem.panel}
diff --git a/webapp/packages/core-app/src/shared/InlineEditor/EditorDialog.tsx b/webapp/packages/core-app/src/shared/InlineEditor/EditorDialog.tsx
index 302bc515e4..3940d55235 100644
--- a/webapp/packages/core-app/src/shared/InlineEditor/EditorDialog.tsx
+++ b/webapp/packages/core-app/src/shared/InlineEditor/EditorDialog.tsx
@@ -37,11 +37,15 @@ const styles = css`
 `;
 
 export const EditorDialog: DialogComponent<string, string> = observer(
-  function EditorDialog(props: DialogComponentProps<string, string>) {
+  function EditorDialog({
+    payload,
+    resolveDialog,
+    rejectDialog,
+  }: DialogComponentProps<string, string>) {
     const textareaRef = useRef<HTMLTextAreaElement>(null);
-    const [value, setValue] = useState(props.payload);
+    const [value, setValue] = useState(payload);
     const handleChange = useCallback((event: ChangeEvent<HTMLTextAreaElement>) => setValue(event.target.value), []);
-    const handleApply = useCallback(() => props.resolveDialog(value), [value, props.resolveDialog]);
+    const handleApply = useCallback(() => resolveDialog(value), [value, resolveDialog]);
     const translate = useTranslate();
 
     useEffect(() => {
@@ -56,12 +60,12 @@ export const EditorDialog: DialogComponent<string, string> = observer(
             <Button type="button" mod={['unelevated']} onClick={handleApply}>
               {translate('app_shared_inlineEditor_dialog_apply')}
             </Button>
-            <Button type="button" mod={['outlined']} onClick={props.rejectDialog}>
+            <Button type="button" mod={['outlined']} onClick={rejectDialog}>
               {translate('app_shared_inlineEditor_dialog_cancel')}
             </Button>
           </controls>
         )}
-        onReject={props.rejectDialog}
+        onReject={rejectDialog}
       >
         <textarea ref={textareaRef} value={value} onChange={handleChange} />
       </CommonDialogWrapper>
diff --git a/webapp/packages/core-app/src/shared/NavigationTabs/NavigationTabsService.ts b/webapp/packages/core-app/src/shared/NavigationTabs/NavigationTabsService.ts
index afa901d0ba..37bd7a1f6d 100644
--- a/webapp/packages/core-app/src/shared/NavigationTabs/NavigationTabsService.ts
+++ b/webapp/packages/core-app/src/shared/NavigationTabs/NavigationTabsService.ts
@@ -65,8 +65,8 @@ export class NavigationTabsService {
         const map: IKeyValueMap<ITab> = {};
         for (const [key, value] of Object.entries(json as IKeyValueMap<ITab>)) {
           if (
-            typeof value.id === 'string'
-            && typeof value.handlerId === 'string'
+            typeof value.id === 'string' &&
+            typeof value.handlerId === 'string'
           ) {
             value.restored = false;
             map[key] = value;
diff --git a/webapp/packages/core-app/src/shared/NodesManager/ConnectionDialogsService.ts b/webapp/packages/core-app/src/shared/NodesManager/ConnectionDialogsService.ts
index 5be0b13937..4aa637ab9f 100644
--- a/webapp/packages/core-app/src/shared/NodesManager/ConnectionDialogsService.ts
+++ b/webapp/packages/core-app/src/shared/NodesManager/ConnectionDialogsService.ts
@@ -49,8 +49,8 @@ export class ConnectionDialogsService {
           const connectionId = NodeManagerUtils.connectionNodeIdToConnectionId(context.data.id);
           const connection = this.connectionInfoResource.get(connectionId);
 
-          return !context.data.objectFeatures.includes(EObjectFeature.dataSource)
-            || !connection?.connected;
+          return !context.data.objectFeatures.includes(EObjectFeature.dataSource) ||
+            !connection?.connected;
         },
         title: 'app_shared_connectionMenu_disconnect',
         onClick: (context: IMenuContext<NavNode>) => {
@@ -72,8 +72,8 @@ export class ConnectionDialogsService {
           const connectionId = NodeManagerUtils.connectionNodeIdToConnectionId(context.data.id);
           const connection = this.connectionInfoResource.get(connectionId);
 
-          return !context.data.objectFeatures.includes(EObjectFeature.dataSource)
-            || !connection?.features.includes(EConnectionFeature.temporary);
+          return !context.data.objectFeatures.includes(EObjectFeature.dataSource) ||
+            !connection?.features.includes(EConnectionFeature.temporary);
         },
         title: 'ui_delete',
         onClick: (context: IMenuContext<NavNode>) => {
diff --git a/webapp/packages/core-app/src/shared/NodesManager/NavNodeManagerService.ts b/webapp/packages/core-app/src/shared/NodesManager/NavNodeManagerService.ts
index 6e611ecdd7..866d37ee0f 100644
--- a/webapp/packages/core-app/src/shared/NodesManager/NavNodeManagerService.ts
+++ b/webapp/packages/core-app/src/shared/NodesManager/NavNodeManagerService.ts
@@ -221,8 +221,8 @@ export class NavNodeManagerService extends Bootstrap {
       return false;
     }
 
-    return node.objectFeatures.includes(ENodeFeature.dataContainer)
-      || node.objectFeatures.includes(ENodeFeature.container);
+    return node.objectFeatures.includes(ENodeFeature.dataContainer) ||
+      node.objectFeatures.includes(ENodeFeature.container);
   }
 
   getNodeContainerInfo(nodeId: string): INodeContainerInfo {
diff --git a/webapp/packages/core-app/src/shared/SessionExpire/SessionExpireService.ts b/webapp/packages/core-app/src/shared/SessionExpire/SessionExpireService.ts
index c8dbec6d5c..917162a0ce 100644
--- a/webapp/packages/core-app/src/shared/SessionExpire/SessionExpireService.ts
+++ b/webapp/packages/core-app/src/shared/SessionExpire/SessionExpireService.ts
@@ -38,9 +38,9 @@ export class SessionExpireService {
     try {
       return await request;
     } catch (exception) {
-      if (exception instanceof GQLError
-        && exception.errorCode === EServerErrorCode.sessionExpired
-        && !this.isNotifiedAboutExpiredSession) {
+      if (exception instanceof GQLError &&
+        exception.errorCode === EServerErrorCode.sessionExpired &&
+        !this.isNotifiedAboutExpiredSession) {
         this.isNotifiedAboutExpiredSession = true;
         this.onSessionExpire.next();
         try {
diff --git a/webapp/packages/core-app/src/shared/TabEntity/TabContainerEntity.ts b/webapp/packages/core-app/src/shared/TabEntity/TabContainerEntity.ts
index 833a6ce85f..e74677cd32 100644
--- a/webapp/packages/core-app/src/shared/TabEntity/TabContainerEntity.ts
+++ b/webapp/packages/core-app/src/shared/TabEntity/TabContainerEntity.ts
@@ -56,7 +56,7 @@ export class TabContainerEntity extends Entity implements ITabContainer, ITabCon
 
   @action
   activateTab(tabId: string | null) {
-    if (tabId == null) {
+    if (tabId === null) {
       this._activeTabId = null;
       return;
     }
diff --git a/webapp/packages/core-app/src/shared/ToolsPanel/LogViewTab/LogViewerService.ts b/webapp/packages/core-app/src/shared/ToolsPanel/LogViewTab/LogViewerService.ts
index 26b7bf091d..f27f90e023 100644
--- a/webapp/packages/core-app/src/shared/ToolsPanel/LogViewTab/LogViewerService.ts
+++ b/webapp/packages/core-app/src/shared/ToolsPanel/LogViewTab/LogViewerService.ts
@@ -22,7 +22,7 @@ export class LogViewerService {
 
   @observable _isActive = false;
 
-  get isActive() {
+  get isActive(): boolean {
     return this._isActive;
   }
 
@@ -40,7 +40,7 @@ export class LogViewerService {
     this.permissionsService.onUpdate.subscribe(this.stopIfHasNoPermission.bind(this));
   }
 
-  toggle() {
+  toggle(): void {
     if (this._isActive) {
       this.stopLog();
     } else {
@@ -48,11 +48,11 @@ export class LogViewerService {
     }
   }
 
-  getLog() {
+  getLog(): ILogEntry[] {
     return this.log;
   }
 
-  async startLog() {
+  async startLog(): Promise<void> {
     if (this._isActive) {
       return;
     }
@@ -68,7 +68,7 @@ export class LogViewerService {
     }, refreshInterval);
   }
 
-  stopLog() {
+  stopLog(): void {
     if (this.interval) {
       clearInterval(this.interval);
       this.interval = null;
@@ -77,7 +77,7 @@ export class LogViewerService {
   }
 
   @action
-  clearLog() {
+  clearLog(): void {
     this.log = [];
   }
 
diff --git a/webapp/packages/core-app/src/shared/useChildren.ts b/webapp/packages/core-app/src/shared/useChildren.ts
index 2270222b1f..a621467244 100644
--- a/webapp/packages/core-app/src/shared/useChildren.ts
+++ b/webapp/packages/core-app/src/shared/useChildren.ts
@@ -11,7 +11,14 @@ import { useService } from '@cloudbeaver/core-di';
 import { ROOT_NODE_PATH } from './NodesManager/NavNodeInfoResource';
 import { NavTreeResource } from './NodesManager/NavTreeResource';
 
-export function useChildren(navNodeId = ROOT_NODE_PATH) {
+type Hook = {
+  children: string[] | undefined;
+  isLoaded: boolean;
+  isLoading: boolean;
+  isOutdated: boolean;
+}
+
+export function useChildren(navNodeId = ROOT_NODE_PATH): Hook {
   const navTreeResource = useService(NavTreeResource);
   const children = navTreeResource.get(navNodeId);
   const isLoading = navTreeResource.isDataLoading(navNodeId);
diff --git a/webapp/packages/core-blocks/src/ObjectPropertyInfoForm/ObjectPropertyInfoForm.tsx b/webapp/packages/core-blocks/src/ObjectPropertyInfoForm/ObjectPropertyInfoForm.tsx
index b2ae61f5a2..ebad77d35d 100644
--- a/webapp/packages/core-blocks/src/ObjectPropertyInfoForm/ObjectPropertyInfoForm.tsx
+++ b/webapp/packages/core-blocks/src/ObjectPropertyInfoForm/ObjectPropertyInfoForm.tsx
@@ -36,22 +36,22 @@ export const ObjectPropertyInfoForm = observer(function ObjectPropertyInfoForm({
 }: Props) {
   const style = useStyles(formStyles);
 
-  if (!properties || properties.length === 0) {
-    return <TextPlaceholder>Properties empty</TextPlaceholder>;
-  }
-
   const handleFocus = useCallback((e: React.FocusEvent<HTMLInputElement>) => {
     if (e.target.type !== 'password') {
       return;
     }
 
-    const property = properties.find(property => property.id === e.target.name);
+    const property = properties?.find(property => property.id === e.target.name);
 
     if (property?.value === e.target.value) {
       credentials[e.target.name] = '';
     }
   }, [properties, credentials]);
 
+  if (!properties || properties.length === 0) {
+    return <TextPlaceholder>Properties empty</TextPlaceholder>;
+  }
+
   return styled(style)(
     <form-body as='div' className={className}>
       {properties.map(property => (
diff --git a/webapp/packages/core-blocks/src/Table/TableItem.tsx b/webapp/packages/core-blocks/src/Table/TableItem.tsx
index 10acd99286..eaf9be5816 100644
--- a/webapp/packages/core-blocks/src/Table/TableItem.tsx
+++ b/webapp/packages/core-blocks/src/Table/TableItem.tsx
@@ -42,7 +42,7 @@ export const TableItem = observer(function TableItem({
   const styles = useStyles();
   const context = useContext(TableContext);
   if (!context) {
-    return null;
+    throw new Error('TableContext must be provided');
   }
 
   const itemContext = useMemo<ITableItemContext>(() => ({
diff --git a/webapp/packages/core-blocks/src/Table/TableItemExpand.tsx b/webapp/packages/core-blocks/src/Table/TableItemExpand.tsx
index d058e56b68..91fdf17b18 100644
--- a/webapp/packages/core-blocks/src/Table/TableItemExpand.tsx
+++ b/webapp/packages/core-blocks/src/Table/TableItemExpand.tsx
@@ -31,7 +31,7 @@ export const TableItemExpand = observer(function TableItemExpand({
   const context = useContext(TableItemContext);
   const styles = useStyles();
   if (!context) {
-    return null;
+    throw new Error('TableContext must be provided');
   }
   const handleClick = useCallback((event: React.MouseEvent<HTMLInputElement, MouseEvent>) => {
     event.stopPropagation();
diff --git a/webapp/packages/core-blocks/src/TextPlaceholder.tsx b/webapp/packages/core-blocks/src/TextPlaceholder.tsx
index a16bc45f00..89fe4cdd56 100644
--- a/webapp/packages/core-blocks/src/TextPlaceholder.tsx
+++ b/webapp/packages/core-blocks/src/TextPlaceholder.tsx
@@ -32,7 +32,7 @@ const TextPlaceholderStyles = composes(
   `
 );
 
-export function TextPlaceholder(props: React.PropsWithChildren<unknown>) {
+export const TextPlaceholder: React.FC = function TextPlaceholder(props) {
   return styled(useStyles(TextPlaceholderStyles))(
     <div>
       <span>
diff --git a/webapp/packages/core-blocks/src/layout/AppLogo.tsx b/webapp/packages/core-blocks/src/layout/AppLogo.tsx
index 4b074003e5..316c217658 100644
--- a/webapp/packages/core-blocks/src/layout/AppLogo.tsx
+++ b/webapp/packages/core-blocks/src/layout/AppLogo.tsx
@@ -32,7 +32,7 @@ type Props = {
   onClick?: () => void;
 }
 
-export function AppLogo({ title, onClick }: Props) {
+export const AppLogo: React.FC<Props> = function AppLogo({ title, onClick }) {
   return styled(styles)(
     <logo as="div" title={title} onClick={onClick}>
       <Icon name="logo" viewBox="0 0 361 73" />
diff --git a/webapp/packages/core-blocks/src/layout/TopAppBar.tsx b/webapp/packages/core-blocks/src/layout/TopAppBar.tsx
index e42b593117..5bc50060da 100644
--- a/webapp/packages/core-blocks/src/layout/TopAppBar.tsx
+++ b/webapp/packages/core-blocks/src/layout/TopAppBar.tsx
@@ -28,7 +28,7 @@ export const topAppBarStyles = composes(
   `
 );
 
-export function TopAppBar({ children }: React.PropsWithChildren<{}>) {
+export const TopAppBar: React.FC = function TopAppBar({ children }) {
   return styled(useStyles(topAppBarStyles))(
     <header>
       {children}
diff --git a/webapp/packages/core-blocks/src/useFocus.ts b/webapp/packages/core-blocks/src/useFocus.ts
index 47b0beaba1..8a53a98cbb 100644
--- a/webapp/packages/core-blocks/src/useFocus.ts
+++ b/webapp/packages/core-blocks/src/useFocus.ts
@@ -27,13 +27,13 @@ export function useFocus<T extends HTMLElement>({
   useLayoutEffect(() => {
     if (reference.current !== null && focusFirstChild) {
       const firstFocusable = reference.current
-        .querySelector<T>('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
+        .querySelector<T>('button, [href], input, select, textarea, [tabndex]:not([tabndex="-1"])');
 
       if (firstFocusable) {
         firstFocusable.focus();
       }
     }
-  }, [reference.current, focusFirstChild]);
+  }, [focusFirstChild]);
 
   useEffect(() => {
     if (!reference.current) {
@@ -56,14 +56,16 @@ export function useFocus<T extends HTMLElement>({
       setFocus(false);
     };
 
-    reference.current.addEventListener('focusin', focusHandler);
-    reference.current.addEventListener('focusout', blurHandler);
+    const element = reference.current;
+
+    element.addEventListener('focusin', focusHandler);
+    element.addEventListener('focusout', blurHandler);
 
     return () => {
-      reference.current?.removeEventListener('focusin', focusHandler);
-      reference.current?.removeEventListener('focusout', blurHandler);
+      element.removeEventListener('focusin', focusHandler);
+      element.removeEventListener('focusout', blurHandler);
     };
-  }, [reference.current, onFocus, onBlur]);
+  }, [onFocus, onBlur]);
 
   return [reference, focus];
 }
diff --git a/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionAccess/ConnectionAccess.tsx b/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionAccess/ConnectionAccess.tsx
index 4663e68312..514ad3a769 100644
--- a/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionAccess/ConnectionAccess.tsx
+++ b/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionAccess/ConnectionAccess.tsx
@@ -49,10 +49,6 @@ export const ConnectionAccess = observer(function ConnectionAccess({
   onChange,
   className,
 }: Props) {
-  if (!model.grantedSubjects) {
-    return null;
-  }
-
   const style = useStyles(styles);
   const controller = useController(Controller, model);
   const translate = useTranslate();
@@ -64,6 +60,10 @@ export const ConnectionAccess = observer(function ConnectionAccess({
     }
   }, [onChange, controller]);
 
+  if (!model.grantedSubjects) {
+    return null;
+  }
+
   if (controller.users.length === 0 && controller.roles.length) {
     return <TextPlaceholder>{translate('authentication_administration_user_connections_empty')}</TextPlaceholder>;
   }
diff --git a/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionAccess/Controller.ts b/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionAccess/Controller.ts
index 9129b0816c..25d2fe0101 100644
--- a/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionAccess/Controller.ts
+++ b/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionAccess/Controller.ts
@@ -60,7 +60,7 @@ implements IInitializableController {
     await this.usersResource.loadAll();
     await this.rolesResource.loadAll();
 
-    for (const subject of this.model.grantedSubjects!) {
+    for (const subject of this.model.grantedSubjects || []) {
       this.selectedSubjects.set(subject.subjectId, true);
     }
   }
diff --git a/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionForm.tsx b/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionForm.tsx
index b95516a944..9e042d3122 100644
--- a/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionForm.tsx
+++ b/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/ConnectionForm.tsx
@@ -203,6 +203,8 @@ export const ConnectionForm = observer(function ConnectionForm({
                   {(state) => {
                     if (state.selectedId === 'access') {
                       controller.loadAccessSubjects();
+                    } else {
+                      return null;
                     }
 
                     return (
diff --git a/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/Options/OptionsController.ts b/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/Options/OptionsController.ts
index b881a10f0f..bd430cb084 100644
--- a/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/Options/OptionsController.ts
+++ b/webapp/packages/core-connections/src/Administration/Connections/ConnectionForm/Options/OptionsController.ts
@@ -122,9 +122,9 @@ implements IInitializableController {
     const databaseNames = ['New', ...this.drivers.map(driver => driver.name!)]
       .filter(Boolean);
 
-    if (this.model.connection.name === undefined
-        || (this.nameTemplate.test(this.model.connection.name)
-            && databaseNames.some(driver => this.model.connection.name.startsWith(driver)))
+    if (this.model.connection.name === undefined ||
+        (this.nameTemplate.test(this.model.connection.name) &&
+            databaseNames.some(driver => this.model.connection.name.startsWith(driver)))
     ) {
       this.model.connection.name = this.getNameTemplate();
     }
diff --git a/webapp/packages/core-connections/src/Administration/Connections/ConnectionsTable/ConnectionEdit.tsx b/webapp/packages/core-connections/src/Administration/Connections/ConnectionsTable/ConnectionEdit.tsx
index 7c7fea0a42..30b2463063 100644
--- a/webapp/packages/core-connections/src/Administration/Connections/ConnectionsTable/ConnectionEdit.tsx
+++ b/webapp/packages/core-connections/src/Administration/Connections/ConnectionsTable/ConnectionEdit.tsx
@@ -44,7 +44,7 @@ export const ConnectionEdit = observer(function ConnectionEdit({
   item,
 }: Props) {
   const tableContext = useContext(TableContext);
-  const collapse = useCallback(() => tableContext?.setItemExpand(item, false), [tableContext]);
+  const collapse = useCallback(() => tableContext?.setItemExpand(item, false), [tableContext, item]);
   const controller = useController(ConnectionEditController, item);
 
   return styled(useStyles(styles))(
diff --git a/webapp/packages/core-connections/src/Administration/Connections/CreateConnection/CreateConnection.tsx b/webapp/packages/core-connections/src/Administration/Connections/CreateConnection/CreateConnection.tsx
index f0e43c79bb..5dc9eb46e5 100644
--- a/webapp/packages/core-connections/src/Administration/Connections/CreateConnection/CreateConnection.tsx
+++ b/webapp/packages/core-connections/src/Administration/Connections/CreateConnection/CreateConnection.tsx
@@ -160,7 +160,7 @@ export const CreateConnection = observer(function CreateConnection({
     if (configurationWizard) {
       controller.search();
     }
-  }, [configurationWizard]);
+  }, [configurationWizard, controller]);
 
   const handleConnectionCancel = useCallback(() => {
     if (method === 'driver') {
diff --git a/webapp/packages/core-dialogs/src/CommonDialog/DialogsPortal.tsx b/webapp/packages/core-dialogs/src/CommonDialog/DialogsPortal.tsx
index 9200394312..95176e9f8c 100644
--- a/webapp/packages/core-dialogs/src/CommonDialog/DialogsPortal.tsx
+++ b/webapp/packages/core-dialogs/src/CommonDialog/DialogsPortal.tsx
@@ -64,9 +64,9 @@ function NestedDialog({
   const dialogState = useDialogState({ visible });
   const styles = useStyles(dialogStyles);
 
-  if (!dialogState.visible
-    && dialogState.visible !== lastVisibility.current
-    && !dialog.options?.persistent
+  if (!dialogState.visible &&
+    dialogState.visible !== lastVisibility.current &&
+    !dialog.options?.persistent
   ) {
     rejectDialog(dialog);
   } else {
diff --git a/webapp/packages/core-dialogs/src/Menu/MenuPanel/MenuTrigger.tsx b/webapp/packages/core-dialogs/src/Menu/MenuPanel/MenuTrigger.tsx
index c4f9d23d71..372a112c32 100644
--- a/webapp/packages/core-dialogs/src/Menu/MenuPanel/MenuTrigger.tsx
+++ b/webapp/packages/core-dialogs/src/Menu/MenuPanel/MenuTrigger.tsx
@@ -27,14 +27,14 @@ import { menuPanelStyles } from './menuPanelStyles';
 /**
  * MenuTrigger
  */
-export function MenuTrigger({
+export const MenuTrigger: React.FC<MenuTriggerProps> = function MenuTrigger({
   panel,
   children,
   style = [],
   placement,
   modal,
   ...props
-}: MenuTriggerProps) {
+}) {
   const menu = useMenuState({ modal, placement });
 
   return styled(useStyles(menuPanelStyles, ...style))(
@@ -95,7 +95,7 @@ const MenuPanelElement = observer(function MenuPanelElement({
     if (!item.panel) {
       menu.hide();
     }
-  }, [item]);
+  }, [item, menu]);
 
   if (item.panel) {
     return styled(styles)(
diff --git a/webapp/packages/core-events/src/INotification.ts b/webapp/packages/core-events/src/INotification.ts
index 74a163bd43..4e7dce4d11 100644
--- a/webapp/packages/core-events/src/INotification.ts
+++ b/webapp/packages/core-events/src/INotification.ts
@@ -29,9 +29,7 @@ export type NotificationComponent<
   TProps extends INotificationExtraProps<any> = INotificationExtraProps,
 > = React.FunctionComponent<NotificationComponentProps<TProps>>
 
-export interface INotification<
-  TProps extends INotificationExtraProps<any> = INotificationExtraProps
-> {
+export interface INotification<TProps extends INotificationExtraProps<any> = INotificationExtraProps> {
   readonly id: number;
   type: ENotificationType;
   title: string;
@@ -45,8 +43,7 @@ export interface INotification<
   showDetails: () => void;
 }
 
-export interface INotificationOptions<
-  TProps extends INotificationExtraProps<any> = INotificationExtraProps> {
+export interface INotificationOptions<TProps extends INotificationExtraProps<any> = INotificationExtraProps> {
   title: string;
   message?: string;
   details?: string | Error;
diff --git a/webapp/packages/core-events/src/NotificationService.ts b/webapp/packages/core-events/src/NotificationService.ts
index 57635de202..be7b2edcbb 100644
--- a/webapp/packages/core-events/src/NotificationService.ts
+++ b/webapp/packages/core-events/src/NotificationService.ts
@@ -18,16 +18,20 @@ import {
 @injectable()
 export class NotificationService {
   // todo change to common new Map()
-  readonly notificationList = new OrderedMap<number, INotification<INotificationExtraProps<any>>>(({ id }) => id);
+  readonly notificationList = new OrderedMap<number, INotification<any>>(({ id }) => id);
   private notificationNextId = 0
 
+  get visibleNotifications(): INotification<any>[] {
+    return this.notificationList.values.filter(notification=> !notification.isSilent)
+  }
+
   constructor(
     private settings: EventsSettingsService,
   ) {}
 
   notify<TProps extends INotificationExtraProps<any> = INotificationExtraProps>(
-    options: INotificationOptions<TSource, TProps>, type: ENotificationType
-  ) {
+    options: INotificationOptions<TProps>, type: ENotificationType
+  ): void {
     if (options.persistent) {
       const persistentNotifications = this.notificationList.values.filter(value => value.persistent);
       if (persistentNotifications.length >= this.settings.settings.getValue('maxPersistentAllow')) {
@@ -70,7 +74,7 @@ export class NotificationService {
     component: () => NotificationComponent<TProps>,
     props?: TProps,
     options?: INotificationOptions<TProps> & { type?: ENotificationType; }
-  ) {
+  ): void {
     this.notify({
       title: '',
       ...options,
@@ -79,15 +83,15 @@ export class NotificationService {
     }, options?.type ?? ENotificationType.Custom);
   }
 
-  logInfo<T>(notification: INotificationOptions<T>) {
+  logInfo<T>(notification: INotificationOptions<T>): void {
     this.notify(notification, ENotificationType.Info);
   }
 
-  logError<T>(notification: INotificationOptions<T>) {
+  logError<T>(notification: INotificationOptions<T>): void {
     this.notify(notification, ENotificationType.Error);
   }
 
-  logException(exception: Error | GQLError, message?: string, silent?: boolean) {
+  logException(exception: Error | GQLError, message?: string, silent?: boolean): void {
     const exceptionMessage = hasDetails(exception) ? exception.errorText : exception.message || exception.name;
     if (!silent) {
       this.logError({
@@ -100,7 +104,7 @@ export class NotificationService {
     console.error(exception);
   }
 
-  close(id: number) {
+  close(id: number): void {
     // TODO: emit event or something
 
     this.notificationList.remove(id);
diff --git a/webapp/packages/core-extensions/src/createExtension.ts b/webapp/packages/core-extensions/src/createExtension.ts
index 2b3c21ce5c..ca21b9c415 100644
--- a/webapp/packages/core-extensions/src/createExtension.ts
+++ b/webapp/packages/core-extensions/src/createExtension.ts
@@ -10,20 +10,20 @@ import { EXTENSION_SYMBOL } from './constants';
 import { IExtension } from './IExtension';
 
 export function createExtension<T>(
-  extension: object,
+  extension: Record<string, any>,
   key: symbol
 ): IExtension<T> {
   return Object.assign(extension, { [EXTENSION_SYMBOL]: key });
 }
 
 export function isExtension<T>(
-  obj: any,
+  obj: Record<any, any> | IExtension<T>,
   key?: symbol,
 ): obj is IExtension<T> {
   if (!(EXTENSION_SYMBOL in obj)) {
     return false;
   }
-  if (key && obj[EXTENSION_SYMBOL] !== key) {
+  if (key && (obj as IExtension<T>)[EXTENSION_SYMBOL] !== key) {
     return false;
   }
   return true;
diff --git a/webapp/packages/core-localization/src/Translate.tsx b/webapp/packages/core-localization/src/Translate.tsx
index d532cd3f28..d68bee27c9 100644
--- a/webapp/packages/core-localization/src/Translate.tsx
+++ b/webapp/packages/core-localization/src/Translate.tsx
@@ -1,12 +1,22 @@
+/*
+ * cloudbeaver - Cloud Database Manager
+ * Copyright (C) 2020 DBeaver Corp and others
+ *
+ * Licensed under the Apache License, Version 2.0.
+ * you may not use this file except in compliance with the License.
+ */
+
+import { observer } from 'mobx-react';
+
 import { TLocalizationToken } from './TLocalizationToken';
 import { useTranslate } from './useTranslate';
 
-type TranslateProps = {
+type Props = {
   token: TLocalizationToken;
 }
 
-export function Translate({ token }: TranslateProps) {
-  const value = useTranslate(token);
+export const Translate: React.FC<Props> = observer(function Translate({ token }) {
+  const translate = useTranslate();
 
-  return <>{value}</>;
-}
+  return <>{translate(token)}</>;
+});
diff --git a/webapp/packages/core-localization/src/useTranslate.ts b/webapp/packages/core-localization/src/useTranslate.ts
index 1b5bcf11d5..a16000c0fe 100644
--- a/webapp/packages/core-localization/src/useTranslate.ts
+++ b/webapp/packages/core-localization/src/useTranslate.ts
@@ -6,21 +6,13 @@
  * you may not use this file except in compliance with the License.
  */
 
-import { useObserver } from 'mobx-react';
-
 import { useService } from '@cloudbeaver/core-di';
 
 import { LocalizationService } from './LocalizationService';
 import { TLocalizationToken } from './TLocalizationToken';
 
-export function useTranslate(): (token: TLocalizationToken) => string;
-export function useTranslate(token: TLocalizationToken): string;
-export function useTranslate(token?: TLocalizationToken): string | ((token: TLocalizationToken) => string) {
+export function useTranslate(): ((token: TLocalizationToken) => string) {
   const localizationService = useService(LocalizationService);
 
-  if (!token) {
-    return localizationService.translate;
-  }
-
-  return useObserver(() => localizationService.translate(token));
+  return localizationService.translate;
 }
diff --git a/webapp/packages/core-notifications/src/Notifications.tsx b/webapp/packages/core-notifications/src/Notifications.tsx
index f1bb918688..bfea0e3ee0 100644
--- a/webapp/packages/core-notifications/src/Notifications.tsx
+++ b/webapp/packages/core-notifications/src/Notifications.tsx
@@ -32,7 +32,7 @@ export const Notifications = observer(function Notifications() {
   return styled(useStyles(styles))(
     <Portal>
       <notifications as="div">
-        {notificationService.notificationList.values.map(notification => (
+        {notificationService.visibleNotifications.map(notification => (
           <NotificationsItem key={notification.id} notification={notification} />
         ))}
       </notifications>
diff --git a/webapp/packages/core-notifications/src/NotificationsItem/ErrorDetailsDialog/ErrorDetailsDialog.tsx b/webapp/packages/core-notifications/src/NotificationsItem/ErrorDetailsDialog/ErrorDetailsDialog.tsx
index 354785b159..fcaec8def7 100644
--- a/webapp/packages/core-notifications/src/NotificationsItem/ErrorDetailsDialog/ErrorDetailsDialog.tsx
+++ b/webapp/packages/core-notifications/src/NotificationsItem/ErrorDetailsDialog/ErrorDetailsDialog.tsx
@@ -44,7 +44,7 @@ export const ErrorDetailsDialog: DialogComponent<Error | string, null> = observe
       [props.payload]
     );
 
-    const title = useTranslate('core_eventsLog_dbeaverErrorDetails');
+    const translate = useTranslate();
 
     const [copy] = useClipboard();
     const copyHandler = useCallback(
@@ -54,7 +54,7 @@ export const ErrorDetailsDialog: DialogComponent<Error | string, null> = observe
 
     return styled(useStyles(styles))(
       <CommonDialogWrapper
-        title={title}
+        title={translate('core_eventsLog_dbeaverErrorDetails')}
         footer={(
           <controls as="div">
             <Button type="button" mod={['unelevated']} onClick={props.rejectDialog}>Close</Button>
@@ -66,12 +66,12 @@ export const ErrorDetailsDialog: DialogComponent<Error | string, null> = observe
         onReject={props.rejectDialog}
       >
         {error.reason && <property as="div">{error.reason}</property>}
-        {error.htmlBody && (<SanitizedHTML html={error.htmlBody}/>)}
+        {error.htmlBody && (<SanitizedHTML html={error.htmlBody} />)}
         {error.errors.map(
           (error, id) => (
             <>
-              {id > 0 && <hr/>}
-              <DisplayErrorInfo key={id} error={error}/>
+              {id > 0 && <hr />}
+              <DisplayErrorInfo key={id} error={error} />
             </>
           )
         )}
diff --git a/webapp/packages/core-notifications/src/NotificationsItem/NotificationsItem.tsx b/webapp/packages/core-notifications/src/NotificationsItem/NotificationsItem.tsx
index 7d37bf6bcc..63c70c28f9 100644
--- a/webapp/packages/core-notifications/src/NotificationsItem/NotificationsItem.tsx
+++ b/webapp/packages/core-notifications/src/NotificationsItem/NotificationsItem.tsx
@@ -14,14 +14,11 @@ import { INotification } from '@cloudbeaver/core-events';
 import { NotificationItemController } from './NotificationItemController';
 import { Snackbar } from './Snackbar/Snackbar';
 
-type NotificationProps = {
+type Props = {
   notification: INotification<any>;
 }
 
-export const NotificationsItem = observer(function Notification({ notification }: NotificationProps) {
-  if (notification.isSilent) {
-    return null;
-  }
+export const NotificationsItem = observer(function Notification({ notification }: Props) {
   const controller = useController(NotificationItemController, notification);
 
   if (notification.customComponent) {
diff --git a/webapp/packages/core-settings/src/LocalStorageSaveService.ts b/webapp/packages/core-settings/src/LocalStorageSaveService.ts
index 54a55a04a2..26b3c859a0 100644
--- a/webapp/packages/core-settings/src/LocalStorageSaveService.ts
+++ b/webapp/packages/core-settings/src/LocalStorageSaveService.ts
@@ -18,7 +18,7 @@ let id = 0;
 
 @injectable()
 export class LocalStorageSaveService {
-  withAutoSave(store: object, name?: string, remap?: (savedStore: object) => object): void {
+  withAutoSave<T>(store: T, name?: string, remap?: (savedStore: any) => any): void {
     let firstRun = true;
     const storeId = name || ++id;
 
diff --git a/webapp/packages/core-settings/src/SettingsService.ts b/webapp/packages/core-settings/src/SettingsService.ts
index b0117a14af..dc989785eb 100644
--- a/webapp/packages/core-settings/src/SettingsService.ts
+++ b/webapp/packages/core-settings/src/SettingsService.ts
@@ -20,7 +20,7 @@ export class SettingsService {
    * @param key
    * @param settings - observable object expected
    */
-  registerSettings<T extends object>(settings: T, key: string): void {
+  registerSettings<T extends Record<any, unknown>>(settings: T, key: string): void {
     this.localStorageSaveService.withAutoSave(settings, key);
   }
 }
diff --git a/webapp/packages/core-theming/src/useStyles.ts b/webapp/packages/core-theming/src/useStyles.ts
index 15f4e6aacc..068f673dc1 100644
--- a/webapp/packages/core-theming/src/useStyles.ts
+++ b/webapp/packages/core-theming/src/useStyles.ts
@@ -29,9 +29,6 @@ export type DynamicStyle = Style | boolean | undefined;
 export function useStyles(
   ...componentStyles: (DynamicStyle | DynamicStyle[])[]
 ): Record<string, any> {
-  if (!componentStyles) {
-    return {};
-  }
   // todo do you understand that we store ALL STYLES in each component that uses this hook?
 
   const stylesRef = useRef<(DynamicStyle | DynamicStyle[])[]>([]);
diff --git a/webapp/packages/plugin-authentication/src/Administration/Users/CreateUser.tsx b/webapp/packages/plugin-authentication/src/Administration/Users/CreateUser.tsx
index 9b00d72650..87fbba3938 100644
--- a/webapp/packages/plugin-authentication/src/Administration/Users/CreateUser.tsx
+++ b/webapp/packages/plugin-authentication/src/Administration/Users/CreateUser.tsx
@@ -46,7 +46,7 @@ export function CreateUser({
 
   return styled(useStyles(styles))(
     <user-create as='div'>
-      <title-bar as='div'><Translate token='authentication_administration_user_connections_user_add'/></title-bar>
+      <title-bar as='div'><Translate token='authentication_administration_user_connections_user_add' /></title-bar>
       <UserForm user={user} onCancel={onCancel} />
     </user-create>
   );
diff --git a/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/GrantedConnections.tsx b/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/GrantedConnections.tsx
index 2efbca4685..95a9823841 100644
--- a/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/GrantedConnections.tsx
+++ b/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/GrantedConnections.tsx
@@ -69,13 +69,13 @@ export const GrantedConnections = observer(function GrantedConnections({
 
   return styled(style)(
     <box as='div'>
-      <Table selectedItems={selectedConnection} onSelect={onChange} className={className}>
+      <Table selectedItems={selectedConnection} className={className} onSelect={onChange}>
         <TableHeader>
-          <TableColumnHeader min/>
-          <TableColumnHeader min/>
+          <TableColumnHeader min />
+          <TableColumnHeader min />
           <TableColumnHeader>{translate('connections_connection_name')}</TableColumnHeader>
           <TableColumnHeader>{translate('authentication_administration_user_connections_access_granted_by')}</TableColumnHeader>
-          <TableColumnHeader></TableColumnHeader>
+          <TableColumnHeader />
         </TableHeader>
         <TableBody>
           {connections.map((connection) => {
@@ -86,7 +86,7 @@ export const GrantedConnections = observer(function GrantedConnections({
             return (
               <TableItem key={connection.id} item={connection.id} selectDisabled={disabled || isRoleProvided}>
                 <TableColumnValue centerContent flex>
-                  <TableItemSelect disabled={disabled || isRoleProvided} checked={disabled || isRoleProvided}/>
+                  <TableItemSelect disabled={disabled || isRoleProvided} checked={disabled || isRoleProvided} />
                 </TableColumnValue>
                 <TableColumnValue><StaticImage icon={driver?.icon} /></TableColumnValue>
                 <TableColumnValue>{connection.name}</TableColumnValue>
@@ -95,7 +95,7 @@ export const GrantedConnections = observer(function GrantedConnections({
                     ? `${translate('authentication_administration_user_connections_access_granted_role')} ${connectionPermission?.subjectId}`
                     : translate('authentication_administration_user_connections_access_granted_directly'))}
                 </TableColumnValue>
-                <TableColumnValue></TableColumnValue>
+                <TableColumnValue />
               </TableItem>
             );
           })}
diff --git a/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/UserForm.tsx b/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/UserForm.tsx
index 210f58da14..bd919f2512 100644
--- a/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/UserForm.tsx
+++ b/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/UserForm.tsx
@@ -160,10 +160,10 @@ export const UserForm = observer(function UserForm({
     <TabsState selectedId='info'>
       <box as='div'>
         <TabList>
-          <Tab tabId='info' >
+          <Tab tabId='info'>
             <TabTitle>{translate('authentication_administration_user_info')}</TabTitle>
           </Tab>
-          <Tab tabId='connections_access' onOpen={controller.loadConnectionsAccess} >
+          <Tab tabId='connections_access' onOpen={controller.loadConnectionsAccess}>
             <TabTitle>{translate('authentication_administration_user_connections_access')}</TabTitle>
           </Tab>
           <fill as="div" />
@@ -185,7 +185,7 @@ export const UserForm = observer(function UserForm({
           </Button>
         </TabList>
         <content-box as='div'>
-          <SubmittingForm onSubmit={controller.save} ref={focusedRef}>
+          <SubmittingForm ref={focusedRef} onSubmit={controller.save}>
             <TabPanel tabId='info'>
               <flex-box as="div">
                 <flex-box-element as='div'>
@@ -197,10 +197,10 @@ export const UserForm = observer(function UserForm({
                       type='text'
                       name='login'
                       value={controller.credentials.login}
-                      onChange={handleLoginChange}
                       disabled={editing || controller.isSaving}
                       mod='surface'
                       required
+                      onChange={handleLoginChange}
                     >
                       {translate('authentication_user_name')}
                     </InputField>
@@ -211,10 +211,10 @@ export const UserForm = observer(function UserForm({
                       name='password'
                       autoComplete='new-password'
                       value={controller.credentials.password}
-                      onChange={handlePasswordChange}
                       disabled={controller.isSaving}
                       mod='surface'
                       required
+                      onChange={handlePasswordChange}
                     >
                       {translate('authentication_user_password')}
                     </InputField>
@@ -224,10 +224,10 @@ export const UserForm = observer(function UserForm({
                       type='password'
                       name='password_repeat'
                       value={controller.credentials.passwordRepeat}
-                      onChange={handlePasswordRepeatChange}
                       disabled={controller.isSaving}
                       mod='surface'
                       required
+                      onChange={handlePasswordRepeatChange}
                     >
                       {translate('authentication_user_password_repeat')}
                     </InputField>
@@ -238,22 +238,22 @@ export const UserForm = observer(function UserForm({
                     <InputGroup>{translate('authentication_user_role')}</InputGroup>
                   </group>
                   {controller.roles.map((role, i) => (
-                    <group as="div" key={role.roleId}>
+                    <group key={role.roleId} as="div">
                       <Checkbox
                         value={role.roleId}
                         name='role'
                         checkboxLabel={role.roleName || role.roleId}
-                        onChange={checked => handleRoleChange(role.roleId, checked)}
                         checked={controller.credentials.roles.get(role.roleId)}
                         disabled={controller.isSaving}
                         mod='surface'
+                        onChange={checked => handleRoleChange(role.roleId, checked)}
                       />
                     </group>
                   ))}
                 </flex-box-element>
               </flex-box>
             </TabPanel>
-            {controller.isLoading && <Loader overlay/>}
+            {controller.isLoading && <Loader overlay />}
             <TabPanel tabId='connections_access'>
               <GrantedConnections
                 grantedConnections={controller.grantedConnections}
diff --git a/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/UserFormController.ts b/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/UserFormController.ts
index 6edbc7a5f9..637f593e50 100644
--- a/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/UserFormController.ts
+++ b/webapp/packages/plugin-authentication/src/Administration/Users/UserForm/UserFormController.ts
@@ -199,8 +199,8 @@ export class UserFormController implements IInitializableController, IDestructib
         const connectionPermission = this.grantedConnections.find(
           connectionPermission => connectionPermission.connectionId === connectionId
         );
-        return this.selectedConnections.get(connectionId)
-          && connectionPermission?.subjectType !== AdminSubjectType.Role;
+        return this.selectedConnections.get(connectionId) &&
+          connectionPermission?.subjectType !== AdminSubjectType.Role;
       });
   }
 
diff --git a/webapp/packages/plugin-authentication/src/Administration/Users/UsersAdministration.tsx b/webapp/packages/plugin-authentication/src/Administration/Users/UsersAdministration.tsx
index dcc7d55570..719d99f373 100644
--- a/webapp/packages/plugin-authentication/src/Administration/Users/UsersAdministration.tsx
+++ b/webapp/packages/plugin-authentication/src/Administration/Users/UsersAdministration.tsx
@@ -83,7 +83,7 @@ export const UsersAdministration = observer(function UsersAdministration({
             selectedItems={controller.selectedItems}
             expandedItems={controller.expandedItems}
           />
-          {controller.isLoading && <Loader overlay/>}
+          {controller.isLoading && <Loader overlay />}
         </layout-grid-cell>
       </layout-grid-inner>
     </layout-grid>
diff --git a/webapp/packages/plugin-authentication/src/Administration/Users/UsersDrawerItem.tsx b/webapp/packages/plugin-authentication/src/Administration/Users/UsersDrawerItem.tsx
index e1a1093715..ab5286dce7 100644
--- a/webapp/packages/plugin-authentication/src/Administration/Users/UsersDrawerItem.tsx
+++ b/webapp/packages/plugin-authentication/src/Administration/Users/UsersDrawerItem.tsx
@@ -17,7 +17,7 @@ export function UsersDrawerItem({ item, onSelect, style }: AdministrationItemDra
   return styled(useStyles(...style))(
     <Tab tabId={item.name} onOpen={() => onSelect(item.name)}>
       <TabIcon icon='/icons/account.svg' />
-      <TabTitle><Translate token='authentication_administration_item'/></TabTitle>
+      <TabTitle><Translate token='authentication_administration_item' /></TabTitle>
     </Tab>
   );
 }
diff --git a/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/User.tsx b/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/User.tsx
index 2f0a814f10..6d411f4907 100644
--- a/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/User.tsx
+++ b/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/User.tsx
@@ -39,7 +39,7 @@ export const User = observer(function User({ user }: Props) {
       </TableColumnValue>
       <TableColumnValue expand>{user.userId}</TableColumnValue>
       <TableColumnValue>{user.grantedRoles.join(', ')}</TableColumnValue>
-      <TableColumnValue></TableColumnValue>
+      <TableColumnValue />
     </TableItem>
   );
 });
diff --git a/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/UserEdit.tsx b/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/UserEdit.tsx
index 3146c39f2c..be55fba19a 100644
--- a/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/UserEdit.tsx
+++ b/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/UserEdit.tsx
@@ -51,7 +51,7 @@ export const UserEdit = observer(function UserEdit({
   return styled(useStyles(styles))(
     <box as='div'>
       {controller.user && (
-        <UserForm user={controller.user} onCancel={collapse} editing/>
+        <UserForm user={controller.user} editing onCancel={collapse} />
       )}
     </box>
   );
diff --git a/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/UsersTable.tsx b/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/UsersTable.tsx
index 727e2b2972..8e7fdf5fa4 100644
--- a/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/UsersTable.tsx
+++ b/webapp/packages/plugin-authentication/src/Administration/Users/UsersTable/UsersTable.tsx
@@ -38,14 +38,14 @@ export const UsersTable = observer(function UsersTable({ users, selectedItems, e
   return styled(useStyles(styles))(
     <Table selectedItems={selectedItems} expandedItems={expandedItems} {...use({ size: 'big' })}>
       <TableHeader>
-        <TableColumnHeader min/>
-        <TableColumnHeader min/>
+        <TableColumnHeader min />
+        <TableColumnHeader min />
         <TableColumnHeader>{translate('authentication_user_name')}</TableColumnHeader>
         <TableColumnHeader>{translate('authentication_user_role')}</TableColumnHeader>
-        <TableColumnHeader></TableColumnHeader>
+        <TableColumnHeader />
       </TableHeader>
       <TableBody>
-        {users.map(user => <User key={user.userId} user={user}/>)}
+        {users.map(user => <User key={user.userId} user={user} />)}
       </TableBody>
     </Table>
   );
diff --git a/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.tsx b/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.tsx
index 3367bbaad1..068e94c323 100644
--- a/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.tsx
+++ b/webapp/packages/plugin-authentication/src/Dialog/AuthDialog.tsx
@@ -91,7 +91,6 @@ export const AuthDialog = observer(function AuthDialog({
     <TabsState currentTabId={controller.provider?.id || null}>
       <CommonDialogWrapper
         title={translate('authentication_login_dialog_title')}
-        noBodyPadding
         header={(
           <TabList aria-label='Auth providers'>
             {controller.providers.map(provider => (
@@ -111,6 +110,7 @@ export const AuthDialog = observer(function AuthDialog({
             onLogin={controller.login}
           />
         )}
+        noBodyPadding
         onReject={options?.persistent ? undefined : rejectDialog}
       >
         <SubmittingForm onSubmit={controller.login}>
diff --git a/webapp/packages/plugin-authentication/src/Dialog/AuthDialogFooter.tsx b/webapp/packages/plugin-authentication/src/Dialog/AuthDialogFooter.tsx
index aef6fd9392..7134181e01 100644
--- a/webapp/packages/plugin-authentication/src/Dialog/AuthDialogFooter.tsx
+++ b/webapp/packages/plugin-authentication/src/Dialog/AuthDialogFooter.tsx
@@ -40,8 +40,8 @@ export const AuthDialogFooter = observer(
         <Button
           type="button"
           mod={['unelevated']}
-          onClick={onLogin}
           disabled={isAuthenticating}
+          onClick={onLogin}
         >
           {translate('authentication_login')}
         </Button>
diff --git a/webapp/packages/plugin-authentication/src/Dialog/AuthProviderForm/AuthProviderForm.tsx b/webapp/packages/plugin-authentication/src/Dialog/AuthProviderForm/AuthProviderForm.tsx
index ac1ce255d2..ab3409622d 100644
--- a/webapp/packages/plugin-authentication/src/Dialog/AuthProviderForm/AuthProviderForm.tsx
+++ b/webapp/packages/plugin-authentication/src/Dialog/AuthProviderForm/AuthProviderForm.tsx
@@ -33,17 +33,17 @@ export const AuthProviderForm = observer(function AuthProviderForm({
   }, [credentials]);
 
   return styled(useStyles(formStyles))(
-    <login-form as='div' ref={elementRef}>
+    <login-form ref={elementRef} as='div'>
       {provider.credentialParameters.map(parameter => parameter.user && (
-        <group as="div" key={parameter.id}>
+        <group key={parameter.id} as="div">
           <InputField
             type={parameter.encryption === 'none' ? 'text' : 'password'}
             name={`authentication_${provider.id}_${parameter.id}`}
             value={credentials[parameter.id]}
-            onChange={value => handleChange(parameter.id, value)}
             disabled={authenticate}
             autoComplete={`section-authentication section-${provider.id} ${parameter.id}`}
             mod='surface'
+            onChange={value => handleChange(parameter.id, value)}
           >
             {parameter.displayName}
           </InputField>
diff --git a/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionForm/ConnectionForm.tsx b/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionForm/ConnectionForm.tsx
index e0c357ee96..f6bb4270d5 100644
--- a/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionForm/ConnectionForm.tsx
+++ b/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionForm/ConnectionForm.tsx
@@ -35,15 +35,15 @@ export const ConnectionForm = observer(function ConnectionForm({
 
   return styled(useStyles(formStyles))(
     <connection-form as='div'>
-      <connection-type as="div" ref={focusedRef}>
+      <connection-type ref={focusedRef} as="div">
         <Radio
           name="type"
           id="custom"
           value="custom"
-          onClick={() => controller.onChangeType(ConnectionType.Attributes)}
           checked={controller.connectionType === ConnectionType.Attributes}
           disabled={controller.isConnecting}
           mod={['primary']}
+          onClick={() => controller.onChangeType(ConnectionType.Attributes)}
         >
           {translate('customConnection_connectionType_custom')}
         </Radio>
@@ -51,10 +51,10 @@ export const ConnectionForm = observer(function ConnectionForm({
           name="type"
           id="url"
           value="url"
-          onClick={() => controller.onChangeType(ConnectionType.URL)}
           checked={controller.connectionType === ConnectionType.URL}
           disabled={controller.isConnecting}
           mod={['primary']}
+          onClick={() => controller.onChangeType(ConnectionType.URL)}
         >
           {translate('customConnection_connectionType_url')}
         </Radio>
@@ -67,9 +67,9 @@ export const ConnectionForm = observer(function ConnectionForm({
             type="text"
             name="url"
             value={controller.config.url}
-            onChange={value => controller.onChange('url', value)}
             disabled={controller.isConnecting}
             mod='surface'
+            onChange={value => controller.onChange('url', value)}
           >
             {translate('customConnection_url_JDBC')}
           </InputField>
diff --git a/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionForm/ParametersForm.tsx b/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionForm/ParametersForm.tsx
index 7dd6a72dca..8ed21d7dbf 100644
--- a/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionForm/ParametersForm.tsx
+++ b/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionForm/ParametersForm.tsx
@@ -29,15 +29,15 @@ export const ParametersForm = observer(function ParametersForm({
 
   return styled(useStyles(formStyles))(
     <>
-      { !embedded && (
+      {!embedded && (
         <group as="div">
           <InputField
             type="text"
             name="host"
             value={controller.config.host}
-            onChange={value => controller.onChange('host', value)}
             disabled={controller.isConnecting}
             mod='surface'
+            onChange={value => controller.onChange('host', value)}
           >
             {translate('customConnection_custom_host')}
             <sub-label as="div">{translate('customConnection_custom_obligatory')}</sub-label>
@@ -46,9 +46,9 @@ export const ParametersForm = observer(function ParametersForm({
             type="number"
             name="port"
             value={controller.config.port}
-            onChange={value => controller.onChange('port', value)}
             disabled={controller.isConnecting}
             mod='surface'
+            onChange={value => controller.onChange('port', value)}
           >
             {translate('customConnection_custom_port')}
           </InputField>
@@ -59,9 +59,9 @@ export const ParametersForm = observer(function ParametersForm({
           type="text"
           name="databaseName"
           value={controller.config.databaseName}
-          onChange={value => controller.onChange('databaseName', value)}
           disabled={controller.isConnecting}
           mod='surface'
+          onChange={value => controller.onChange('databaseName', value)}
         >
           {translate('customConnection_custom_database')}
         </InputField>
diff --git a/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionFormDialog.tsx b/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionFormDialog.tsx
index bd431ace6d..bbb6f089e1 100644
--- a/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionFormDialog.tsx
+++ b/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionFormDialog.tsx
@@ -95,13 +95,12 @@ export const ConnectionFormDialog = observer(function ConnectionFormDialog({
       <CommonDialogWrapper
         title={title}
         icon={driver?.icon}
-        noBodyPadding
         header={(
           <TabList>
-            <Tab tabId='options' >
+            <Tab tabId='options'>
               <TabTitle>{translate('customConnection_options')}</TabTitle>
             </Tab>
-            <Tab tabId='driver_properties' onOpen={() => setLoadProperties(true)} >
+            <Tab tabId='driver_properties' onOpen={() => setLoadProperties(true)}>
               <TabTitle>{translate('customConnection_properties')}</TabTitle>
             </Tab>
           </TabList>
@@ -114,6 +113,7 @@ export const ConnectionFormDialog = observer(function ConnectionFormDialog({
             onBack={onBack}
           />
         )}
+        noBodyPadding
         onReject={onClose}
       >
         {controller.isLoading
@@ -131,8 +131,7 @@ export const ConnectionFormDialog = observer(function ConnectionFormDialog({
                 />
               </TabPanel>
             </SubmittingForm>
-          )
-        }
+          )}
         {controller.error.responseMessage && (
           <ErrorMessage
             text={controller.error.responseMessage}
diff --git a/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionFormDialogFooter.tsx b/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionFormDialogFooter.tsx
index 16d20421c8..8ba8b06f87 100644
--- a/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionFormDialogFooter.tsx
+++ b/webapp/packages/plugin-connection-custom/src/CustomConnection/ConnectionFormDialog/ConnectionFormDialogFooter.tsx
@@ -51,25 +51,25 @@ export const ConnectionFormDialogFooter = observer(
         <Button
           type="button"
           mod={['outlined']}
-          onClick={onBack}
           disabled={isConnecting}
+          onClick={onBack}
         >
           {translate('ui_stepper_back')}
         </Button>
-        <fill as="div"/>
+        <fill as="div" />
         <Button
           type="button"
           mod={['outlined']}
-          onClick={onConnectionTest}
           disabled={isConnecting}
+          onClick={onConnectionTest}
         >
           {translate('customConnection_test')}
         </Button>
         <Button
           type="button"
           mod={['unelevated']}
-          onClick={onCreateConnection}
           disabled={isConnecting}
+          onClick={onCreateConnection}
         >
           {translate('customConnection_create')}
         </Button>
diff --git a/webapp/packages/plugin-connection-custom/src/CustomConnection/CustomConnectionDialog.tsx b/webapp/packages/plugin-connection-custom/src/CustomConnection/CustomConnectionDialog.tsx
index db6e9243ce..4fdf3da231 100644
--- a/webapp/packages/plugin-connection-custom/src/CustomConnection/CustomConnectionDialog.tsx
+++ b/webapp/packages/plugin-connection-custom/src/CustomConnection/CustomConnectionDialog.tsx
@@ -20,7 +20,8 @@ export const CustomConnectionDialog = observer(function CustomConnectionDialog({
   rejectDialog,
 }: DialogComponentProps<null, null>) {
   const controller = useController(CustomConnectionController);
-  let title = useTranslate('basicConnection_connectionDialog_newConnection');
+  const translate = useTranslate();
+  let title = translate('basicConnection_connectionDialog_newConnection');
 
   if (controller.step === ConnectionStep.Connection && controller.driver?.name) {
     title = controller.driver.name;
@@ -41,8 +42,8 @@ export const CustomConnectionDialog = observer(function CustomConnectionDialog({
     <DriverSelectorDialog
       title={title}
       drivers={controller.drivers}
-      onSelect={controller.onDriverSelect}
       isLoading={controller.isLoading}
+      onSelect={controller.onDriverSelect}
       onClose={rejectDialog}
     />
   );
diff --git a/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/Driver.tsx b/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/Driver.tsx
index 37a441fab7..52ef6a5cb2 100644
--- a/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/Driver.tsx
+++ b/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/Driver.tsx
@@ -39,7 +39,7 @@ export const Driver = observer(function Driver({ driver, onSelect }: DriverProps
 
   return styled(styles)(
     <ListItem onClick={select}>
-      <ListItemIcon><StaticImage icon={driver.icon}/></ListItemIcon>
+      <ListItemIcon><StaticImage icon={driver.icon} /></ListItemIcon>
       <ListItemName>{driver.name}</ListItemName>
       <ListItemDescription title={driver.description}>{driver.description}</ListItemDescription>
     </ListItem>
diff --git a/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/DriverSelector.tsx b/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/DriverSelector.tsx
index c611adceaf..42efd8906a 100644
--- a/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/DriverSelector.tsx
+++ b/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/DriverSelector.tsx
@@ -32,8 +32,8 @@ export const DriverSelector = observer(function DriverSelector({ drivers, classN
 
   return (
     <ItemList className={className}>
-      <ItemListSearch onChange={setSearch} placeholder={translate('connections_driver_search_placeholder')}/>
-      {filteredDrivers.map(driver => <Driver key={driver.id} driver={driver} onSelect={onSelect}/>)}
+      <ItemListSearch placeholder={translate('connections_driver_search_placeholder')} onChange={setSearch} />
+      {filteredDrivers.map(driver => <Driver key={driver.id} driver={driver} onSelect={onSelect} />)}
     </ItemList>
   );
 });
diff --git a/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/DriverSelectorDialog.tsx b/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/DriverSelectorDialog.tsx
index 7ab1da678f..a88d61a213 100644
--- a/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/DriverSelectorDialog.tsx
+++ b/webapp/packages/plugin-connection-custom/src/CustomConnection/DriverSelectorDialog/DriverSelectorDialog.tsx
@@ -49,7 +49,7 @@ export const DriverSelectorDialog = observer(
         onReject={onClose}
       >
         {isLoading && <Loader />}
-        {!isLoading && <DriverSelector drivers={drivers} onSelect={onSelect}/>}
+        {!isLoading && <DriverSelector drivers={drivers} onSelect={onSelect} />}
       </CommonDialogWrapper>
     );
   }
diff --git a/webapp/packages/plugin-connection-template/src/ConnectionDialog/ConnectionDialog.tsx b/webapp/packages/plugin-connection-template/src/ConnectionDialog/ConnectionDialog.tsx
index ca55b78b64..81bc75b8c6 100644
--- a/webapp/packages/plugin-connection-template/src/ConnectionDialog/ConnectionDialog.tsx
+++ b/webapp/packages/plugin-connection-template/src/ConnectionDialog/ConnectionDialog.tsx
@@ -81,7 +81,7 @@ export const ConnectionDialog = observer(function ConnectionDialog({
           {controller.isConnecting && translate('basicConnection_connectionDialog_connecting_message')}
         </center>
       ) : (
-        <SubmittingForm onSubmit={controller.onConnect} ref={focusedRef}>
+        <SubmittingForm ref={focusedRef} onSubmit={controller.onConnect}>
           <ObjectPropertyInfoForm
             autofillToken={`section-${controller.template?.id || ''} section-auth`}
             properties={controller.authModel.properties}
diff --git a/webapp/packages/plugin-connection-template/src/ConnectionDialog/ConnectionDialogFooter.tsx b/webapp/packages/plugin-connection-template/src/ConnectionDialog/ConnectionDialogFooter.tsx
index 231dc72844..0ec613f439 100644
--- a/webapp/packages/plugin-connection-template/src/ConnectionDialog/ConnectionDialogFooter.tsx
+++ b/webapp/packages/plugin-connection-template/src/ConnectionDialog/ConnectionDialogFooter.tsx
@@ -48,17 +48,17 @@ export const ConnectionDialogFooter = observer(
         <Button
           type="button"
           mod={['outlined']}
-          onClick={onBack}
           disabled={isConnecting}
+          onClick={onBack}
         >
           {translate('ui_stepper_back')}
         </Button>
-        <fill as="div"/>
+        <fill as="div" />
         <Button
           type="button"
           mod={['unelevated']}
-          onClick={onConnect}
           disabled={isConnecting}
+          onClick={onConnect}
         >
           {isConnecting
             ? translate('basicConnection_connectionDialog_connecting')
diff --git a/webapp/packages/plugin-connection-template/src/ConnectionDialog/TemplateConnectionSelector/TemplateConnectionItem.tsx b/webapp/packages/plugin-connection-template/src/ConnectionDialog/TemplateConnectionSelector/TemplateConnectionItem.tsx
index f60a9196a0..935fea2e46 100644
--- a/webapp/packages/plugin-connection-template/src/ConnectionDialog/TemplateConnectionSelector/TemplateConnectionItem.tsx
+++ b/webapp/packages/plugin-connection-template/src/ConnectionDialog/TemplateConnectionSelector/TemplateConnectionItem.tsx
@@ -38,7 +38,7 @@ export const TemplateConnectionItem = observer(function TemplateConnectionItem({
 
   return styled(styles)(
     <ListItem onClick={select}>
-      <ListItemIcon><StaticImage icon={dbDriver?.icon}/></ListItemIcon>
+      <ListItemIcon><StaticImage icon={dbDriver?.icon} /></ListItemIcon>
       <ListItemName>{template.name}</ListItemName>
       <ListItemDescription title={template.description}>{template.description}</ListItemDescription>
     </ListItem>
diff --git a/webapp/packages/plugin-data-export/src/DataExportMenuService.ts b/webapp/packages/plugin-data-export/src/DataExportMenuService.ts
index cad02995b9..d74c84685e 100644
--- a/webapp/packages/plugin-data-export/src/DataExportMenuService.ts
+++ b/webapp/packages/plugin-data-export/src/DataExportMenuService.ts
@@ -43,8 +43,8 @@ export class DataExportMenuService {
       {
         id: 'export',
         isPresent(context) {
-          return context.contextType === NavigationTreeContextMenuService.nodeContextType
-            && context.data.objectFeatures.includes(EObjectFeature.dataContainer);
+          return context.contextType === NavigationTreeContextMenuService.nodeContextType &&
+            context.data.objectFeatures.includes(EObjectFeature.dataContainer);
         },
         order: 2,
         title: 'data_transfer_dialog_export',
diff --git a/webapp/packages/plugin-data-export/src/DataExportProcessService.ts b/webapp/packages/plugin-data-export/src/DataExportProcessService.ts
index c867d99fad..fa3d2132cc 100644
--- a/webapp/packages/plugin-data-export/src/DataExportProcessService.ts
+++ b/webapp/packages/plugin-data-export/src/DataExportProcessService.ts
@@ -20,7 +20,7 @@ type Process = {
   process: Deferred<string>;
 }
 
-type ExportProcess = {
+export type ExportProcess = {
   taskId: string;
   context: IExportContext;
   parameters: DataTransferParameters;
@@ -36,7 +36,7 @@ export class DataExportProcessService {
     private notificationService: NotificationService,
   ) { }
 
-  async cancel(exportId: string) {
+  async cancel(exportId: string): Promise<void> {
     const process = this.exportProcesses.get(exportId);
     if (!process) {
       return;
@@ -44,7 +44,7 @@ export class DataExportProcessService {
     process.process.cancel();
   }
 
-  async delete(exportId: string) {
+  async delete(exportId: string): Promise<void> {
     const process = this.exportProcesses.get(exportId);
     if (!process) {
       return;
@@ -61,7 +61,7 @@ export class DataExportProcessService {
     }
   }
 
-  download(exportId: string) {
+  download(exportId: string): void {
     const process = this.exportProcesses.get(exportId);
     if (!process) {
       return;
@@ -73,7 +73,7 @@ export class DataExportProcessService {
     this.exportProcesses.remove(exportId);
   }
 
-  downloadUrl(exportId: string) {
+  downloadUrl(exportId: string): string | undefined {
     const process = this.exportProcesses.get(exportId);
     if (!process) {
       return;
diff --git a/webapp/packages/plugin-data-export/src/DataExportService.ts b/webapp/packages/plugin-data-export/src/DataExportService.ts
index dc01b98b48..f8c1dda320 100644
--- a/webapp/packages/plugin-data-export/src/DataExportService.ts
+++ b/webapp/packages/plugin-data-export/src/DataExportService.ts
@@ -7,7 +7,7 @@
  */
 
 import { injectable } from '@cloudbeaver/core-di';
-import { ENotificationType, NotificationService } from '@cloudbeaver/core-events';
+import { NotificationService } from '@cloudbeaver/core-events';
 import { DataTransferParameters } from '@cloudbeaver/core-sdk';
 
 import { DataExportProcessService } from './DataExportProcessService';
@@ -23,26 +23,22 @@ export class DataExportService {
     readonly processors: DataTransferProcessorsResource
   ) { }
 
-  async cancel(exportId: string) {
+  async cancel(exportId: string): Promise<void> {
     await this.dataExportProcessService.cancel(exportId);
   }
 
-  async delete(exportId: string) {
+  async delete(exportId: string): Promise<void> {
     await this.dataExportProcessService.delete(exportId);
   }
 
-  download(exportId: string) {
+  download(exportId: string): void {
     this.dataExportProcessService.download(exportId);
   }
 
-  downloadUrl(exportId: string) {
-    return this.dataExportProcessService.download(exportId);
-  }
-
   async exportData(
     context: IExportContext,
     parameters: DataTransferParameters
-  ) {
+  ): Promise<string> {
     const taskId = await this.dataExportProcessService.exportData(
       context,
       parameters
diff --git a/webapp/packages/plugin-data-export/src/Dialog/DataExportDialog.tsx b/webapp/packages/plugin-data-export/src/Dialog/DataExportDialog.tsx
index 4f093ad917..9670a193d5 100644
--- a/webapp/packages/plugin-data-export/src/Dialog/DataExportDialog.tsx
+++ b/webapp/packages/plugin-data-export/src/Dialog/DataExportDialog.tsx
@@ -42,8 +42,8 @@ export const DataExportDialog = observer(function DataExportDialog({
     <ProcessorSelectDialog
       context={payload}
       processors={controller.processors}
-      onSelect={controller.selectProcessor}
       isLoading={controller.isLoading}
+      onSelect={controller.selectProcessor}
       onClose={rejectDialog}
     />
   );
diff --git a/webapp/packages/plugin-data-export/src/Dialog/ExportProcessorList/ExportProcessorList.tsx b/webapp/packages/plugin-data-export/src/Dialog/ExportProcessorList/ExportProcessorList.tsx
index 23da2619c2..98dcdedfe9 100644
--- a/webapp/packages/plugin-data-export/src/Dialog/ExportProcessorList/ExportProcessorList.tsx
+++ b/webapp/packages/plugin-data-export/src/Dialog/ExportProcessorList/ExportProcessorList.tsx
@@ -27,7 +27,7 @@ export const ExportProcessorList = observer(function ExportProcessorList({
 
   return (
     <ItemList className={className}>
-      {processors.map(processor => <ProcessorItem key={processor.id} processor={processor} onSelect={onSelect}/>)}
+      {processors.map(processor => <ProcessorItem key={processor.id} processor={processor} onSelect={onSelect} />)}
     </ItemList>
   );
 });
diff --git a/webapp/packages/plugin-data-export/src/Dialog/ExportProcessorList/ProcessorItem.tsx b/webapp/packages/plugin-data-export/src/Dialog/ExportProcessorList/ProcessorItem.tsx
index 96b276f9b8..637a37e843 100644
--- a/webapp/packages/plugin-data-export/src/Dialog/ExportProcessorList/ProcessorItem.tsx
+++ b/webapp/packages/plugin-data-export/src/Dialog/ExportProcessorList/ProcessorItem.tsx
@@ -36,7 +36,7 @@ export const ProcessorItem = observer(function ProcessorItem({
 
   return styled(styles)(
     <ListItem onClick={select}>
-      <ListItemIcon><StaticImage icon={processor.icon}/></ListItemIcon>
+      <ListItemIcon><StaticImage icon={processor.icon} /></ListItemIcon>
       <ListItemName>{processor.name}</ListItemName>
       <ListItemDescription title={processor.description}>{processor.description}</ListItemDescription>
     </ListItem>
diff --git a/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialog.tsx b/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialog.tsx
index 8d005418b3..9b6b448235 100644
--- a/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialog.tsx
+++ b/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialog.tsx
@@ -75,15 +75,15 @@ export const ProcessorConfigureDialog = observer(
     return styled(useStyles(styles))(
       <CommonDialogWrapper
         title={title}
-        noBodyPadding
-        footer={
+        footer={(
           <ProcessorConfigureDialogFooter
             isExporting={isExporting}
             onExport={onExport}
             onBack={onBack}
             onCancel={onClose}
           />
-        }
+        )}
+        noBodyPadding
         onReject={onClose}
       >
         <PropertiesTable
diff --git a/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialogFooter.tsx b/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialogFooter.tsx
index 5d9472978e..94c0de6c9f 100644
--- a/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialogFooter.tsx
+++ b/webapp/packages/plugin-data-export/src/Dialog/ProcessorConfigureDialogFooter.tsx
@@ -51,25 +51,25 @@ export const ProcessorConfigureDialogFooter = observer(
         <Button
           type="button"
           mod={['outlined']}
-          onClick={onBack}
           disabled={isExporting}
+          onClick={onBack}
         >
           {translate('ui_stepper_back')}
         </Button>
-        <fill as="div"/>
+        <fill as="div" />
         <Button
           type="button"
           mod={['outlined']}
-          onClick={onCancel}
           disabled={isExporting}
+          onClick={onCancel}
         >
           {translate('ui_processing_cancel')}
         </Button>
         <Button
           type="button"
           mod={['unelevated']}
-          onClick={onExport}
           disabled={isExporting}
+          onClick={onExport}
         >
           {translate('data_transfer_dialog_export')}
         </Button>
diff --git a/webapp/packages/plugin-data-export/src/Dialog/ProcessorSelectDialog.tsx b/webapp/packages/plugin-data-export/src/Dialog/ProcessorSelectDialog.tsx
index b15cab16be..cb1add05d3 100644
--- a/webapp/packages/plugin-data-export/src/Dialog/ProcessorSelectDialog.tsx
+++ b/webapp/packages/plugin-data-export/src/Dialog/ProcessorSelectDialog.tsx
@@ -69,7 +69,7 @@ export const ProcessorSelectDialog = observer(
           <pre title={context.sourceName}>{context.sourceName}</pre>
         </export-object>
         {isLoading && <Loader />}
-        {!isLoading && <ExportProcessorList processors={processors} onSelect={onSelect}/>}
+        {!isLoading && <ExportProcessorList processors={processors} onSelect={onSelect} />}
       </CommonDialogWrapper>
     );
   }
diff --git a/webapp/packages/plugin-data-export/src/ExportNotification/ExportNotificationController.ts b/webapp/packages/plugin-data-export/src/ExportNotification/ExportNotificationController.ts
index 669e347425..275621b6de 100644
--- a/webapp/packages/plugin-data-export/src/ExportNotification/ExportNotificationController.ts
+++ b/webapp/packages/plugin-data-export/src/ExportNotification/ExportNotificationController.ts
@@ -14,35 +14,35 @@ import { CommonDialogService } from '@cloudbeaver/core-dialogs';
 import { INotification } from '@cloudbeaver/core-events';
 import { LocalizationService } from '@cloudbeaver/core-localization';
 import { ErrorDetailsDialog } from '@cloudbeaver/core-notifications';
-import { EDeferredState } from '@cloudbeaver/core-utils';
+import { Deferred, EDeferredState } from '@cloudbeaver/core-utils';
 
-import { DataExportProcessService } from '../DataExportProcessService';
+import { DataExportProcessService, ExportProcess } from '../DataExportProcessService';
 
 @injectable()
 export class ExportNotificationController implements IInitializableController {
   @observable isDetailsDialogOpen = false;
 
-  get isSuccess() {
+  get isSuccess(): boolean {
     return this.process?.getState() === EDeferredState.RESOLVED;
   }
 
-  get isPending() {
-    return this.process?.isInProgress;
+  get isPending(): boolean {
+    return !!this.process?.isInProgress;
   }
 
-  get process() {
+  get process(): Deferred<string> | undefined {
     return this.task?.process;
   }
 
-  get task() {
+  get task(): ExportProcess | undefined {
     return this.dataExportProcessService.exportProcesses.get(this.notification.extraProps.source);
   }
 
-  get hasDetails() {
+  get hasDetails(): boolean {
     return !!this.process?.getRejectionReason();
   }
 
-  @computed get sourceName() {
+  @computed get sourceName(): string {
     if (!this.task) {
       return '';
     }
@@ -55,7 +55,7 @@ export class ExportNotificationController implements IInitializableController {
     return this.localization.translate('data_transfer_exporting_sql');
   }
 
-  get status() {
+  get status(): string {
     switch (this.process?.getState()) {
       case EDeferredState.PENDING:
         return 'data_transfer_notification_preparation';
@@ -68,7 +68,7 @@ export class ExportNotificationController implements IInitializableController {
     }
   }
 
-  get downloadUrl() {
+  get downloadUrl(): string | undefined {
     return this.dataExportProcessService.downloadUrl(this.notification.extraProps.source);
   }
 
@@ -81,25 +81,25 @@ export class ExportNotificationController implements IInitializableController {
     private localization: LocalizationService,
   ) {}
 
-  init(notification: INotification<{ source: string }>) {
+  init(notification: INotification<{ source: string }>): void {
     this.notification = notification;
   }
 
-  delete = () => {
+  delete = (): void => {
     this.dataExportProcessService.delete(this.notification.extraProps.source);
     this.notification.close();
   }
 
-  download = () => {
+  download = (): void => {
     this.dataExportProcessService.download(this.notification.extraProps.source);
     this.notification.close();
   }
 
-  cancel = () => {
+  cancel = (): void => {
     this.dataExportProcessService.cancel(this.notification.extraProps.source);
   }
 
-  showDetails= async () => {
+  showDetails= async (): Promise<void> => {
     this.isDetailsDialogOpen = true;
     try {
       this.notification.showDetails();
diff --git a/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/IndexCellRenderer.tsx b/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/IndexCellRenderer.tsx
index 10576cefa2..17097b5728 100644
--- a/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/IndexCellRenderer.tsx
+++ b/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/IndexCellRenderer.tsx
@@ -11,7 +11,7 @@ import { Loader } from '@cloudbeaver/core-blocks';
 export function IndexCellRenderer() {
   return (
     <div style={{ display: 'flex', width: '100%' }}>
-      <Loader small/>
+      <Loader small />
     </div>
   );
 }
diff --git a/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/PlainTextEditor/PlainTextEditor.tsx b/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/PlainTextEditor/PlainTextEditor.tsx
index d039987838..3e82a6a624 100644
--- a/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/PlainTextEditor/PlainTextEditor.tsx
+++ b/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/PlainTextEditor/PlainTextEditor.tsx
@@ -88,15 +88,15 @@ export const PlainTextEditor = forwardRef<Partial<ICellEditorComp>, ICellEditorP
         <InlineEditor
           type={props.colDef.type === 'NUMERIC' ? 'number' : 'text'}
           value={value.current}
-          onSave={handleSave}
-          onReject={handleReject}
-          onChange={handleChange}
-          onUndo={handleUndo}
           controlsPosition={controlsPosition}
           edited
           hideSave
           hideCancel
           autofocus
+          onSave={handleSave}
+          onReject={handleReject}
+          onChange={handleChange}
+          onUndo={handleUndo}
         />
       </editor>
     );
diff --git a/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/TableColumnHeader/TableColumnHeader.tsx b/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/TableColumnHeader/TableColumnHeader.tsx
index 991f3b8eee..26f4c86475 100644
--- a/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/TableColumnHeader/TableColumnHeader.tsx
+++ b/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/TableColumnHeader/TableColumnHeader.tsx
@@ -123,10 +123,12 @@ export function TableColumnHeader(props: HeaderProps) {
         <StaticImage icon={props.icon} />
       </icon>
       <name as="div">{props.displayName}</name>
-      {props.enableSorting && <sort-icon as="div" onClick={handleSort}>
-        <Icon name="sort-arrow" viewBox="0 0 6 6" {...use({ active: sortMode === 'asc' })} />
-        <Icon name="sort-arrow" viewBox="0 0 6 6" {...use({ active: sortMode === 'desc' })} />
-      </sort-icon>}
+      {props.enableSorting && (
+        <sort-icon as="div" onClick={handleSort}>
+          <Icon name="sort-arrow" viewBox="0 0 6 6" {...use({ active: sortMode === 'asc' })} />
+          <Icon name="sort-arrow" viewBox="0 0 6 6" {...use({ active: sortMode === 'desc' })} />
+        </sort-icon>
+      )}
     </table-header>
   );
 }
diff --git a/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/modules/RangeSelection/rangeController.ts b/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/modules/RangeSelection/rangeController.ts
index 2b6a60e075..438f15afe2 100644
--- a/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/modules/RangeSelection/rangeController.ts
+++ b/webapp/packages/plugin-data-spreadsheet/src/AgGridTable/modules/RangeSelection/rangeController.ts
@@ -200,8 +200,8 @@ export class RangeController implements IRangeController {
       }
       this.lastSelectedCell = cell;
       this.lastFocus = cell;
-      if (!this.gridOptionsWrapper.isEnableRangeSelection()
-        || cell.column.getColId() === INDEX_COLUMN_DEF.colId) {
+      if (!this.gridOptionsWrapper.isEnableRangeSelection() ||
+        cell.column.getColId() === INDEX_COLUMN_DEF.colId) {
         return;
       }
       this.selection.selectCell(cell.rowIndex, cell.column.getColId(), appendRange);
@@ -439,9 +439,9 @@ export class RangeController implements IRangeController {
     }
 
     private isCellInTemporaryRange(rowId: number, column: string) {
-      if (!this.temporaryRange
-        || this.temporaryRange.firstRow > rowId || this.temporaryRange.lastRow < rowId
-        || !this.temporaryRange.columns.includes(column)
+      if (!this.temporaryRange ||
+        this.temporaryRange.firstRow > rowId || this.temporaryRange.lastRow < rowId ||
+        !this.temporaryRange.columns.includes(column)
       ) {
         return false;
       }
diff --git a/webapp/packages/plugin-data-viewer/src/DataViewerPage/DataViewerPanel.tsx b/webapp/packages/plugin-data-viewer/src/DataViewerPage/DataViewerPanel.tsx
index 1202cc760b..d419942f09 100644
--- a/webapp/packages/plugin-data-viewer/src/DataViewerPage/DataViewerPanel.tsx
+++ b/webapp/packages/plugin-data-viewer/src/DataViewerPage/DataViewerPanel.tsx
@@ -33,10 +33,12 @@ export const DataViewerPanel = observer(function DataViewerPanel({
     }
   }, [page, tab]);
 
-  return <TableViewer
-    tableId={tab.id}
-    resultIndex={pageState?.resultIndex}
-    presentationId={pageState?.presentationId}
-    onPresentationChange={handlePresentationChange}
-  />;
+  return (
+    <TableViewer
+      tableId={tab.id}
+      resultIndex={pageState?.resultIndex}
+      presentationId={pageState?.presentationId}
+      onPresentationChange={handlePresentationChange}
+    />
+  );
 });
diff --git a/webapp/packages/plugin-data-viewer/src/DataViewerPage/DataViewerTab.tsx b/webapp/packages/plugin-data-viewer/src/DataViewerPage/DataViewerTab.tsx
index 98dc43357b..76ddf484ea 100644
--- a/webapp/packages/plugin-data-viewer/src/DataViewerPage/DataViewerTab.tsx
+++ b/webapp/packages/plugin-data-viewer/src/DataViewerPage/DataViewerTab.tsx
@@ -28,7 +28,7 @@ export const DataViewerTab = observer(function DataViewerTab({
   }
 
   return styled(styles)(
-    <Tab tabId={page.key} onOpen={onSelect} style={style}>
+    <Tab tabId={page.key} style={style} onOpen={onSelect}>
       <TabIcon icon='/icons/grid.png' />
       <TabTitle>Data</TabTitle>
     </Tab>
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/ErrorDialog.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/ErrorDialog.tsx
index 96e89812d6..e40c185745 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/ErrorDialog.tsx
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/ErrorDialog.tsx
@@ -53,7 +53,6 @@ export const ErrorDialog = observer(function ErrorDialog({
   return styled(useStyles(styles))(
     <CommonDialogWrapper
       title={translate('ui_data_saving_error')}
-      onReject={rejectDialog}
       footer={(
         <controls as="div">
           {payload.onShowDetails && (
@@ -61,13 +60,14 @@ export const ErrorDialog = observer(function ErrorDialog({
               {translate('ui_errors_details')}
             </Button>
           )}
-          <fill as="div"/>
+          <fill as="div" />
           <Button type="button" mod={['outlined']} onClick={rejectDialog}>{translate('ui_processing_cancel')}</Button>
           <Button type="button" mod={['unelevated']} onClick={handleRetry}>{translate('ui_processing_retry')}</Button>
         </controls>
       )}
+      onReject={rejectDialog}
     >
-      <message as="div"><SanitizedHTML html={payload.message}/></message>
+      <message as="div"><SanitizedHTML html={payload.message} /></message>
     </CommonDialogWrapper>
   );
 });
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableDataModel/TableDataModel.ts b/webapp/packages/plugin-data-viewer/src/TableViewer/TableDataModel/TableDataModel.ts
index e970bb5807..f8374c7b28 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableDataModel/TableDataModel.ts
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableDataModel/TableDataModel.ts
@@ -42,8 +42,8 @@ export class TableDataModel {
 
   isChunkLoaded(offset: number, count: number) {
     return (
-      (this.rows.length > offset && !!this.rows[offset])
-      && (this.rows.length > offset + count - 1 && !!this.rows[offset + count - 1])
+      (this.rows.length > offset && !!this.rows[offset]) &&
+      (this.rows.length > offset + count - 1 && !!this.rows[offset + count - 1])
     );
   }
 
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableDataModel/TableRow.ts b/webapp/packages/plugin-data-viewer/src/TableViewer/TableDataModel/TableRow.ts
index 66054922e6..f7dbd658ba 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableDataModel/TableRow.ts
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableDataModel/TableRow.ts
@@ -6,7 +6,7 @@
  * you may not use this file except in compliance with the License.
  */
 
-export type CellValue = string | number | object
+export type CellValue = string | number | Record<any, unknown>
 
 export type TableRow = CellValue[]
 
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooter.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooter.tsx
index b13fb6a95f..8b52d53b92 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooter.tsx
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooter.tsx
@@ -91,14 +91,14 @@ export const TableFooter = observer(function TableFooter({
   return styled(useStyles(tableFooterStyles))(
     <table-footer as="div">
       <reload as="div">
-        <IconButton type="button" name='reload' onClick={() => model.refresh()} viewBox="0 0 16 16"/>
+        <IconButton type="button" name='reload' viewBox="0 0 16 16" onClick={() => model.refresh()} />
       </reload>
       <count as="div">
         <SubmittingForm onSubmit={handleChange}>
-          <input type="number" value={model.countGain} ref={ref} onBlur={handleChange} {...use({ mod: 'surface' })} />
+          <input ref={ref} type="number" value={model.countGain} onBlur={handleChange} {...use({ mod: 'surface' })} />
         </SubmittingForm>
       </count>
-      <TableFooterMenu model={model}/>
+      <TableFooterMenu model={model} />
       {model.deprecatedModel.requestStatusMessage.length > 0 && (
         <time>
           {model.deprecatedModel.requestStatusMessage} - {model.deprecatedModel.queryDuration}ms
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooterMenu/TableFooterMenu.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooterMenu/TableFooterMenu.tsx
index cecdecc7db..bfd118fbdc 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooterMenu/TableFooterMenu.tsx
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooterMenu/TableFooterMenu.tsx
@@ -37,7 +37,7 @@ export const TableFooterMenu = observer(function TableFooterMenu({ model, classN
   return styled(styles)(
     <menu-wrapper as="div" className={className}>
       {mainMenuService.constructMenuWithContext(model).map((topItem, i) => (
-        <TableFooterMenuItem key={i} menuItem={topItem}/>
+        <TableFooterMenuItem key={i} menuItem={topItem} />
       ))}
     </menu-wrapper>
   );
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooterMenu/TableFooterMenuItem.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooterMenu/TableFooterMenuItem.tsx
index fcb7e07b5c..8d81a9660f 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooterMenu/TableFooterMenuItem.tsx
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooterMenu/TableFooterMenuItem.tsx
@@ -62,13 +62,16 @@ export const TableFooterMenuItem = observer(function TableFooterMenuItem({
   ...props
 }: Props) {
   const translate = useTranslate();
+  const styles = useStyles(tableFooterMenuStyles);
 
   if (!menuItem.panel) {
-    return styled(useStyles(tableFooterMenuStyles))(
+    return styled(styles)(
       <Button
-        as="button" {...props}
+        as="button"
+        {...props}
         disabled={menuItem.isDisabled}
-        onClick={() => menuItem.onClick && menuItem.onClick()}>
+        onClick={() => menuItem.onClick && menuItem.onClick()}
+      >
         {menuItem.icon && (
           <menu-trigger-icon as="div">
             <IconOrImage icon={menuItem.icon} viewBox="0 0 32 32" />
@@ -79,7 +82,7 @@ export const TableFooterMenuItem = observer(function TableFooterMenuItem({
     );
   }
 
-  return styled(useStyles(tableFooterMenuStyles))(
+  return styled(styles)(
     <MenuTrigger
       {...props}
       panel={menuItem.panel}
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableGrid.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableGrid.tsx
index 15d1742e4f..d88ef3bc8f 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableGrid.tsx
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableGrid.tsx
@@ -43,7 +43,7 @@ export const TableGrid = observer(function TableGrid({
     return styled(styles)(
       <error as="div">
         {model.deprecatedModel.errorMessage}
-        <br/><br/>
+        <br /><br />
         {model.deprecatedModel.hasDetails && (
           <Button type='button' mod={['outlined']} onClick={model.deprecatedModel.onShowDetails}>
             {translate('ui_errors_details')}
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableHeader.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableHeader.tsx
index c71a325e28..22b08ff479 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableHeader.tsx
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableHeader.tsx
@@ -43,7 +43,7 @@ export const TableHeader = observer(function TableHeader({
 
   return styled(useStyles(styles))(
     <table-header as="div">
-      <Placeholder container={service.tableHeaderPlaceholder} context={model}/>
+      <Placeholder container={service.tableHeaderPlaceholder} context={model} />
     </table-header>
   );
 });
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.tsx
index 78d0b2e86f..f135ad530c 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.tsx
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableHeader/TableWhereFilter.tsx
@@ -73,13 +73,13 @@ export const TableWhereFilter = observer(function TableWhereFilter({
     <InlineEditor
       name="data_where"
       value={filterValue}
-      onSave={handleApply}
-      onUndo={resetFilter}
-      onChange={setValue}
       placeholder={translate('table_header_sql_expression')}
       controlsPosition='inside'
       edited={!!filterValue}
       simple
+      onSave={handleApply}
+      onUndo={resetFilter}
+      onChange={setValue}
     />
   );
 });
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableLeftBar/PresentationTab.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableLeftBar/PresentationTab.tsx
index cc29ee2b19..0e65067176 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableLeftBar/PresentationTab.tsx
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableLeftBar/PresentationTab.tsx
@@ -35,17 +35,19 @@ export const PresentationTab = observer(function PresentationTab({
   if (presentation.getTabComponent) {
     const Tab = presentation.getTabComponent();
 
-    return <Tab
-      tabId={presentation.id}
-      className={className}
-      style={verticalRotatedTabStyles}
-      model={model}
-      presentation={presentation}
-    />;
+    return (
+      <Tab
+        tabId={presentation.id}
+        className={className}
+        style={verticalRotatedTabStyles}
+        model={model}
+        presentation={presentation}
+      />
+    );
   }
   return styled(styles)(
     <Tab tabId={presentation.id} style={[verticalRotatedTabStyles, style]}>
-      <TabIcon icon={presentation.icon}/>
+      <TabIcon icon={presentation.icon} />
       <TabTitle>{presentation.title}</TabTitle>
     </Tab>
   );
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableLeftBar/TableLeftBar.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableLeftBar/TableLeftBar.tsx
index 1ca5d94fe8..4afa3a8a7a 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableLeftBar/TableLeftBar.tsx
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableLeftBar/TableLeftBar.tsx
@@ -70,7 +70,7 @@ export const TableLeftBar = observer(function TableLeftBar({
       <TabsState currentTabId={presentationId} onChange={onPresentationChange}>
         <TabList>
           {presentations.map(presentation => (
-            <Tab key={presentation.id} presentation={presentation} model={model} style={styles}/>
+            <Tab key={presentation.id} presentation={presentation} model={model} style={styles} />
           ))}
         </TabList>
       </TabsState>
diff --git a/webapp/packages/plugin-data-viewer/src/TableViewer/TableViewer.tsx b/webapp/packages/plugin-data-viewer/src/TableViewer/TableViewer.tsx
index 99058d2fc9..6a9e14bbc3 100644
--- a/webapp/packages/plugin-data-viewer/src/TableViewer/TableViewer.tsx
+++ b/webapp/packages/plugin-data-viewer/src/TableViewer/TableViewer.tsx
@@ -100,7 +100,7 @@ export const TableViewer = observer(function TableViewer({
           <TableFooter model={dataModel} />
         </table-data>
       </table-content>
-      <Loader loading={dataModel.isLoading()} overlay/>
+      <Loader loading={dataModel.isLoading()} overlay />
     </table-viewer>
   );
 });
diff --git a/webapp/packages/plugin-ddl-viewer/src/DdlViewer/DdlViewer.tsx b/webapp/packages/plugin-ddl-viewer/src/DdlViewer/DdlViewer.tsx
index c4e033501e..5317f0006b 100644
--- a/webapp/packages/plugin-ddl-viewer/src/DdlViewer/DdlViewer.tsx
+++ b/webapp/packages/plugin-ddl-viewer/src/DdlViewer/DdlViewer.tsx
@@ -29,7 +29,7 @@ export type DdlViewerTabPanelProps = {
   nodeId: string;
 }
 
-export const ddlViewer = (nodeId: string) => (<DdlViewerTabPanel nodeId={nodeId}/>);
+export const ddlViewer = (nodeId: string) => (<DdlViewerTabPanel nodeId={nodeId} />);
 
 const DdlViewerTabPanel = observer(function DdlViewerTabPanel(props: DdlViewerTabPanelProps) {
   const controller = useController(DdlViewerController, props.nodeId);
@@ -43,8 +43,9 @@ const DdlViewerTabPanel = observer(function DdlViewerTabPanel(props: DdlViewerTa
       {controller.metadata && (
         <CodeEditor
           value={controller.metadata}
-          readonly={true}
-          dialect={controller.dialect}/>
+          dialect={controller.dialect}
+          readonly
+        />
       )}
     </wrapper>
   );
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPage/DBObjectPageTab.tsx b/webapp/packages/plugin-object-viewer/src/ObjectPage/DBObjectPageTab.tsx
index 671bad71c0..1efda93701 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectPage/DBObjectPageTab.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectPage/DBObjectPageTab.tsx
@@ -27,5 +27,5 @@ export const DBObjectPageTab = observer(function DBObjectPageTab({
 }: DBObjectPageTabProps) {
   const handleSelect = useCallback(() => onSelect(tab, page), [tab, page, onSelect]);
   const TabComponent = page.getTabComponent();
-  return <TabComponent tab={tab} page={page} onSelect={handleSelect} style={style}/>;
+  return <TabComponent tab={tab} page={page} style={style} onSelect={handleSelect} />;
 });
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectFolders.tsx b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectFolders.tsx
index fef363f08b..2ec8a13afa 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectFolders.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectFolders.tsx
@@ -53,5 +53,5 @@ type ObjectFoldersProps = {
 export const ObjectFolders = observer(function ObjectFolders({ tab }: ObjectFoldersProps) {
   const controller = useController(ObjectFoldersController, tab);
 
-  return styled(useStyles(styles))(<VerticalTabs tabContainer={controller.getTabContainer()} style={[styles]}/>);
+  return styled(useStyles(styles))(<VerticalTabs tabContainer={controller.getTabContainer()} style={[styles]} />);
 });
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectInfoTab.tsx b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectInfoTab.tsx
index 000de4b33a..db21e60c61 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectInfoTab.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectInfoTab.tsx
@@ -16,6 +16,6 @@ import { ObjectProperties } from './ObjectProperties';
 export const ObjectInfoTab = observer(function ObjectInfoTab() {
   const nodePropertiesMixin = useService(NodePropertiesMixin);
   return (
-    <ObjectProperties objectId={nodePropertiesMixin.nodeId}/>
+    <ObjectProperties objectId={nodePropertiesMixin.nodeId} />
   );
 });
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectInfoTabService.ts b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectInfoTabService.ts
index 9123600fa0..1d212f3470 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectInfoTabService.ts
+++ b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectInfoTabService.ts
@@ -21,8 +21,8 @@ export class ObjectInfoTabService {
 
   createTabEntity(navNodeId: string): TabEntity | null {
     const node = this.navNodeManagerService.getNode(navNodeId);
-    const isDatabaseObject = node?.features?.includes(ENodeFeature.item)
-      || node?.features?.includes(ENodeFeature.container);
+    const isDatabaseObject = node?.features?.includes(ENodeFeature.item) ||
+      node?.features?.includes(ENodeFeature.container);
     if (!isDatabaseObject) {
       return null;
     }
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectProperty.tsx b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectProperty.tsx
index 1f4f5235a3..f6558037e4 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectProperty.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectInfoTab/ObjectProperty.tsx
@@ -41,8 +41,8 @@ export const ObjectProperty = observer(function ObjectProperty({
       {...use({ checkbox: matchType(objectProperty.dataType) === 'checkbox' })}
     >
       {matchType(objectProperty.dataType) === 'checkbox'
-        ? <ObjectPropertyCheckbox objectProperty={objectProperty}/>
-        : <ObjectPropertyInput objectProperty={objectProperty}/>}
+        ? <ObjectPropertyCheckbox objectProperty={objectProperty} />
+        : <ObjectPropertyInput objectProperty={objectProperty} />}
     </property>
   );
 });
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertiesPageTab.tsx b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertiesPageTab.tsx
index b9b734a1fe..53f1d86834 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertiesPageTab.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertiesPageTab.tsx
@@ -19,8 +19,8 @@ export const ObjectPropertiesPageTab = observer(function ObjectPropertiesPageTab
 }: ObjectPageTabProps) {
 
   return styled(useStyles(style))(
-    <Tab tabId={page.key} onOpen={onSelect} style={style}>
-      <TabIcon icon='/icons/properties.svg' viewBox="0 0 16 16"/>
+    <Tab tabId={page.key} style={style} onOpen={onSelect}>
+      <TabIcon icon='/icons/properties.svg' viewBox="0 0 16 16" />
       <TabTitle>Properties</TabTitle>
     </Tab>
   );
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/Header.tsx b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/Header.tsx
index 1c65e251a9..965c89d397 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/Header.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/Header.tsx
@@ -36,12 +36,13 @@ type HeaderProps = {
 
 export const Header = observer(function Header({ properties }: HeaderProps) {
   const translate = useTranslate();
+  const style = useStyles(styles);
 
   if (!properties.length) {
-    return styled(useStyles(styles))(
+    return styled(style)(
       <>
-        <TableColumnHeader min></TableColumnHeader>
-        <TableColumnHeader></TableColumnHeader>
+        <TableColumnHeader min />
+        <TableColumnHeader />
         <TableColumnHeader title={translate('plugin_object_viewer_table_name')}>
           {translate('plugin_object_viewer_table_name')}
         </TableColumnHeader>
@@ -49,10 +50,10 @@ export const Header = observer(function Header({ properties }: HeaderProps) {
     );
   }
 
-  return styled(useStyles(styles))(
+  return styled(style)(
     <>
-      <TableColumnHeader min></TableColumnHeader>
-      <TableColumnHeader></TableColumnHeader>
+      <TableColumnHeader min />
+      <TableColumnHeader />
       {properties.map(property => (
         <TableColumnHeader key={property.id} title={property.description}>
           {property.displayName}
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/Item.tsx b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/Item.tsx
index 3b99a28eba..2bd3865d59 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/Item.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/Item.tsx
@@ -54,10 +54,11 @@ export const Item = observer(function Item({
   const navNodeManagerService = useService(NavNodeManagerService);
   const { node } = useNode(objectId);
   const { dbObject } = useDatabaseObjectInfo(objectId);
+  const styles = useStyles(itemStyles);
   const handleOpen = useCallback(() => navNodeManagerService.navToNode(node!.id, node!.parentId), [node]);
 
   if (!node) {
-    return styled(useStyles(itemStyles))(
+    return styled(styles)(
       <TableItem item={objectId}>
         <TableColumnValue centerContent><TableItemSelect /></TableColumnValue>
         <TableColumnValue>
@@ -77,7 +78,7 @@ export const Item = observer(function Item({
   }
 
   if (!dbObject?.properties) {
-    return styled(useStyles(itemStyles))(
+    return styled(styles)(
       <TableItem item={objectId}>
         <TableColumnValue centerContent><TableItemSelect /></TableColumnValue>
         <TableColumnValue>
@@ -90,7 +91,7 @@ export const Item = observer(function Item({
     );
   }
 
-  return styled(useStyles(itemStyles))(
+  return styled(styles)(
     <TableItem item={objectId}>
       <TableColumnValue centerContent><TableItemSelect /></TableColumnValue>
       <TableColumnValue>
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/ObjectPropertyTable.tsx b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/ObjectPropertyTable.tsx
index 40034aba6f..c2328640e2 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/ObjectPropertyTable.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/ObjectPropertyTable/ObjectPropertyTable.tsx
@@ -45,9 +45,9 @@ export const ObjectPropertyTable = observer(function ObjectPropertyTable({
     );
   }
 
-  return <ObjectChildrenPropertyTable nodeIds={children.children}/>;
+  return <ObjectChildrenPropertyTable nodeIds={children.children} />;
 });
 
 export const objectPropertyTablePanel = (parentId: string, objectId: string) => (
-  <ObjectPropertyTable parentId={parentId} objectId={objectId}/>
+  <ObjectPropertyTable parentId={parentId} objectId={objectId} />
 );
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/formControls/ObjectPropertyCheckbox.tsx b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/formControls/ObjectPropertyCheckbox.tsx
index f8d70a50eb..5abcb8418d 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/formControls/ObjectPropertyCheckbox.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/formControls/ObjectPropertyCheckbox.tsx
@@ -58,7 +58,7 @@ export const ObjectPropertyCheckbox = observer(function ObjectPropertyCheckbox({
           type={matchType(objectProperty.dataType)}
           value={getValue(objectProperty.value as any)}
           {...additionalProps(objectProperty)}
-          readOnly={true}
+          readOnly
         />
       </input-wrapper>
     </form-checkbox>
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/formControls/ObjectPropertyInput.tsx b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/formControls/ObjectPropertyInput.tsx
index bf028845df..c6b4f7575d 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/formControls/ObjectPropertyInput.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectPropertiesPage/formControls/ObjectPropertyInput.tsx
@@ -49,15 +49,18 @@ export const ObjectPropertyInput = observer(function ObjectPropertyInput({ objec
   return styled(style)(
     <form-input as="div">
       <label-wrapper as="div">
-        <label htmlFor={objectProperty.id}
-          title={objectProperty.displayName}>{objectProperty.displayName}</label>
+        <label
+          htmlFor={objectProperty.id}
+          title={objectProperty.displayName}
+        >{objectProperty.displayName}
+        </label>
       </label-wrapper>
       <input-wrapper as="div">
         <input
           type={matchType(objectProperty.dataType)}
           value={getValue(objectProperty.value)}
           {...additionalProps(objectProperty)}
-          readOnly={true}
+          readOnly
         />
       </input-wrapper>
     </form-input>
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectViewerPanel.tsx b/webapp/packages/plugin-object-viewer/src/ObjectViewerPanel.tsx
index fc6f7c52ab..1d5389dedf 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectViewerPanel.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectViewerPanel.tsx
@@ -64,8 +64,8 @@ export const ObjectViewerPanel = observer(function ObjectViewerPanel({
           key={page.key}
           tab={tab}
           page={page}
-          onSelect={dbObjectPagesService.selectPage}
           style={stylesArray}
+          onSelect={dbObjectPagesService.selectPage}
         />
       ))}
       style={stylesArray}
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectViewerTab.tsx b/webapp/packages/plugin-object-viewer/src/ObjectViewerTab.tsx
index 36cc2d6af3..ffdfa5c2da 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectViewerTab.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectViewerTab.tsx
@@ -21,7 +21,7 @@ export const ObjectViewerTab = observer(function ObjectViewerTab({
   const { node } = useNode(tab.handlerState.objectId);
 
   return styled(useStyles(style))(
-    <Tab tabId={tab.id} onOpen={onSelect} onClose={onClose} style={style}>
+    <Tab tabId={tab.id} style={style} onOpen={onSelect} onClose={onClose}>
       <TabIcon icon={node?.icon || tab.handlerState.tabIcon} />
       <TabTitle>{node?.name || tab.handlerState.tabTitle}</TabTitle>
     </Tab>
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectViewerTabService.ts b/webapp/packages/plugin-object-viewer/src/ObjectViewerTabService.ts
index 04918d931a..505d2e80f7 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectViewerTabService.ts
+++ b/webapp/packages/plugin-object-viewer/src/ObjectViewerTabService.ts
@@ -277,13 +277,13 @@ export class ObjectViewerTabService {
 
   private async restoreObjectTab(tab: ITab<IObjectViewerTabState>) {
     if (
-      typeof tab.handlerState?.folderId === 'string'
-      && typeof tab.handlerState.parentId === 'string'
-      && Array.isArray(tab.handlerState.parents)
-      && typeof tab.handlerState.objectId === 'string'
-      && typeof tab.handlerState.pagesState === 'object'
-      && (!tab.handlerState.tabIcon || typeof tab.handlerState.tabIcon === 'string')
-      && (!tab.handlerState.tabTitle || typeof tab.handlerState.tabTitle === 'string')
+      typeof tab.handlerState?.folderId === 'string' &&
+      typeof tab.handlerState.parentId === 'string' &&
+      Array.isArray(tab.handlerState.parents) &&
+      typeof tab.handlerState.objectId === 'string' &&
+      typeof tab.handlerState.pagesState === 'object' &&
+      (!tab.handlerState.tabIcon || typeof tab.handlerState.tabIcon === 'string') &&
+      (!tab.handlerState.tabTitle || typeof tab.handlerState.tabTitle === 'string')
     ) {
       tab.handlerState.pagesState = observable.map(tab.handlerState.pagesState);
 
diff --git a/webapp/packages/plugin-object-viewer/src/useObjectFolder.ts b/webapp/packages/plugin-object-viewer/src/useObjectFolder.ts
index 78e5bb71cd..c7a1a2c0ed 100644
--- a/webapp/packages/plugin-object-viewer/src/useObjectFolder.ts
+++ b/webapp/packages/plugin-object-viewer/src/useObjectFolder.ts
@@ -16,8 +16,8 @@ export function useObjectFolder(objectId: string) {
 
   const children = navNodeManagerService.getTree(objectId) || [];
 
-  const isLoading = !dbObjectService.isLoaded(resourceKeyList(children))
-      && dbObjectService.isDataLoading(resourceKeyList(children));
+  const isLoading = !dbObjectService.isLoaded(resourceKeyList(children)) &&
+      dbObjectService.isDataLoading(resourceKeyList(children));
 
   return { isLoading };
 }
diff --git a/webapp/packages/plugin-sql-editor/src/SqlEditor/CodeEditor/CodeEditor.tsx b/webapp/packages/plugin-sql-editor/src/SqlEditor/CodeEditor/CodeEditor.tsx
index 3d6f48d336..062fd9a2aa 100644
--- a/webapp/packages/plugin-sql-editor/src/SqlEditor/CodeEditor/CodeEditor.tsx
+++ b/webapp/packages/plugin-sql-editor/src/SqlEditor/CodeEditor/CodeEditor.tsx
@@ -39,7 +39,8 @@ export const CodeEditor = observer(function CodeEditor(props: CodeEditorProps) {
     <code-editor as="div" {...use({ readonly: props.readonly })} className={props.className}>
       <CodeMirror
         {...controller.bindings}
-        value={props.value || ''}/>
+        value={props.value || ''}
+      />
     </code-editor>
   );
 });
diff --git a/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditor.tsx b/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditor.tsx
index 2ddc3c4da6..80b58f0197 100644
--- a/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditor.tsx
+++ b/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditor.tsx
@@ -63,25 +63,29 @@ export const SqlEditor = observer(function SqlEditor({ tabId, className }: SqlEd
     <sql-editor as="div" className={className}>
       <actions as="div">
         <button
+          disabled={controller.isActionsDisabled}
           onClick={controller.handleExecute}
-          disabled={controller.isActionsDisabled}>
+        >
           <StaticImage
             icon="/icons/sql_exec.png"
             title="Execute SQL Statement (Ctrl+Enter)"
           />
         </button>
         <button
+          disabled={controller.isActionsDisabled}
           onClick={controller.handleExecuteNewTab}
-          disabled={controller.isActionsDisabled}>
+        >
           <StaticImage
             icon="/icons/sql_exec_new.png"
-            title="Execute SQL in new tab (Ctrl+\\)(Shift+Ctrl+Enter)"/>
+            title="Execute SQL in new tab (Ctrl+\\)(Shift+Ctrl+Enter)"
+          />
         </button>
       </actions>
       <CodeEditor
         bindings={controller.bindings}
         dialect={controller.dialect}
-        value={controller.value} />
+        value={controller.value}
+      />
     </sql-editor>
   );
 });
diff --git a/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditorController.tsx b/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditorController.tsx
index ec4ef8ee81..2cb4f0328b 100644
--- a/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditorController.tsx
+++ b/webapp/packages/plugin-sql-editor/src/SqlEditor/SqlEditorController.tsx
@@ -183,8 +183,8 @@ export class SqlEditorController implements IInitializableController {
 
   private isLineEndedWithDelimiter(delimiters: string[], line: string) {
     for (const delimiter of delimiters) {
-      if (line.length === 0 || (line.length - delimiter.length >= 0
-        && line.substr(line.length - delimiter.length, delimiter.length) === delimiter)) {
+      if (line.length === 0 || (line.length - delimiter.length >= 0 &&
+        line.substr(line.length - delimiter.length, delimiter.length) === delimiter)) {
         return true;
       }
     }
diff --git a/webapp/packages/plugin-sql-editor/src/SqlEditorBootstrap.ts b/webapp/packages/plugin-sql-editor/src/SqlEditorBootstrap.ts
index 7cb038824b..904bf311a3 100644
--- a/webapp/packages/plugin-sql-editor/src/SqlEditorBootstrap.ts
+++ b/webapp/packages/plugin-sql-editor/src/SqlEditorBootstrap.ts
@@ -50,8 +50,8 @@ export class SqlEditorBootstrap {
     const openSqlEditor: IContextMenuItem<NavNode> = {
       id: 'open-sql-editor',
       isPresent(context) {
-        return context.contextType === NavigationTreeContextMenuService.nodeContextType
-          && context.data.objectFeatures.includes(EObjectFeature.dataSource);
+        return context.contextType === NavigationTreeContextMenuService.nodeContextType &&
+          context.data.objectFeatures.includes(EObjectFeature.dataSource);
       },
       title: 'SQL',
       order: 2,
diff --git a/webapp/packages/plugin-sql-editor/src/SqlEditorPanel.tsx b/webapp/packages/plugin-sql-editor/src/SqlEditorPanel.tsx
index d6c9c40f61..9f39365a4e 100644
--- a/webapp/packages/plugin-sql-editor/src/SqlEditorPanel.tsx
+++ b/webapp/packages/plugin-sql-editor/src/SqlEditorPanel.tsx
@@ -32,11 +32,11 @@ export function SqlEditorPanel({ tab }: TabHandlerPanelProps<ISqlEditorTabState>
   return styled(useStyles(splitStyles, splitHorizontalStyles, viewerStyles))(
     <Split split="horizontal" sticky={30}>
       <Pane>
-        <SqlEditor tabId={tab.id}/>
+        <SqlEditor tabId={tab.id} />
       </Pane>
       <ResizerControls />
-      <Pane main={true}>
-        <SqlResultTabs tab={tab}/>
+      <Pane main>
+        <SqlResultTabs tab={tab} />
       </Pane>
     </Split>
   );
diff --git a/webapp/packages/plugin-sql-editor/src/SqlEditorTabService.ts b/webapp/packages/plugin-sql-editor/src/SqlEditorTabService.ts
index 192793fc72..7a8317b921 100644
--- a/webapp/packages/plugin-sql-editor/src/SqlEditorTabService.ts
+++ b/webapp/packages/plugin-sql-editor/src/SqlEditorTabService.ts
@@ -109,14 +109,14 @@ export class SqlEditorTabService {
 
   private async handleTabRestore(tab: ITab<ISqlEditorTabState>): Promise<boolean> {
 
-    if (typeof tab.handlerState.query !== 'string'
-        || typeof tab.handlerState.connectionId !== 'string'
-        || typeof tab.handlerState.contextId !== 'string'
-        || typeof tab.handlerState.objectCatalogId !== 'string'
-        || typeof tab.handlerState.order !== 'number'
-        || !['string', 'undefined'].includes(typeof tab.handlerState.currentResultTabId)
-        || !Array.isArray(tab.handlerState.queryTabGroups)
-        || !Array.isArray(tab.handlerState.resultTabs)
+    if (typeof tab.handlerState.query !== 'string' ||
+        typeof tab.handlerState.connectionId !== 'string' ||
+        typeof tab.handlerState.contextId !== 'string' ||
+        typeof tab.handlerState.objectCatalogId !== 'string' ||
+        typeof tab.handlerState.order !== 'number' ||
+        !['string', 'undefined'].includes(typeof tab.handlerState.currentResultTabId) ||
+        !Array.isArray(tab.handlerState.queryTabGroups) ||
+        !Array.isArray(tab.handlerState.resultTabs)
     ) {
       return false;
     }
diff --git a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultPanel/SqlResultPanel.tsx b/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultPanel/SqlResultPanel.tsx
index 91e41eae77..5c449aa58f 100644
--- a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultPanel/SqlResultPanel.tsx
+++ b/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultPanel/SqlResultPanel.tsx
@@ -71,7 +71,7 @@ export const SqlResultPanel = observer(function SqlResultPanel({ tab, panelInit
         <wrapper as="div">
           <messages as="div">
             <message as="div">{controller.executionResult}</message>
-            <hr/>
+            <hr />
             <query as="pre">
               {controller.getQuery()}
             </query>
diff --git a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultTabs.tsx b/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultTabs.tsx
index e26b9394fb..55f41469ae 100644
--- a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultTabs.tsx
+++ b/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultTabs.tsx
@@ -104,15 +104,15 @@ export const SqlResultTabs = observer(function SqlDataResult({ tab }: SqlDataRes
       >
         {orderedTabs.get().map(result => (
           <TabPanel key={result.resultTabId} tabId={result.resultTabId}>
-            <SqlResultPanel tab={tab} panelInit={result}/>
+            <SqlResultPanel tab={tab} panelInit={result} />
           </TabPanel>
         ))}
       </TabsBox>
       <Loader
         loading={executionState.isSqlExecuting}
         cancelDisabled={!executionState.canCancel}
-        onCancel={executionState.cancelSQlExecuting}
         overlay
+        onCancel={executionState.cancelSQlExecuting}
       />
     </wrapper>
   );
diff --git a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultTabsService.ts b/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultTabsService.ts
index 5ec25081c6..e0f9f9583a 100644
--- a/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultTabsService.ts
+++ b/webapp/packages/plugin-sql-editor/src/SqlResultTabs/SqlResultTabsService.ts
@@ -72,8 +72,8 @@ export class SqlResultTabsService {
 
     for (let [i, length] = [0, 1]; i < length; i++) {
       let resultTab = editorState.resultTabs.find(
-        resultTab => resultTab.groupId === tabGroup.groupId
-          && resultTab.indexInResultSet === i
+        resultTab => resultTab.groupId === tabGroup.groupId &&
+          resultTab.indexInResultSet === i
       );
 
       if (!resultTab) {
@@ -108,8 +108,8 @@ export class SqlResultTabsService {
           length = data.results?.length || 1;
           editorState.resultTabs = editorState.resultTabs
             .filter(
-              resultTab => resultTab.groupId !== tabGroup.groupId
-              || resultTab.indexInResultSet < length
+              resultTab => resultTab.groupId !== tabGroup.groupId ||
+              resultTab.indexInResultSet < length
             );
         } catch (exception) {
           // remove first panel if execution was cancelled
diff --git a/webapp/yarn.lock b/webapp/yarn.lock
index 0bb0712e64..ba9680763e 100644
--- a/webapp/yarn.lock
+++ b/webapp/yarn.lock
@@ -2851,20 +2851,32 @@
   dependencies:
     "@types/node" "*"
 
-"@typescript-eslint/eslint-plugin@^4.1.0":
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-4.1.0.tgz#7d309f60815ff35e9627ad85e41928d7b7fd443f"
-  integrity sha512-U+nRJx8XDUqJxYF0FCXbpmD9nWt/xHDDG0zsw1vrVYAmEAuD/r49iowfurjSL2uTA2JsgtpsyG7mjO7PHf2dYw==
+"@typescript-eslint/eslint-plugin@^4.3.0":
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-4.3.0.tgz#1a23d904bf8ea248d09dc3761af530d90f39c8fa"
+  integrity sha512-RqEcaHuEKnn3oPFislZ6TNzsBLqpZjN93G69SS+laav/I8w/iGMuMq97P0D2/2/kW4SCebHggqhbcCfbDaaX+g==
   dependencies:
-    "@typescript-eslint/experimental-utils" "4.1.0"
-    "@typescript-eslint/scope-manager" "4.1.0"
+    "@typescript-eslint/experimental-utils" "4.3.0"
+    "@typescript-eslint/scope-manager" "4.3.0"
     debug "^4.1.1"
     functional-red-black-tree "^1.0.1"
     regexpp "^3.0.0"
     semver "^7.3.2"
     tsutils "^3.17.1"
 
-"@typescript-eslint/experimental-utils@4.1.0", "@typescript-eslint/experimental-utils@^4.0.1":
+"@typescript-eslint/experimental-utils@4.3.0":
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-4.3.0.tgz#3f3c6c508e01b8050d51b016e7f7da0e3aefcb87"
+  integrity sha512-cmmIK8shn3mxmhpKfzMMywqiEheyfXLV/+yPDnOTvQX/ztngx7Lg/OD26J8gTZfkLKUmaEBxO2jYP3keV7h2OQ==
+  dependencies:
+    "@types/json-schema" "^7.0.3"
+    "@typescript-eslint/scope-manager" "4.3.0"
+    "@typescript-eslint/types" "4.3.0"
+    "@typescript-eslint/typescript-estree" "4.3.0"
+    eslint-scope "^5.0.0"
+    eslint-utils "^2.0.0"
+
+"@typescript-eslint/experimental-utils@^4.0.1":
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-4.1.0.tgz#263d7225645c09a411c8735eeffd417f50f49026"
   integrity sha512-paEYLA37iqRIDPeQwAmoYSiZ3PiHsaAc3igFeBTeqRHgPnHjHLJ9OGdmP6nwAkF65p2QzEsEBtpjNUBWByNWzA==
@@ -2886,6 +2898,16 @@
     "@typescript-eslint/typescript-estree" "4.1.0"
     debug "^4.1.1"
 
+"@typescript-eslint/parser@^4.2.0":
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-4.3.0.tgz#684fc0be6551a2bfcb253991eec3c786a8c063a3"
+  integrity sha512-JyfRnd72qRuUwItDZ00JNowsSlpQGeKfl9jxwO0FHK1qQ7FbYdoy5S7P+5wh1ISkT2QyAvr2pc9dAemDxzt75g==
+  dependencies:
+    "@typescript-eslint/scope-manager" "4.3.0"
+    "@typescript-eslint/types" "4.3.0"
+    "@typescript-eslint/typescript-estree" "4.3.0"
+    debug "^4.1.1"
+
 "@typescript-eslint/scope-manager@4.1.0":
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-4.1.0.tgz#9e389745ee9cfe12252ed1e9958808abd6b3a683"
@@ -2894,11 +2916,24 @@
     "@typescript-eslint/types" "4.1.0"
     "@typescript-eslint/visitor-keys" "4.1.0"
 
+"@typescript-eslint/scope-manager@4.3.0":
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-4.3.0.tgz#c743227e087545968080d2362cfb1273842cb6a7"
+  integrity sha512-cTeyP5SCNE8QBRfc+Lgh4Xpzje46kNUhXYfc3pQWmJif92sjrFuHT9hH4rtOkDTo/si9Klw53yIr+djqGZS1ig==
+  dependencies:
+    "@typescript-eslint/types" "4.3.0"
+    "@typescript-eslint/visitor-keys" "4.3.0"
+
 "@typescript-eslint/types@4.1.0":
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-4.1.0.tgz#edbd3fec346f34e13ce7aa176b03b497a32c496a"
   integrity sha512-rkBqWsO7m01XckP9R2YHVN8mySOKKY2cophGM8K5uDK89ArCgahItQYdbg/3n8xMxzu2elss+an1TphlUpDuJw==
 
+"@typescript-eslint/types@4.3.0":
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-4.3.0.tgz#1f0b2d5e140543e2614f06d48fb3ae95193c6ddf"
+  integrity sha512-Cx9TpRvlRjOppGsU6Y6KcJnUDOelja2NNCX6AZwtVHRzaJkdytJWMuYiqi8mS35MRNA3cJSwDzXePfmhU6TANw==
+
 "@typescript-eslint/typescript-estree@4.1.0":
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-4.1.0.tgz#394046ead25164494218c0e3d6b960695ea967f6"
@@ -2913,6 +2948,20 @@
     semver "^7.3.2"
     tsutils "^3.17.1"
 
+"@typescript-eslint/typescript-estree@4.3.0":
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-4.3.0.tgz#0edc1068e6b2e4c7fdc54d61e329fce76241cee8"
+  integrity sha512-ZAI7xjkl+oFdLV/COEz2tAbQbR3XfgqHEGy0rlUXzfGQic6EBCR4s2+WS3cmTPG69aaZckEucBoTxW9PhzHxxw==
+  dependencies:
+    "@typescript-eslint/types" "4.3.0"
+    "@typescript-eslint/visitor-keys" "4.3.0"
+    debug "^4.1.1"
+    globby "^11.0.1"
+    is-glob "^4.0.1"
+    lodash "^4.17.15"
+    semver "^7.3.2"
+    tsutils "^3.17.1"
+
 "@typescript-eslint/visitor-keys@4.1.0":
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-4.1.0.tgz#b2d528c9484e7eda1aa4f86ccf0432fb16e4d545"
@@ -2921,6 +2970,14 @@
     "@typescript-eslint/types" "4.1.0"
     eslint-visitor-keys "^2.0.0"
 
+"@typescript-eslint/visitor-keys@4.3.0":
+  version "4.3.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-4.3.0.tgz#0e5ab0a09552903edeae205982e8521e17635ae0"
+  integrity sha512-xZxkuR7XLM6RhvLkgv9yYlTcBHnTULzfnw4i6+z2TGBLy9yljAypQaZl9c3zFvy7PNI7fYWyvKYtohyF8au3cw==
+  dependencies:
+    "@typescript-eslint/types" "4.3.0"
+    eslint-visitor-keys "^2.0.0"
+
 "@vue/babel-helper-vue-jsx-merge-props@^1.0.0":
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.0.0.tgz#048fe579958da408fb7a8b2a3ec050b50a661040"
@@ -5762,7 +5819,25 @@ eslint-config-airbnb-base@^14.2.0:
     object.assign "^4.1.0"
     object.entries "^1.1.2"
 
-eslint-import-resolver-node@^0.3.3:
+eslint-config-airbnb-typescript@^11.0.0:
+  version "11.0.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-airbnb-typescript/-/eslint-config-airbnb-typescript-11.0.0.tgz#c5a95f6b4b3be4f8791d8769b21f6cede340e428"
+  integrity sha512-9PtEcJow7ghv+NuqCg1huVB6X28QNxjGUeB7scIKXdBqY/z7IGg6EwMq0XJCKY5cZlOVLH+0WmKoC2HB9MszJA==
+  dependencies:
+    "@typescript-eslint/parser" "^4.2.0"
+    eslint-config-airbnb "^18.2.0"
+    eslint-config-airbnb-base "^14.2.0"
+
+eslint-config-airbnb@^18.2.0:
+  version "18.2.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-airbnb/-/eslint-config-airbnb-18.2.0.tgz#8a82168713effce8fc08e10896a63f1235499dcd"
+  integrity sha512-Fz4JIUKkrhO0du2cg5opdyPKQXOI2MvF8KUvN2710nJMT6jaRUpRE2swrJftAjVGL7T1otLM5ieo5RqS1v9Udg==
+  dependencies:
+    eslint-config-airbnb-base "^14.2.0"
+    object.assign "^4.1.0"
+    object.entries "^1.1.2"
+
+eslint-import-resolver-node@^0.3.4:
   version "0.3.4"
   resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.4.tgz#85ffa81942c25012d8231096ddf679c03042c717"
   integrity sha512-ogtf+5AB/O+nM6DIeBUNr2fuT7ot9Qg/1harBfBtaP13ekEWFQEEMP94BCB7zaNW3gyY+8SHYF00rnqYwXKWOA==
@@ -5805,17 +5880,17 @@ eslint-plugin-import-helpers@^1.1.0:
   resolved "https://registry.yarnpkg.com/eslint-plugin-import-helpers/-/eslint-plugin-import-helpers-1.1.0.tgz#ab5c3f33de2a2f461061e8a13b143e8499c3baa0"
   integrity sha512-a7l1Sj6hZybVHVkxVRVWm1WaAyk9yDjWvSVhUfnDR23i0vQ8RS1wv9k617qGIWPqkttzg299aEtx+bCHA2EoqQ==
 
-eslint-plugin-import@^2.22.0:
-  version "2.22.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.22.0.tgz#92f7736fe1fde3e2de77623c838dd992ff5ffb7e"
-  integrity sha512-66Fpf1Ln6aIS5Gr/55ts19eUuoDhAbZgnr6UxK5hbDx6l/QgQgx61AePq+BV4PP2uXQFClgMVzep5zZ94qqsxg==
+eslint-plugin-import@^2.22.1:
+  version "2.22.1"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.22.1.tgz#0896c7e6a0cf44109a2d97b95903c2bb689d7702"
+  integrity sha512-8K7JjINHOpH64ozkAhpT3sd+FswIZTfMZTjdx052pnWrgRCVfp8op9tbjpAk3DdUeI/Ba4C8OjdC0r90erHEOw==
   dependencies:
     array-includes "^3.1.1"
     array.prototype.flat "^1.2.3"
     contains-path "^0.1.0"
     debug "^2.6.9"
     doctrine "1.5.0"
-    eslint-import-resolver-node "^0.3.3"
+    eslint-import-resolver-node "^0.3.4"
     eslint-module-utils "^2.6.0"
     has "^1.0.3"
     minimatch "^3.0.4"
@@ -5848,15 +5923,15 @@ eslint-plugin-jsx-a11y@^6.3.1:
     jsx-ast-utils "^2.4.1"
     language-tags "^1.0.5"
 
-eslint-plugin-react-hooks@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.1.0.tgz#6323fbd5e650e84b2987ba76370523a60f4e7925"
-  integrity sha512-36zilUcDwDReiORXmcmTc6rRumu9JIM3WjSvV0nclHoUQ0CNrX866EwONvLR/UqaeqFutbAnVu8PEmctdo2SRQ==
+eslint-plugin-react-hooks@^4.1.2:
+  version "4.1.2"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.1.2.tgz#2eb53731d11c95826ef7a7272303eabb5c9a271e"
+  integrity sha512-ykUeqkGyUGgwTtk78C0o8UG2fzwmgJ0qxBGPp2WqRKsTwcLuVf01kTDRAtOsd4u6whX2XOC8749n2vPydP82fg==
 
-eslint-plugin-react@^7.20.6:
-  version "7.20.6"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.20.6.tgz#4d7845311a93c463493ccfa0a19c9c5d0fd69f60"
-  integrity sha512-kidMTE5HAEBSLu23CUDvj8dc3LdBU0ri1scwHBZjI41oDv4tjsWZKU7MQccFzH1QYPYhsnTF2ovh7JlcIcmxgg==
+eslint-plugin-react@^7.21.3:
+  version "7.21.3"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.21.3.tgz#71655d2af5155b19285ec929dd2cdc67a4470b52"
+  integrity sha512-OI4GwTCqyIb4ipaOEGLWdaOHCXZZydStAsBEPB2e1ZfNM37bojpgO1BoOQbFb0eLVz3QLDx7b+6kYcrxCuJfhw==
   dependencies:
     array-includes "^3.1.1"
     array.prototype.flatmap "^1.2.3"
@@ -5870,6 +5945,11 @@ eslint-plugin-react@^7.20.6:
     resolve "^1.17.0"
     string.prototype.matchall "^4.0.2"
 
+eslint-plugin-standard@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-standard/-/eslint-plugin-standard-4.0.1.tgz#ff0519f7ffaff114f76d1bd7c3996eef0f6e20b4"
+  integrity sha512-v/KBnfyaOMPmZc/dmc6ozOdWqekGp7bBGq4jLAecEfPGmfKiWS4sA8sC0LqiV9w5qmXAtXVn4M3p1jSyhY85SQ==
+
 eslint-scope@^4.0.3:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-4.0.3.tgz#ca03833310f6889a3264781aa82e63eb9cfe7848"