dbeaver/pro#6598 open panel on tab select (#3662)

Co-authored-by: Daria Marutkina <125263541+dariamarutkina@users.noreply.github.com>

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

@@ -7,7 +7,7 @@
  */
 import { observer } from 'mobx-react-lite';
 
-import { getComputed, Loader, Pane, ResizerControls, s, Split, useS, useSplitUserState } from '@cloudbeaver/core-blocks';
+import { getComputed, Loader, Pane, ResizerControls, s, Split, useExecutor, useS, useSplitUserState } from '@cloudbeaver/core-blocks';
 import { useService } from '@cloudbeaver/core-di';
 import { LeftBarPanelService, SideBarPanel, SideBarPanelService } from '@cloudbeaver/core-ui';
 
@@ -25,6 +25,17 @@ export const Main = observer(function Main() {
   const sideBarDisabled = getComputed(() => sideBarPanelService.tabsContainer.getDisplayed().length === 0);
   const leftBarDisabled = getComputed(() => leftBarPanelService.tabsContainer.getDisplayed().length === 0);
 
+  useExecutor({
+    executor: sideBarPanelService.tabsContainer.onTabSelect,
+    handlers: [
+      function showPanel() {
+        if (splitRightState.mode === 'minimize' && !sideBarDisabled) {
+          splitRightState.onModeChange?.('resize');
+        }
+      },
+    ],
+  });
+
   return (
     <Loader className={s(styles, { loader: true })} suspense>
       <main className={s(styles, { space: true })}>

webapp/packages/core-ui/src/SideBarPanel/SideBarPanel.tsx

@@ -42,10 +42,9 @@ const sideBarPanelRegistry: StyleRegistry = [
 
 export const SideBarPanel = observer<SideBarPanelProps>(function SideBarPanel({ container }) {
   const style = useS(styles);
-
   return (
     <SContext registry={sideBarPanelRegistry}>
-      <TabsState container={container} lazy>
+      <TabsState container={container} currentTabId={container.selectedId} lazy onChange={tab => container.select(tab.tabId, tab.props)}>
         <div className={s(style, { box: true })}>
           <TabList className={s(style, { tabList: true })} underline />
           <div className={s(style, { contentBox: true })}>

webapp/packages/core-ui/src/Tabs/TabsContainer/TabsContainer.ts

@@ -8,12 +8,14 @@
 import { makeObservable, observable } from 'mobx';
 
 import type { MetadataMap, MetadataValueGetter, schema } from '@cloudbeaver/core-utils';
+import { SyncExecutor } from '@cloudbeaver/core-executor';
 
 import type { ITabInfo, ITabInfoOptions, ITabsContainer } from './ITabsContainer.js';
 
 export class TabsContainer<TProps = void, TOptions extends Record<string, any> | unknown = unknown> implements ITabsContainer<TProps, TOptions> {
   readonly areaLabel: string;
   readonly tabInfoMap: Map<string, ITabInfo<TProps, TOptions>>;
+  readonly onTabSelect: SyncExecutor<string>;
 
   get tabInfoList(): Array<ITabInfo<TProps, TOptions>> {
     return Array.from(this.tabInfoMap.values()).sort((a, b) => a.order - b.order);
@@ -29,6 +31,7 @@ export class TabsContainer<TProps = void, TOptions extends Record<string, any> |
     this.tabInfoMap = new Map();
     this.currentTabId = null;
     this.areaLabel = areaLabel;
+    this.onTabSelect = new SyncExecutor();
 
     makeObservable<TabsContainer<TProps, TOptions>, 'currentTabId'>(this, {
       tabInfoMap: observable.shallow,
@@ -58,6 +61,7 @@ export class TabsContainer<TProps = void, TOptions extends Record<string, any> |
     });
 
     this.currentTabId = tabId;
+    this.onTabSelect.execute(tabId);
   }
 
   getTabInfo(tabId: string): ITabInfo<TProps, TOptions> | undefined {