refactor: migrate to pure esm CB-5684 (#2929)

* refactor: migrate to pure esm

* chore: revert `useDefineForClassFields` tsconf

* chore: remove patch.js

webapp/package.json

@@ -1,6 +1,7 @@
 {
   "name": "cloudbeaver-ce",
   "version": "1.0.0",
+  "type": "module",
   "private": true,
   "workspaces": {
     "packages": [

webapp/packages/core-administration/package.json

@@ -1,5 +1,6 @@
 {
   "name": "@cloudbeaver/core-administration",
+  "type": "module",
   "sideEffects": [
     "src/**/*.css",
     "src/**/*.scss",

webapp/packages/core-administration/src/AdministrationItem/AdministrationItemService.ts

@@ -8,13 +8,18 @@
 import { makeObservable, observable } from 'mobx';
 
 import { injectable } from '@cloudbeaver/core-di';
-import { Executor, IExecutor, IExecutorHandler } from '@cloudbeaver/core-executor';
+import { Executor, type IExecutor, type IExecutorHandler } from '@cloudbeaver/core-executor';
 import type { RouterState } from '@cloudbeaver/core-routing';
 
-import { filterConfigurationWizard } from './filterConfigurationWizard';
-import { AdministrationItemType, IAdministrationItem, IAdministrationItemOptions, IAdministrationItemSubItem } from './IAdministrationItem';
-import type { IAdministrationItemRoute } from './IAdministrationItemRoute';
-import { orderAdministrationItems } from './orderAdministrationItems';
+import { filterConfigurationWizard } from './filterConfigurationWizard.js';
+import {
+  AdministrationItemType,
+  type IAdministrationItem,
+  type IAdministrationItemOptions,
+  type IAdministrationItemSubItem,
+} from './IAdministrationItem.js';
+import type { IAdministrationItemRoute } from './IAdministrationItemRoute.js';
+import { orderAdministrationItems } from './orderAdministrationItems.js';
 
 interface IActivationData {
   screen: IAdministrationItemRoute;
@@ -112,14 +117,14 @@ export class AdministrationItemService {
       return onlyActive.name;
     }
 
-    return items[0].name;
+    return items[0]?.name || null;
   }
 
   getAdministrationItemRoute(state: RouterState, configurationMode = false): IAdministrationItemRoute {
     return {
-      item: state.params.item || this.getDefaultItem(configurationMode),
-      sub: state.params.sub || null,
-      param: state.params.param || null,
+      item: state.params['item'] || this.getDefaultItem(configurationMode),
+      sub: state.params['sub'] || null,
+      param: state.params['param'] || null,
     };
   }
 
@@ -162,7 +167,7 @@ export class AdministrationItemService {
     };
     const index = this.items.push(item);
 
-    return this.items[index - 1];
+    return this.items[index - 1]!;
   }
 
   async activate(screen: IAdministrationItemRoute, configurationWizard: boolean, outside: boolean, outsideAdminPage: boolean): Promise<void> {
@@ -241,7 +246,7 @@ export class AdministrationItemService {
         if (item === items.length) {
           break;
         }
-        await items[item].configurationWizardOptions?.onLoad?.();
+        await items[item]?.configurationWizardOptions?.onLoad?.();
         item++;
       }
     }

webapp/packages/core-administration/src/AdministrationItem/IAdministrationItem.ts

@@ -5,7 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
-import type { IRouteParams } from './IRouteParams';
+import type { IRouteParams } from './IRouteParams.js';
 
 export enum AdministrationItemType {
   Default,

webapp/packages/core-administration/src/AdministrationItem/filterConfigurationWizard.ts

@@ -5,7 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
-import { AdministrationItemType, IAdministrationItem } from './IAdministrationItem';
+import { AdministrationItemType, type IAdministrationItem } from './IAdministrationItem.js';
 
 export function filterConfigurationWizard(configurationWizard: boolean) {
   return (item: IAdministrationItem) =>

webapp/packages/core-administration/src/AdministrationItem/orderAdministrationItems.ts

@@ -5,7 +5,7 @@
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
  */
-import type { IAdministrationItem } from './IAdministrationItem';
+import type { IAdministrationItem } from './IAdministrationItem.js';
 
 export function orderAdministrationItems(configuration: boolean) {
   return (itemA: IAdministrationItem, itemB: IAdministrationItem): number => {

webapp/packages/core-administration/src/AdministrationLocaleService.ts

@@ -14,24 +14,22 @@ export class AdministrationLocaleService extends Bootstrap {
     super();
   }
 
-  register(): void | Promise<void> {
+  override register(): void {
     this.localizationService.addProvider(this.provider.bind(this));
   }
 
-  load(): void | Promise<void> {}
-
   private async provider(locale: string) {
     switch (locale) {
       case 'ru':
-        return (await import('./locales/ru')).default;
+        return (await import('./locales/ru.js')).default;
       case 'it':
-        return (await import('./locales/it')).default;
+        return (await import('./locales/it.js')).default;
       case 'zh':
-        return (await import('./locales/zh')).default;
+        return (await import('./locales/zh.js')).default;
       case 'fr':
-        return (await import('./locales/fr')).default;
+        return (await import('./locales/fr.js')).default;
       default:
-        return (await import('./locales/en')).default;
+        return (await import('./locales/en.js')).default;
     }
   }
 }

webapp/packages/core-administration/src/AdministrationScreen/AdministrationScreenService.ts

@@ -9,16 +9,16 @@ import { computed, makeObservable, observable } from 'mobx';
 
 import { injectable } from '@cloudbeaver/core-di';
 import { NotificationService } from '@cloudbeaver/core-events';
-import { Executor, IExecutor } from '@cloudbeaver/core-executor';
+import { Executor, type IExecutor } from '@cloudbeaver/core-executor';
 import { EAdminPermission, PermissionsService, ServerConfigResource, SessionPermissionsResource } from '@cloudbeaver/core-root';
-import { RouterState, ScreenService } from '@cloudbeaver/core-routing';
+import { type RouterState, ScreenService } from '@cloudbeaver/core-routing';
 import { StorageService } from '@cloudbeaver/core-storage';
-import { DefaultValueGetter, GlobalConstants, MetadataMap, schema } from '@cloudbeaver/core-utils';
+import { type DefaultValueGetter, GlobalConstants, MetadataMap, schema } from '@cloudbeaver/core-utils';
 
-import { AdministrationItemService } from '../AdministrationItem/AdministrationItemService';
-import type { IAdministrationItemRoute } from '../AdministrationItem/IAdministrationItemRoute';
-import type { IRouteParams } from '../AdministrationItem/IRouteParams';
-import { ADMINISTRATION_SCREEN_STATE_SCHEMA, type IAdministrationScreenInfo } from './IAdministrationScreenState';
+import { AdministrationItemService } from '../AdministrationItem/AdministrationItemService.js';
+import type { IAdministrationItemRoute } from '../AdministrationItem/IAdministrationItemRoute.js';
+import type { IRouteParams } from '../AdministrationItem/IRouteParams.js';
+import { ADMINISTRATION_SCREEN_STATE_SCHEMA, type IAdministrationScreenInfo } from './IAdministrationScreenState.js';
 
 const ADMINISTRATION_INFO = 'administration_info';
 
@@ -228,7 +228,7 @@ export class AdministrationScreenService {
   }
 
   async handleCanDeActivate(fromState: RouterState, toState: RouterState): Promise<boolean> {
-    if (!fromState.params.item) {
+    if (!fromState.params['item']) {
       return true;
     }
 
@@ -243,7 +243,7 @@ export class AdministrationScreenService {
   }
 
   async handleCanActivate(toState: RouterState, fromState: RouterState): Promise<boolean> {
-    if (!toState.params.item) {
+    if (!toState.params['item']) {
       return false;
     }
 

webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/ConfigurationWizardScreenService.ts

@@ -9,8 +9,8 @@ import { Dependency, injectable } from '@cloudbeaver/core-di';
 import { ServerConfigResource } from '@cloudbeaver/core-root';
 import { ScreenService } from '@cloudbeaver/core-routing';
 
-import { AdministrationScreenService } from '../AdministrationScreenService';
-import { ConfigurationWizardService } from './ConfigurationWizardService';
+import { AdministrationScreenService } from '../AdministrationScreenService.js';
+import { ConfigurationWizardService } from './ConfigurationWizardService.js';
 
 @injectable()
 export class ConfigurationWizardScreenService extends Dependency {

webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/ConfigurationWizardService.ts

@@ -10,11 +10,11 @@ import { computed, makeObservable } from 'mobx';
 import { injectable } from '@cloudbeaver/core-di';
 import { NotificationService } from '@cloudbeaver/core-events';
 
-import { AdministrationItemService, filterHiddenAdministrationItem } from '../../AdministrationItem/AdministrationItemService';
-import { filterConfigurationWizard } from '../../AdministrationItem/filterConfigurationWizard';
-import type { IAdministrationItem } from '../../AdministrationItem/IAdministrationItem';
-import { orderAdministrationItems } from '../../AdministrationItem/orderAdministrationItems';
-import { AdministrationScreenService } from '../AdministrationScreenService';
+import { AdministrationItemService, filterHiddenAdministrationItem } from '../../AdministrationItem/AdministrationItemService.js';
+import { filterConfigurationWizard } from '../../AdministrationItem/filterConfigurationWizard.js';
+import type { IAdministrationItem } from '../../AdministrationItem/IAdministrationItem.js';
+import { orderAdministrationItems } from '../../AdministrationItem/orderAdministrationItems.js';
+import { AdministrationScreenService } from '../AdministrationScreenService.js';
 
 @injectable()
 export class ConfigurationWizardService {
@@ -147,7 +147,7 @@ export class ConfigurationWizardService {
     }
 
     if (this.currentStepIndex - 1 >= 0) {
-      const step = this.steps[this.currentStepIndex - 1];
+      const step = this.steps[this.currentStepIndex - 1]!;
       this.administrationScreenService.navigateTo(step.name, step.configurationWizardOptions?.defaultRoute);
     }
   }

webapp/packages/core-administration/src/DataContext/DATA_CONTEXT_ADMINISTRATION_ITEM_ROUTE.ts

@@ -7,6 +7,6 @@
  */
 import { createDataContext } from '@cloudbeaver/core-data-context';
 
-import type { IAdministrationItemRoute } from '../AdministrationItem/IAdministrationItemRoute';
+import type { IAdministrationItemRoute } from '../AdministrationItem/IAdministrationItemRoute.js';
 
 export const DATA_CONTEXT_ADMINISTRATION_ITEM_ROUTE = createDataContext<IAdministrationItemRoute>('AdministrationItemRoute');

webapp/packages/core-administration/src/PermissionsResource.ts

@@ -8,7 +8,7 @@
 import { injectable } from '@cloudbeaver/core-di';
 import { CachedMapAllKey, CachedMapResource, resourceKeyList } from '@cloudbeaver/core-resource';
 import { SessionDataResource } from '@cloudbeaver/core-root';
-import { AdminObjectGrantInfoFragment, AdminPermissionInfoFragment, GraphQLService } from '@cloudbeaver/core-sdk';
+import { type AdminObjectGrantInfoFragment, type AdminPermissionInfoFragment, GraphQLService } from '@cloudbeaver/core-sdk';
 
 export type PermissionInfo = AdminPermissionInfoFragment;
 export type AdminObjectGrantInfo = AdminObjectGrantInfoFragment;

webapp/packages/core-administration/src/index.ts

@@ -1,12 +1,19 @@
-export * from './manifest';
-export * from './AdministrationItem/AdministrationItemService';
-export * from './AdministrationItem/filterConfigurationWizard';
-export * from './AdministrationItem/IAdministrationItem';
-export * from './AdministrationItem/IAdministrationItemRoute';
-export * from './AdministrationItem/IRouteParams';
-export * from './AdministrationItem/orderAdministrationItems';
-export * from './AdministrationScreen/AdministrationScreenService';
-export * from './AdministrationScreen/ConfigurationWizard/ConfigurationWizardService';
-export * from './DataContext/DATA_CONTEXT_ADMINISTRATION_ITEM_ROUTE';
-export * from './AdministrationLocaleService';
-export * from './PermissionsResource';
+/*
+ * CloudBeaver - Cloud Database Manager
+ * Copyright (C) 2020-2024 DBeaver Corp and others
+ *
+ * Licensed under the Apache License, Version 2.0.
+ * you may not use this file except in compliance with the License.
+ */
+export * from './manifest.js';
+export * from './AdministrationItem/AdministrationItemService.js';
+export * from './AdministrationItem/filterConfigurationWizard.js';
+export * from './AdministrationItem/IAdministrationItem.js';
+export * from './AdministrationItem/IAdministrationItemRoute.js';
+export * from './AdministrationItem/IRouteParams.js';
+export * from './AdministrationItem/orderAdministrationItems.js';
+export * from './AdministrationScreen/AdministrationScreenService.js';
+export * from './AdministrationScreen/ConfigurationWizard/ConfigurationWizardService.js';
+export * from './DataContext/DATA_CONTEXT_ADMINISTRATION_ITEM_ROUTE.js';
+export * from './AdministrationLocaleService.js';
+export * from './PermissionsResource.js';

webapp/packages/core-administration/src/manifest.ts

@@ -13,11 +13,11 @@ export const coreAdministrationManifest: PluginManifest = {
   },
 
   providers: [
-    () => import('./AdministrationItem/AdministrationItemService').then(m => m.AdministrationItemService),
-    () => import('./PermissionsResource').then(m => m.PermissionsResource),
-    () => import('./AdministrationScreen/AdministrationScreenService').then(m => m.AdministrationScreenService),
-    () => import('./AdministrationScreen/ConfigurationWizard/ConfigurationWizardService').then(m => m.ConfigurationWizardService),
-    () => import('./AdministrationScreen/ConfigurationWizard/ConfigurationWizardScreenService').then(m => m.ConfigurationWizardScreenService),
-    () => import('./AdministrationLocaleService').then(m => m.AdministrationLocaleService),
+    () => import('./AdministrationItem/AdministrationItemService.js').then(m => m.AdministrationItemService),
+    () => import('./PermissionsResource.js').then(m => m.PermissionsResource),
+    () => import('./AdministrationScreen/AdministrationScreenService.js').then(m => m.AdministrationScreenService),
+    () => import('./AdministrationScreen/ConfigurationWizard/ConfigurationWizardService.js').then(m => m.ConfigurationWizardService),
+    () => import('./AdministrationScreen/ConfigurationWizard/ConfigurationWizardScreenService.js').then(m => m.ConfigurationWizardScreenService),
+    () => import('./AdministrationLocaleService.js').then(m => m.AdministrationLocaleService),
   ],
 };

webapp/packages/core-app/package.json

@@ -1,5 +1,6 @@
 {
   "name": "@cloudbeaver/core-app",
+  "type": "module",
   "sideEffects": [
     "src/**/*.css",
     "src/**/*.scss",

webapp/packages/core-app/src/AppLocaleService.ts

@@ -14,24 +14,22 @@ export class AppLocaleService extends Bootstrap {
     super();
   }
 
-  register(): void | Promise<void> {
+  override register(): void {
     this.localizationService.addProvider(this.provider.bind(this));
   }
 
-  load(): void | Promise<void> {}
-
   private async provider(locale: string) {
     switch (locale) {
       case 'ru':
-        return (await import('./locales/ru')).default;
+        return (await import('./locales/ru.js')).default;
       case 'it':
-        return (await import('./locales/it')).default;
+        return (await import('./locales/it.js')).default;
       case 'zh':
-        return (await import('./locales/zh')).default;
+        return (await import('./locales/zh.js')).default;
       case 'fr':
-        return (await import('./locales/fr')).default;
+        return (await import('./locales/fr.js')).default;
       default:
-        return (await import('./locales/en')).default;
+        return (await import('./locales/en.js')).default;
     }
   }
 }

webapp/packages/core-app/src/AppScreen/AppScreen.tsx

@@ -10,8 +10,8 @@ import { memo } from 'react';
 import { Loader, Placeholder } from '@cloudbeaver/core-blocks';
 import { useService } from '@cloudbeaver/core-di';
 
-import { AppScreenService } from './AppScreenService';
-import { Main } from './Main';
+import { AppScreenService } from './AppScreenService.js';
+import { Main } from './Main.js';
 
 export const AppScreen = memo(function AppScreen() {
   const appScreenService = useService(AppScreenService);

webapp/packages/core-app/src/AppScreen/AppScreenBootstrap.ts

@@ -6,11 +6,11 @@
  * you may not use this file except in compliance with the License.
  */
 import { Bootstrap, injectable } from '@cloudbeaver/core-di';
-import { Executor, IExecutor } from '@cloudbeaver/core-executor';
+import { Executor, type IExecutor } from '@cloudbeaver/core-executor';
 import { ScreenService } from '@cloudbeaver/core-routing';
 
-import { AppScreen } from './AppScreen';
-import { AppScreenService } from './AppScreenService';
+import { AppScreen } from './AppScreen.js';
+import { AppScreenService } from './AppScreenService.js';
 
 @injectable()
 export class AppScreenBootstrap extends Bootstrap {
@@ -21,7 +21,7 @@ export class AppScreenBootstrap extends Bootstrap {
     this.activation = new Executor();
   }
 
-  register(): void {
+  override register(): void {
     this.screenService.create({
       name: AppScreenService.screenName,
       routes: [{ name: AppScreenService.screenName, path: '/' }],
@@ -32,6 +32,4 @@ export class AppScreenBootstrap extends Bootstrap {
       },
     });
   }
-
-  load(): void | Promise<void> {}
 }

webapp/packages/core-app/src/AppScreen/Main.tsx

@@ -12,7 +12,7 @@ import { useService } from '@cloudbeaver/core-di';
 import { LeftBarPanelService, SideBarPanel, SideBarPanelService } from '@cloudbeaver/core-ui';
 
 import style from './Main.module.css';
-import { RightArea } from './RightArea';
+import { RightArea } from './RightArea.js';
 
 export const Main = observer(function Main() {
   const styles = useS(style);

webapp/packages/core-app/src/AppScreen/RightArea.tsx

@@ -23,7 +23,7 @@ import {
 import { useService } from '@cloudbeaver/core-di';
 import { OptionsPanelService } from '@cloudbeaver/core-ui';
 
-import { AppScreenService } from './AppScreenService';
+import { AppScreenService } from './AppScreenService.js';
 import style from './RightArea.module.css';
 
 interface Props {

webapp/packages/core-app/src/Body.tsx

@@ -20,8 +20,8 @@ import { DNDProvider } from '@cloudbeaver/core-ui';
 import { useAppVersion } from '@cloudbeaver/core-version';
 
 import style from './Body.module.css';
-import { useAppHeight } from './useAppHeight';
-import { useClientActivity } from './useClientActivity';
+import { useAppHeight } from './useAppHeight.js';
+import { useClientActivity } from './useClientActivity.js';
 
 export const Body = observer(function Body() {
   // const serverConfigLoader = useResource(Body, ServerConfigResource, undefined);
@@ -41,7 +41,7 @@ export const Body = observer(function Body() {
     if (ref.current) {
       document.body.className = ref.current.className;
     }
-    document.documentElement.dataset.backendVersion = backendVersion;
+    document.documentElement.dataset['backendVersion'] = backendVersion;
   });
 
   useAppHeight();