feat(core-app): CB-1633 CB-1634 add key bindings

webapp/packages/core-app/src/NavigationTree/ElementsTree/ElementsTreeTools/ElementsTreeFilter.tsx

@@ -32,11 +32,13 @@ const filterStyle = composes(
 interface Props {
   tree: IElementsTree;
   style?: ComponentStyle;
+  className?: string;
 }
 
 export const ElementsTreeFilter = observer<Props>(function ElementsTreeFilter({
   tree,
   style,
+  className,
 }) {
   const [focusedRef] = useFocus<HTMLDivElement>({ focusFirstChild: true });
   const translate = useTranslate();
@@ -47,7 +49,7 @@ export const ElementsTreeFilter = observer<Props>(function ElementsTreeFilter({
   }
 
   return styled(styles)(
-    <filter-box ref={focusedRef} as='div'>
+    <filter-box ref={focusedRef} className={className} as='div'>
       <Filter
         placeholder={translate('app_navigationTree_search')}
         value={tree.filter}

webapp/packages/core-app/src/NavigationTree/ElementsTree/ElementsTreeTools/ElementsTreeTools.tsx

@@ -34,7 +34,7 @@ const toolsStyles = composes(
       composes: theme-text-primary from global;
     }
     tools {
-      composes: theme-background-surface from global;
+      composes: theme-background-surface theme-border-color-background from global;
     }
   `,
   css`
@@ -43,6 +43,11 @@ const toolsStyles = composes(
       position: sticky;
       top: 0;
       z-index: 1;
+
+      &> *:last-child:not(:first-child) {
+        border-bottom: solid 1px;
+        border-color: inherit;
+      }
     }
     actions {
       display: flex;

webapp/packages/core-app/src/NavigationTree/ElementsTree/ElementsTreeTools/NavigationTreeSettings/NavigationTreeSettings.tsx

@@ -34,18 +34,20 @@ interface Props {
   root: string;
   settings: IElementsTreeSettings;
   style?: ComponentStyle;
+  className?: string;
 }
 
 export const NavigationTreeSettings = observer<Props>(function NavigationTreeSettings({
   root,
   settings,
   style,
+  className,
 }) {
   const styles = useStyles(BASE_CONTAINERS_STYLES, expandStyles, style);
   const translate = useTranslate();
 
   return styled(styles)(
-    <settings>
+    <settings className={className}>
       <Group keepSize form gap dense>
         <GroupTitle>{translate('app_navigationTree_settings_title')}</GroupTitle>
         <Switch

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

@@ -34,9 +34,16 @@ export * from './shared/ToolsPanel/LogViewer/LogViewerService';
 
 export * from './shared/SessionExpireDialog/SessionExpiredDialogService';
 export * from './shared/SessionExpireWarningDialog/SessionExpireWarningDialogService';
+
 export * from './NavigationTree/ElementsTree/ElementsTreeTools/NavigationTreeSettings/createElementsTreeSettings';
+export * from './NavigationTree/ElementsTree/ElementsTreeTools/NavigationTreeSettings/DATA_CONTEXT_NAV_TREE_ROOT';
+export * from './NavigationTree/ElementsTree/ElementsTreeTools/NavigationTreeSettings/KEY_BINDING_ENABLE_FILTER';
+export * from './NavigationTree/ElementsTree/ACTION_LINK_OBJECT';
+export * from './NavigationTree/ElementsTree/DATA_CONTEXT_ELEMENTS_TREE';
 export * from './NavigationTree/ElementsTree/ElementsTree';
 export * from './NavigationTree/ElementsTree/ElementsTreeContext';
+export * from './NavigationTree/ElementsTree/KEY_BINDING_COLLAPSE_ALL';
+export * from './NavigationTree/ElementsTree/KEY_BINDING_LINK_OBJECT';
 export * from './NavigationTree/ElementsTree/MENU_NAV_TREE';
 export * from './NavigationTree/ElementsTree/NavigationNodeComponent';
 export * from './NavigationTree/ElementsTree/NavNodeFilterCompareFn';

webapp/packages/plugin-help/src/Shortcuts/SHORTCUTS_DATA.ts

@@ -6,6 +6,10 @@
  * you may not use this file except in compliance with the License.
  */
 
+
+import { KEY_BINDING_ENABLE_FILTER, KEY_BINDING_COLLAPSE_ALL, KEY_BINDING_LINK_OBJECT } from '@cloudbeaver/core-app';
+import { KEY_BINDING_OPEN_IN_TAB } from '@cloudbeaver/core-view';
+
 import type { IShortcut } from './IShortcut';
 
 export const DATA_VIEWER_SHORTCUTS: IShortcut[] = [
@@ -58,13 +62,21 @@ export const SQL_EDITOR_SHORTCUTS: IShortcut[] = [
   },
   {
     label: 'sql_editor_shortcut_open_editor_in_new_tab',
-    code: ['Alt + T'],
+    code: [KEY_BINDING_OPEN_IN_TAB.label],
   },
 ];
 
 export const NAVIGATION_TREE_SHORTCUTS: IShortcut[] = [
   {
     label: 'navigation_tree_shortcut_enable_filter',
-    code: ['Ctrl + F'],
+    code: [KEY_BINDING_ENABLE_FILTER.label],
+  },
+  {
+    label: 'app_navigationTree_action_collapse_all',
+    code: [KEY_BINDING_COLLAPSE_ALL.label],
+  },
+  {
+    label: 'app_navigationTree_action_link_with_editor',
+    code: [KEY_BINDING_LINK_OBJECT.label],
   },
 ];