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 ;
- }
const handleSelect = useCallback(
(item: string) => administrationScreenService.navigateToItem(item),
[administrationScreenService]
);
+
+ if (!usePermission(EAdminPermission.admin)) {
+ return ;
+ }
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 ;
- }
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 ;
+ }
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 {
const step = this.getStep(name);
if (!step) {
@@ -119,7 +120,7 @@ export class ConfigurationWizardService {
return true;
}
- async next() {
+ async next(): Promise {
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))(
onSelect(item.name)}
>
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 | 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)(