dbeaver/pro#4425 add controlled mode

webapp/packages/core-localization/src/locales/en.ts

@@ -98,6 +98,10 @@ export default [
   ['ui_no_items_placeholder', 'There are no items yet.'],
   ['ui_search_no_result_placeholder', 'No results have been found.'],
   ['ui_save_reminder', 'You have unsaved changes.'],
+  ['ui_discard_changes', 'Discard changes'],
+  ['ui_discard_changes_message', 'You have unsaved changes. Do you want to discard them?'],
+  ['ui_discard', 'Discard'],
+  ['ui_keep_editing', 'Keep editing'],
   ['ui_yes', 'Yes'],
   ['ui_no', 'No'],
   ['ui_select_all', 'Select all'],

webapp/packages/core-localization/src/locales/fr.ts

@@ -91,6 +91,10 @@ export default [
   ['ui_no_items_placeholder', "Il n'y a pas encore d'éléments."],
   ['ui_search_no_result_placeholder', 'Aucun résultat trouvé.'],
   ['ui_save_reminder', 'Vous avez des modifications non sauvegardées.'],
+  ['ui_discard_changes', 'Abandonner les modifications'],
+  ['ui_discard_changes_message', 'Vous avez des modifications non sauvegardées. Voulez-vous vraiment les abandonner?'],
+  ['ui_discard', 'Abandonner'],
+  ['ui_keep_editing', 'Continuer à modifier'],
   ['ui_yes', 'Oui'],
   ['ui_no', 'Non'],
   ['ui_select_all', 'Tout sélectionner'],

webapp/packages/core-localization/src/locales/it.ts

@@ -95,6 +95,10 @@ export default [
   ['ui_no_items_placeholder', 'Non ci sono ancora elementi.'],
   ['ui_search_no_result_placeholder', 'Nessun risultato trovato.'],
   ['ui_save_reminder', 'Ci sono modifiche non salvate.'],
+  ['ui_discard_changes', 'Scarta le modifiche'],
+  ['ui_discard_changes_message', 'Sei sicuro di voler scartare le modifiche?'],
+  ['ui_discard', 'Scarta'],
+  ['ui_keep_editing', 'Continua a modificare'],
   ['ui_yes', 'Sì'],
   ['ui_no', 'No'],
   ['ui_select_all', 'Select all'],

webapp/packages/core-localization/src/locales/ru.ts

@@ -95,6 +95,10 @@ export default [
   ['ui_no_items_placeholder', 'Вы еще ничего не добавили.'],
   ['ui_search_no_result_placeholder', 'По вашему запросу ничего не найдено.'],
   ['ui_save_reminder', 'У вас есть несохраненные изменения.'],
+  ['ui_discard_changes', 'Отменить изменения'],
+  ['ui_discard_changes_message', 'Вы собираетесь отменить несохраненные изменения. Вы уверены?'],
+  ['ui_discard', 'Отменить'],
+  ['ui_keep_editing', 'Продолжить редактирование'],
   ['ui_yes', 'Да'],
   ['ui_no', 'Нет'],
   ['ui_select_all', 'Выбрать все'],

webapp/packages/core-localization/src/locales/vi.ts

@@ -97,6 +97,10 @@ export default [
   ['ui_no_items_placeholder', 'Chưa có mục nào.'],
   ['ui_search_no_result_placeholder', 'Không tìm thấy kết quả.'],
   ['ui_save_reminder', 'Bạn có các thay đổi chưa được lưu.'],
+  ['ui_discard_changes', 'Bỏ qua các thay đổi'],
+  ['ui_discard_changes_message', 'Bạn sắp bỏ qua các thay đổi chưa được lưu. Bạn có chắc chắn không?'],
+  ['ui_discard', 'Bỏ qua'],
+  ['ui_keep_editing', 'Tiếp tục chỉnh sửa'],
   ['ui_yes', 'Có'],
   ['ui_no', 'Không'],
   ['ui_select_all', 'Chọn tất cả'],

webapp/packages/core-localization/src/locales/zh.ts

@@ -95,6 +95,10 @@ export default [
   ['ui_no_items_placeholder', '还没有项目'],
   ['ui_search_no_result_placeholder', '没有找到结果'],
   ['ui_save_reminder', '您有未保存的更改'],
+  ['ui_discard_changes', '放弃更改'],
+  ['ui_discard_changes_message', '您即将放弃未保存的更改。您确定吗?'],
+  ['ui_discard', '放弃'],
+  ['ui_keep_editing', '继续编辑'],
   ['ui_yes', '是'],
   ['ui_no', '否'],
   ['ui_select_all', '选择所有'],

webapp/packages/core-ui/src/Tabs/TabsState.tsx

@@ -64,8 +64,10 @@
   ...rest
 }: TabsStateProps<T>): React.ReactElement | null {
   const context = useDataContext();
   const props = useMemo(() => rest as any as T, [...Object.values(rest)]);
 
+  const controlled = currentTabId !== undefined;
+
   let displayed: string[] = [];
 
   if (container) {
@@ -85,11 +87,19 @@
   const [closeExecutor] = useState(() => new Executor<ITabData<T>>());
   const [openExecutor] = useState(() => new Executor<ITabData<T>>());
 
+  function select(id: string | null | undefined): void | undefined {
+    if (isNotNullDefined(id) && id !== currentTabId) {
+      openExecutor.execute({ tabId: id, props });
+    }
+  }
+
   const store = useTabStore({
     defaultSelectedId: selectedId ?? null,
     orientation,
     selectOnMove: false,
     focusLoop: false,
+    selectedId: controlled ? currentTabId : undefined,
+    setSelectedId: controlled ? select : undefined,
   });
 
   const selected = useStoreState(store, 'selectedId');
@@ -109,15 +119,15 @@
       selected,
       store,
       tabList,
+      controlled,
     },
   );
 
   useEffect(() => {
     if (isNotNullDefined(currentTabId)) {
-      dynamic.store.setSelectedId(currentTabId);
       dynamic.selectedId = currentTabId;
     }
   }, [currentTabId]);
 
   useEffect(() => {
     if (displayed.length > 0 && autoSelect) {
@@ -128,21 +138,26 @@
         dynamic.store.setSelectedId(displayed[0]);
       }
     }
   }, [displayed, autoSelect]);
 
   useExecutor({
     executor: openExecutor,
     handlers: [
       function openHandler(data, contexts) {
-        dynamic.open?.(data);
         if (dynamic.selectedId === data.tabId) {
           ExecutorInterrupter.interrupt(contexts);
           return;
         }
-        dynamic.selectedId = data.tabId;
-        if (dynamic.store.getState().selectedId !== data.tabId) {
-          dynamic.store.setSelectedId(data.tabId);
+
+        if (!dynamic.controlled) {
+          dynamic.selectedId = data.tabId;
+
+          if (dynamic.store.getState().selectedId !== data.tabId) {
+            dynamic.store.setSelectedId(data.tabId);
+          }
         }
+
+        dynamic.open?.(data);
       },
     ],
   });
@@ -159,6 +174,10 @@
   const currentSelectedId = selected;
 
   useEffect(() => {
+    if (controlled) {
+      return;
+    }
+
     if (!isNotNullDefined(currentSelectedId) || dynamic.selectedId === currentSelectedId) {
       return;
     }
@@ -167,7 +186,7 @@
       tabId: currentSelectedId,
       props,
     });
-  }, [currentSelectedId]);
+  }, [currentSelectedId, controlled]);
 
   const value = useObservableRef<ITabsContext<T>>(
     () => ({

webapp/packages/plugin-administration/src/ConfigurationWizard/ConfigurationWizardPagesBootstrapService.ts

@@ -104,7 +104,7 @@
       onLoad: () => {
         this.serverConfigurationFormStateManager.create();
       },
       onDeActivate: (configurationWizard, administration, nextAdministrationItem) => {
         // so onFinish can be called with all required data from the form during easy config mode
         if (configurationWizard) {
           return;
@@ -121,8 +121,10 @@
 
         if (!configurationWizard && state?.isChanged) {
           const { status } = await this.commonDialogService.open(ConfirmationDialog, {
-            title: 'ui_save_reminder',
-            message: 'ui_are_you_sure',
+            title: 'ui_discard_changes',
+            message: 'ui_discard_changes_message',
+            confirmActionText: 'ui_discard',
+            cancelActionText: 'ui_keep_editing',
           });
 
           if (status === DialogueStateResult.Rejected) {

webapp/packages/plugin-authentication-administration/src/Administration/Users/Teams/TeamsTable/TeamEdit.tsx

@@ -37,9 +37,10 @@ export const TeamEdit = observer<Props>(function TeamEdit({ item }) {
       async function closeHandler(event, contexts) {
         if (formState.isChanged && event === 'before') {
           const { status } = await commonDialogService.open(ConfirmationDialog, {
-            title: 'ui_save_reminder',
-            message: 'ui_are_you_sure',
-            confirmActionText: 'ui_yes',
+            title: 'ui_discard_changes',
+            message: 'ui_discard_changes_message',
+            confirmActionText: 'ui_discard',
+            cancelActionText: 'ui_keep_editing',
           });
 
           if (status === DialogueStateResult.Rejected) {

webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersAdministration.tsx

@@ -57,7 +57,7 @@ export const UsersAdministration: AdministrationItemContentComponent = observer(
   }
 
   return (
-    <TabsState selectedId={subName} autoSelect={false} container={usersAdministrationService.tabsContainer} lazy onChange={openSub}>
+    <TabsState currentTabId={subName} autoSelect={false} container={usersAdministrationService.tabsContainer} lazy onChange={openSub}>
       <ToolsPanel bottomBorder>
         <SContext registry={mainTabsRegistry}>
           <TabList

webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersAdministrationService.ts

@@ -9,9 +9,10 @@ import React from 'react';
 
 import { AdministrationItemService, type IAdministrationItem } from '@cloudbeaver/core-administration';
 import { type AdminUser, TeamsResource, UsersResource } from '@cloudbeaver/core-authentication';
-import { PlaceholderContainer } from '@cloudbeaver/core-blocks';
+import { ConfirmationDialog, PlaceholderContainer } from '@cloudbeaver/core-blocks';
 import { Bootstrap, injectable } from '@cloudbeaver/core-di';
 import { TabsContainer } from '@cloudbeaver/core-ui';
+import { CommonDialogService, DialogueStateResult } from '@cloudbeaver/core-dialogs';
 
 import { CreateTeamService } from './Teams/TeamsTable/CreateTeamService.js';
 import { EUsersAdministrationSub, UsersAdministrationNavigationService } from './UsersAdministrationNavigationService.js';
@@ -36,7 +37,7 @@ export interface IUserDetailsInfoProps {
   user: AdminUser;
 }
 
-@injectable(() => [AdministrationItemService, CreateUserService, TeamsResource, CreateTeamService, UsersResource])
+@injectable(() => [AdministrationItemService, CreateUserService, TeamsResource, CreateTeamService, UsersResource, CommonDialogService])
 export class UsersAdministrationService extends Bootstrap {
   readonly tabsContainer: TabsContainer;
   readonly userDetailsInfoPlaceholder: PlaceholderContainer<IUserDetailsInfoProps>;
@@ -49,6 +50,7 @@ export class UsersAdministrationService extends Bootstrap {
     private readonly teamsResource: TeamsResource,
     private readonly createTeamService: CreateTeamService,
     private readonly usersResource: UsersResource,
+    private readonly commonDialogService: CommonDialogService,
   ) {
     super();
     this.userDetailsInfoPlaceholder = new PlaceholderContainer();
@@ -66,10 +68,12 @@ export class UsersAdministrationService extends Bootstrap {
         },
         {
           name: EUsersAdministrationSub.Users,
+          canDeActivate: () => this.handleDeactivate(EUsersAdministrationSub.Users),
           onDeActivate: this.cancelUserCreate.bind(this),
         },
         {
           name: EUsersAdministrationSub.Teams,
+          canDeActivate: () => this.handleDeactivate(EUsersAdministrationSub.Teams),
           onActivate: this.loadTeams.bind(this),
           onDeActivate: this.cancelTeamCreate.bind(this),
         },
@@ -81,6 +85,30 @@ export class UsersAdministrationService extends Bootstrap {
     this.userDetailsInfoPlaceholder.add(UserCredentialsList, 0);
   }
 
+  private async handleDeactivate(sub: EUsersAdministrationSub) {
+    if (sub === EUsersAdministrationSub.Users || sub === EUsersAdministrationSub.Teams) {
+      const users = sub === EUsersAdministrationSub.Users;
+      const edited = users ? this.createUserService.state?.isChanged : this.createTeamService.data?.isChanged;
+
+      if (edited) {
+        const { status } = await this.commonDialogService.open(ConfirmationDialog, {
+          title: 'ui_discard_changes',
+          message: 'ui_discard_changes_message',
+          confirmActionText: 'ui_discard',
+          cancelActionText: 'ui_keep_editing',
+        });
+
+        if (status === DialogueStateResult.Rejected) {
+          return false;
+        }
+      }
+
+      return true;
+    }
+
+    return true;
+  }
+
   private cancelUserCreate(param: string | null, configurationWizard: boolean, outside: boolean) {
     if (param === 'create') {
       this.createUserService.close();

webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UserEdit.tsx

@@ -39,9 +39,10 @@ export const UserEdit = observer<TableItemExpandProps<string>>(function UserEdit
       async function closeHandler(event, contexts) {
         if (state.isChanged && event === 'before') {
           const { status } = await commonDialogService.open(ConfirmationDialog, {
-            title: 'ui_save_reminder',
-            message: 'ui_are_you_sure',
-            confirmActionText: 'ui_yes',
+            title: 'ui_discard_changes',
+            message: 'ui_discard_changes_message',
+            confirmActionText: 'ui_discard',
+            cancelActionText: 'ui_keep_editing',
           });
 
           if (status === DialogueStateResult.Rejected) {

webapp/packages/plugin-connection-search/src/Search/ConnectionSearchService.ts

@@ -134,9 +134,10 @@ export class ConnectionSearchService {
     }
 
     const { status } = await this.commonDialogService.open(ConfirmationDialog, {
-      title: 'plugin_connections_connection_edit_cancel_title',
-      message: 'plugin_connections_connection_edit_cancel_message',
-      confirmActionText: 'ui_processing_ok',
+      title: 'ui_discard_changes',
+      message: 'ui_discard_changes_message',
+      confirmActionText: 'ui_discard',
+      cancelActionText: 'ui_keep_editing',
     });
 
     return status !== DialogueStateResult.Rejected;

webapp/packages/plugin-connections/src/PublicConnectionForm/PublicConnectionFormService.ts

@@ -136,7 +136,7 @@
     return this.formState ? getConnectionFormOptionsPart(this.formState) : null;
   }
 
   private readonly closeRemoved: IExecutorHandler<ResourceKey<IConnectionInfoParams>> = (data, contexts) => {
     if (!this.formState || !this.optionsPart?.connectionKey) {
       return;
     }
@@ -146,7 +146,7 @@
     }
   };
 
   private readonly closeDeleted: IExecutorHandler<ResourceKeySimple<IConnectionInfoParams>> = (data, contexts) => {
     if (!this.formState || !this.optionsPart?.connectionKey) {
       return;
     }
@@ -183,9 +183,10 @@
     }
 
     const { status } = await this.commonDialogService.open(ConfirmationDialog, {
-      title: 'plugin_connections_connection_edit_cancel_title',
-      message: 'plugin_connections_connection_edit_cancel_message',
-      confirmActionText: 'ui_processing_ok',
+      title: 'ui_discard_changes',
+      message: 'ui_discard_changes_message',
+      confirmActionText: 'ui_discard',
+      cancelActionText: 'ui_keep_editing',
     });
 
     return status !== DialogueStateResult.Rejected;

webapp/packages/plugin-connections/src/locales/en.ts

@@ -13,8 +13,6 @@ export default [
   ['plugin_connections_connection_edit_menu_item_title', 'Edit Connection'],
   ['plugin_connections_connection_clone', 'Clone'],
   ['plugin_connections_connection_clone_error', 'Failed to clone connection'],
-  ['plugin_connections_connection_edit_cancel_title', 'Cancel confirmation'],
-  ['plugin_connections_connection_edit_cancel_message', "You're going to cancel connection changes. Unsaved changes will be lost. Are you sure?"],
   ['plugin_connections_connection_edit_reconnect_title', 'Connection updated'],
   ['plugin_connections_connection_edit_reconnect_message', 'Connection has been updated. Do you want to reconnect?'],
   ['plugin_connections_connection_edit_reconnect_failed', 'Failed to reconnect'],

webapp/packages/plugin-connections/src/locales/fr.ts

@@ -11,11 +11,6 @@ export default [
   ['plugin_connections_new_connection_dialog_title', 'Nouvelle connexion'],
 
   ['plugin_connections_connection_edit_menu_item_title', 'Modifier la connexion'],
-  ['plugin_connections_connection_edit_cancel_title', "Confirmation d'annulation"],
-  [
-    'plugin_connections_connection_edit_cancel_message',
-    'Vous allez annuler les modifications de la connexion. Les modifications non enregistrées seront perdues. Êtes-vous sûr ?',
-  ],
   ['plugin_connections_connection_edit_reconnect_title', 'Connexion mise à jour'],
   ['plugin_connections_connection_edit_reconnect_message', 'La connexion a été mise à jour. Voulez-vous vous reconnecter ?'],
   ['plugin_connections_connection_edit_reconnect_failed', 'Échec de la reconnexion'],

webapp/packages/plugin-connections/src/locales/it.ts

@@ -13,11 +13,6 @@ export default [
   ['plugin_connections_connection_edit_menu_item_title', 'Modifica Connessione'],
   ['plugin_connections_connection_clone', 'Clona'],
   ['plugin_connections_connection_clone_error', 'Impossibile clonare la connessione'],
-  ['plugin_connections_connection_edit_cancel_title', "Conferma l'annullamento"],
-  [
-    'plugin_connections_connection_edit_cancel_message',
-    'Stai per annullare le modifiche alla connessione. Modifiche non salvate saranno perse. Sei sicuro?',
-  ],
   ['plugin_connections_connection_edit_reconnect_title', 'Connection updated'],
   ['plugin_connections_connection_edit_reconnect_message', 'Connection has been updated. Do you want to reconnect?'],
   ['plugin_connections_connection_edit_reconnect_failed', 'Failed to reconnect'],

webapp/packages/plugin-connections/src/locales/ru.ts

@@ -13,8 +13,6 @@ export default [
   ['plugin_connections_connection_edit_menu_item_title', 'Изменить подключение'],
   ['plugin_connections_connection_clone', 'Клонировать'],
   ['plugin_connections_connection_clone_error', 'Не удалось клонировать подключение'],
-  ['plugin_connections_connection_edit_cancel_title', 'Отмена редактирования'],
-  ['plugin_connections_connection_edit_cancel_message', 'Вы собираетесь закрыть редактор, несохраненные изменения не будут применены. Вы уверены?'],
   ['plugin_connections_connection_edit_reconnect_title', 'Подключение обновлено'],
   ['plugin_connections_connection_edit_reconnect_message', 'Подключение было обновлено. Вы хотите переподключиться?'],
   ['plugin_connections_connection_edit_reconnect_failed', 'Не удалось переподключиться'],

webapp/packages/plugin-connections/src/locales/vi.ts

@@ -13,8 +13,6 @@ export default [
   ['plugin_connections_connection_edit_menu_item_title', 'Chỉnh sửa Kết nối'],
   ['plugin_connections_connection_clone', 'Sao chép'],
   ['plugin_connections_connection_clone_error', 'Không thể sao chép kết nối'],
-  ['plugin_connections_connection_edit_cancel_title', 'Xác nhận Hủy'],
-  ['plugin_connections_connection_edit_cancel_message', 'Bạn sắp hủy các thay đổi của kết nối. Các thay đổi chưa lưu sẽ bị mất. Bạn có chắc không?'],
   ['plugin_connections_connection_edit_reconnect_title', 'Kết nối đã được cập nhật'],
   ['plugin_connections_connection_edit_reconnect_message', 'Kết nối đã được cập nhật. Bạn có muốn kết nối lại không?'],
   ['plugin_connections_connection_edit_reconnect_failed', 'Không thể kết nối lại'],

webapp/packages/plugin-connections/src/locales/zh.ts

@@ -13,8 +13,6 @@ export default [
   ['plugin_connections_connection_edit_menu_item_title', '编辑连接'],
   ['plugin_connections_connection_clone', '克隆'],
   ['plugin_connections_connection_clone_error', '克隆连接失败'],
-  ['plugin_connections_connection_edit_cancel_title', '取消确认'],
-  ['plugin_connections_connection_edit_cancel_message', '您将取消连接更改。未保存的更改将丢失。您确定吗？'],
   ['plugin_connections_connection_edit_reconnect_title', '连接已更新'],
   ['plugin_connections_connection_edit_reconnect_message', '连接已更新。您想重新连接吗？'],
   ['plugin_connections_connection_edit_reconnect_failed', '重新连接失败'],

webapp/packages/plugin-settings-administration/package.json

@@ -25,6 +25,7 @@
     "@cloudbeaver/core-administration": "workspace:*",
     "@cloudbeaver/core-blocks": "workspace:*",
     "@cloudbeaver/core-di": "workspace:*",
+    "@cloudbeaver/core-dialogs": "workspace:*",
     "@cloudbeaver/core-events": "workspace:*",
     "@cloudbeaver/core-localization": "workspace:*",
     "@cloudbeaver/core-settings": "workspace:*",