diff --git a/webapp/packages/core-app/src/shared/SqlGenerators/SqlGeneratorsBootstrap.ts b/webapp/packages/core-app/src/shared/SqlGenerators/SqlGeneratorsBootstrap.ts index d503d343d3..252a9865ff 100644 --- a/webapp/packages/core-app/src/shared/SqlGenerators/SqlGeneratorsBootstrap.ts +++ b/webapp/packages/core-app/src/shared/SqlGenerators/SqlGeneratorsBootstrap.ts @@ -76,14 +76,21 @@ export class SqlGeneratorsBootstrap extends Bootstrap { return [ ...items, - ...actions.map(action => new MenuBaseItem(action.id, action.label, action.description, { - onSelect: () => { - this.commonDialogService.open(GeneratedSqlDialog, { - generatorId: action.id, - pathId: node.id, - }); - }, - })), + ...actions.map(action => new MenuBaseItem( + { + id: action.id, + label: action.label, + tooltip: action.description, + }, + { + onSelect: () => { + this.commonDialogService.open(GeneratedSqlDialog, { + generatorId: action.id, + pathId: node.id, + }); + }, + } + )), ]; }, }); diff --git a/webapp/packages/core-view/src/Menu/MenuItem/IMenuBaseItem.ts b/webapp/packages/core-view/src/Menu/MenuItem/IMenuBaseItem.ts index d32bc8b5e9..413ff5d17b 100644 --- a/webapp/packages/core-view/src/Menu/MenuItem/IMenuBaseItem.ts +++ b/webapp/packages/core-view/src/Menu/MenuItem/IMenuBaseItem.ts @@ -8,10 +8,19 @@ import type { IMenuItem } from './IMenuItem'; -export interface IMenuBaseItem extends IMenuItem { - label: string; +interface IMenuBaseItemCommonProperties { + label?: string; icon?: string; tooltip?: string; hidden?: boolean; disabled?: boolean; } + +export interface IMenuBaseItemOptions extends IMenuBaseItemCommonProperties { + id: string; + label: string; +} + +export interface IMenuBaseItem extends IMenuItem, IMenuBaseItemCommonProperties { + label: string; +} diff --git a/webapp/packages/core-view/src/Menu/MenuItem/MenuBaseItem.ts b/webapp/packages/core-view/src/Menu/MenuItem/MenuBaseItem.ts index 6d150f45fd..052669cbc0 100644 --- a/webapp/packages/core-view/src/Menu/MenuItem/MenuBaseItem.ts +++ b/webapp/packages/core-view/src/Menu/MenuItem/MenuBaseItem.ts @@ -6,10 +6,14 @@ * you may not use this file except in compliance with the License. */ -import type { IMenuBaseItem } from './IMenuBaseItem'; +import type { IMenuBaseItem, IMenuBaseItemOptions } from './IMenuBaseItem'; import type { IMenuItemEvents } from './IMenuItem'; import { MenuItem } from './MenuItem'; +interface IMenuBaseItemPropertyGetters { + isDisabled?: () => boolean; +} + export class MenuBaseItem extends MenuItem implements IMenuBaseItem { private readonly isDisabled?: () => boolean; @@ -23,15 +27,14 @@ export class MenuBaseItem extends MenuItem implements IMenuBaseItem { } constructor( - id: string, - label: string, - tooltip?: string, + options: IMenuBaseItemOptions, events?: IMenuItemEvents, - isDisabled?: () => boolean + getters?: IMenuBaseItemPropertyGetters, ) { - super(id, events); - this.label = label; - this.tooltip = tooltip; - this.isDisabled = isDisabled; + super(options.id, events); + this.label = options.label; + this.icon = options.icon; + this.tooltip = options.tooltip; + this.isDisabled = getters?.isDisabled; } } diff --git a/webapp/packages/plugin-administration/src/PluginBootstrap.ts b/webapp/packages/plugin-administration/src/PluginBootstrap.ts index 6229ed7514..82a05ea1fa 100644 --- a/webapp/packages/plugin-administration/src/PluginBootstrap.ts +++ b/webapp/packages/plugin-administration/src/PluginBootstrap.ts @@ -26,7 +26,7 @@ export class PluginBootstrap extends Bootstrap { register(): void { this.menuService.addCreator({ - isApplicable: (context) => context.get(DATA_CONTEXT_MENU) === TOP_NAV_BAR_SETTINGS_MENU, + isApplicable: context => context.get(DATA_CONTEXT_MENU) === TOP_NAV_BAR_SETTINGS_MENU, getItems: (context, items) => { const administrationScreen = this.screenService.isActive(AdministrationScreenService.screenName); @@ -34,24 +34,28 @@ export class PluginBootstrap extends Bootstrap { return [ ...items, new MenuBaseItem( - 'administrationMenuEnter', - 'administration_menu_enter', - 'administration_menu_enter', + { + id: 'administrationMenuEnter', + label: 'administration_menu_enter', + tooltip: 'administration_menu_enter', + }, { onSelect: () => this.administrationScreenService.navigateToRoot() } - ) - ] + ), + ]; } if (administrationScreen) { return [ ...items, new MenuBaseItem( - 'administrationMenuBack', - 'administration_menu_back', - 'administration_menu_back', + { + id: 'administrationMenuBack', + label: 'administration_menu_back', + tooltip: 'administration_menu_back', + }, { onSelect: () => this.screenService.navigateToRoot() } - ) - ] + ), + ]; } return items; @@ -65,7 +69,7 @@ export class PluginBootstrap extends Bootstrap { } return items; - } + }, }); } diff --git a/webapp/packages/plugin-authentication/src/PluginBootstrap.ts b/webapp/packages/plugin-authentication/src/PluginBootstrap.ts index 819dd469c0..7934ce6063 100644 --- a/webapp/packages/plugin-authentication/src/PluginBootstrap.ts +++ b/webapp/packages/plugin-authentication/src/PluginBootstrap.ts @@ -29,36 +29,40 @@ export class PluginBootstrap extends Bootstrap { register(): void { this.menuService.addCreator({ - isApplicable: (context) => context.get(DATA_CONTEXT_MENU) === TOP_NAV_BAR_SETTINGS_MENU, + isApplicable: context => context.get(DATA_CONTEXT_MENU) === TOP_NAV_BAR_SETTINGS_MENU, getItems: (context, items) => { if (this.serverConfigResource.enabledAuthProviders.length > 0 && !this.authInfoService.userInfo) { return [ ...items, new MenuBaseItem( - 'login', - 'authentication_login', - 'authentication_login', + { + id: 'login', + label: 'authentication_login', + tooltip: 'authentication_login', + }, { onSelect: () => this.authDialogService.showLoginForm(false, null, true) } - ) - ] - }; + ), + ]; + } if (this.authInfoService.userInfo) { return [ ...items, new MenuBaseItem( - 'logout', - 'authentication_logout', - 'authentication_logout', + { + id: 'logout', + label: 'authentication_logout', + tooltip: 'authentication_logout', + }, { onSelect: this.authenticationService.logout.bind(this.authenticationService) } - ) - ] + ), + ]; } return items; }, orderItems: (context, items) => { - const index = items.findIndex(item => item.id === 'logout' || item.id === 'login') + const index = items.findIndex(item => item.id === 'logout' || item.id === 'login'); if (index > -1) { const item = items.splice(index, 1); @@ -66,7 +70,7 @@ export class PluginBootstrap extends Bootstrap { } return items; - } + }, }); } diff --git a/webapp/packages/plugin-localization/src/PluginBootstrap.ts b/webapp/packages/plugin-localization/src/PluginBootstrap.ts index 67438fee69..4c98e31b5b 100644 --- a/webapp/packages/plugin-localization/src/PluginBootstrap.ts +++ b/webapp/packages/plugin-localization/src/PluginBootstrap.ts @@ -7,8 +7,8 @@ */ import { Bootstrap, injectable } from '@cloudbeaver/core-di'; -import { ServerConfigResource } from '@cloudbeaver/core-root'; import { LocalizationService } from '@cloudbeaver/core-localization'; +import { ServerConfigResource } from '@cloudbeaver/core-root'; import { DATA_CONTEXT_MENU, MenuBaseItem, MenuService } from '@cloudbeaver/core-view'; import { TOP_NAV_BAR_SETTINGS_MENU } from '@cloudbeaver/plugin-settings-menu'; @@ -27,20 +27,21 @@ export class PluginBootstrap extends Bootstrap { register(): void | Promise { this.menuService.setHandler({ id: 'localization-menu', - isApplicable: (context) => context.get(DATA_CONTEXT_MENU) === LOCALIZATION_MENU, + isApplicable: context => context.get(DATA_CONTEXT_MENU) === LOCALIZATION_MENU, isLoading: () => this.serverConfigResource.isLoading(), handler: () => this.serverConfigResource.load(), - }) + }); this.menuService.addCreator({ - isApplicable: context => { - return context.get(DATA_CONTEXT_MENU) === TOP_NAV_BAR_SETTINGS_MENU && !!this.serverConfigResource.data?.supportedLanguages.length - }, + isApplicable: context => ( + context.get(DATA_CONTEXT_MENU) === TOP_NAV_BAR_SETTINGS_MENU + && !!this.serverConfigResource.data?.supportedLanguages.length + ), getItems(context, items) { return [ ...items, - LOCALIZATION_MENU - ] + LOCALIZATION_MENU, + ]; }, }); @@ -57,18 +58,20 @@ export class PluginBootstrap extends Bootstrap { const label = lang.nativeName || lang.isoCode; return new MenuBaseItem( - lang.isoCode, - label, - label, + { + id: lang.isoCode, + label, + tooltip: label, + }, { onSelect: () => this.localizationService.changeLocaleAsync(lang.isoCode) }, - () => this.localizationService.getCurrentLanguage() === lang.isoCode - ) - }) + { isDisabled: () => this.localizationService.getCurrentLanguage() === lang.isoCode } + ); + }); return [ ...items, - ...languages - ] + ...languages, + ]; }, }); } diff --git a/webapp/packages/plugin-product/src/ProductBootstrap.ts b/webapp/packages/plugin-product/src/ProductBootstrap.ts index 69535d0f1e..842be40ec3 100644 --- a/webapp/packages/plugin-product/src/ProductBootstrap.ts +++ b/webapp/packages/plugin-product/src/ProductBootstrap.ts @@ -8,8 +8,8 @@ import { Bootstrap, injectable } from '@cloudbeaver/core-di'; import { CommonDialogService } from '@cloudbeaver/core-dialogs'; -import { DATA_CONTEXT_MENU, MenuBaseItem, MenuService } from '@cloudbeaver/core-view'; import { ServerConfigResource } from '@cloudbeaver/core-root'; +import { DATA_CONTEXT_MENU, MenuBaseItem, MenuService } from '@cloudbeaver/core-view'; import { TOP_NAV_BAR_SETTINGS_MENU } from '@cloudbeaver/plugin-settings-menu'; import { ProductInfoDialog } from './ProductInfoDialog'; @@ -26,18 +26,23 @@ export class ProductBootstrap extends Bootstrap { register(): void | Promise { this.menuService.addCreator({ - isApplicable: (context) => { - return context.get(DATA_CONTEXT_MENU) === TOP_NAV_BAR_SETTINGS_MENU && !!this.serverConfigResource.data?.productInfo - }, + isApplicable: context => ( + context.get(DATA_CONTEXT_MENU) === TOP_NAV_BAR_SETTINGS_MENU + && !!this.serverConfigResource.data?.productInfo + ), getItems: (context, items) => [ ...items, new MenuBaseItem( - 'productInfo', - 'app_product_info', - 'app_product_info', - { onSelect: () => this.commonDialogService.open(ProductInfoDialog, null) } - ) - ] + { + id: 'productInfo', + label: 'app_product_info', + tooltip: 'app_product_info', + }, + { + onSelect: () => this.commonDialogService.open(ProductInfoDialog, null), + } + ), + ], }); } diff --git a/webapp/packages/plugin-theme/src/PluginBootstrap.ts b/webapp/packages/plugin-theme/src/PluginBootstrap.ts index a47a28f078..c917ddf02c 100644 --- a/webapp/packages/plugin-theme/src/PluginBootstrap.ts +++ b/webapp/packages/plugin-theme/src/PluginBootstrap.ts @@ -24,36 +24,41 @@ export class PluginBootstrap extends Bootstrap { register(): void | Promise { this.menuService.addCreator({ - isApplicable: (context) => { - return context.get(DATA_CONTEXT_MENU) === TOP_NAV_BAR_SETTINGS_MENU && this.themeService.themes.length > 0; - }, + isApplicable: context => ( + context.get(DATA_CONTEXT_MENU) === TOP_NAV_BAR_SETTINGS_MENU + && this.themeService.themes.length > 0 + ), getItems(context, items) { return [ ...items, - THEME_MENU - ] + THEME_MENU, + ]; }, }); this.menuService.addCreator({ isApplicable(context) { - return context.get(DATA_CONTEXT_MENU) === THEME_MENU + return context.get(DATA_CONTEXT_MENU) === THEME_MENU; }, getItems: (context, items) => { const themes = this.themeService.themes.map(theme => new MenuBaseItem( - theme.id, - theme.name, - theme.name, { - onSelect: () => this.themeService.changeTheme(theme.id) + id: theme.id, + label: theme.name, + tooltip: theme.name, }, - () => this.themeService.currentThemeId === theme.id, - )) + { + onSelect: () => this.themeService.changeTheme(theme.id), + }, + { + isDisabled: () => this.themeService.currentThemeId === theme.id, + } + )); return [ ...items, - ...themes - ] + ...themes, + ]; }, }); }