CB-3332 shortcuts improvements (#3126)

* CB-3332 refactor: data-viewer shortcuts

move them to the plugin folder, make them IKeyBinding shape to use in transformKeys

* CB-3332 refactor: change ctrl hotkey to mod

* CB-3332 refactor: use new DATA_VIEWER_SHORTCUTS, don't replace backspace

* CB-3332 refactor: remove redundant shortcuts, update naming

* CB-3332 feat: introduce new shortcuts for rows managing

In order to let mac users use shortcuts, Insert key was changed to KeyR

* CB-3332 feat: move shift key to the beginning of all shortcuts

---------

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

webapp/packages/core-view/src/Action/KeyBinding/Bindings/KEY_BINDING_REDO.ts

@@ -9,6 +9,6 @@ import { createKeyBinding } from '../createKeyBinding.js';
 
 export const KEY_BINDING_REDO = createKeyBinding({
   id: 'redo',
-  keys: ['mod+y', 'mod+shift+z'],
+  keys: ['mod+y', 'shift+mod+z'],
   preventDefault: true,
 });

webapp/packages/plugin-data-spreadsheet-new/src/DataGrid/DATA_GRID_BINDINGS.ts

@@ -0,0 +1,29 @@
+/*
+ * 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.
+ */
+import type { IKeyBinding } from '@cloudbeaver/core-view';
+
+/* these consts are only used for the user interface in Shortcuts popup, actual bindings in DataGridTable.tsx */
+export const KEY_BINDING_REVERT_INLINE_EDITOR_CHANGES: IKeyBinding = {
+  id: 'data-viewer-revert-inline-editor-changes',
+  keys: ['Escape'],
+};
+
+export const KEY_BINDING_ADD_NEW_ROW: IKeyBinding = {
+  id: 'data-viewer-add-new-row',
+  keys: ['Alt+R'],
+};
+
+export const KEY_BINDING_DUPLICATE_ROW: IKeyBinding = {
+  id: 'data-viewer-duplicate-row',
+  keys: ['Shift+Alt+R'],
+};
+
+export const KEY_BINDING_DELETE_ROW: IKeyBinding = {
+  id: 'data-viewer-delete-row',
+  keys: ['Delete'],
+};

webapp/packages/plugin-data-spreadsheet-new/src/DataGrid/DataGridTable.tsx

@@ -248,9 +248,9 @@ export const DataGridTable = observer<IDataPresentationProps>(function DataGridT
         tableData.editor.revert(...activeElements);
         return;
       }
-      case 'Insert': {
+      case 'KeyR': {
         if (event.altKey) {
-          if (event.ctrlKey || event.metaKey) {
+          if (event.shiftKey) {
             tableData.editor.duplicate(...activeRows);
           } else {
             tableData.editor.add(cell);

webapp/packages/plugin-data-spreadsheet-new/src/index.ts

@@ -6,3 +6,4 @@
  * you may not use this file except in compliance with the License.
  */
 export * from './manifest.js';
+export * from './DataGrid/DATA_GRID_BINDINGS.js';

webapp/packages/plugin-help/package.json

@@ -29,6 +29,7 @@
     "@cloudbeaver/core-routing": "^0",
     "@cloudbeaver/core-utils": "^0",
     "@cloudbeaver/core-view": "^0",
+    "@cloudbeaver/plugin-data-spreadsheet-new": "^0",
     "@cloudbeaver/plugin-navigation-tree": "^0",
     "@cloudbeaver/plugin-sql-editor": "^0",
     "@cloudbeaver/plugin-top-app-bar": "^0",

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

@@ -7,6 +7,12 @@
  */
 import { getOS, OperatingSystem } from '@cloudbeaver/core-utils';
 import { getCommonAndOSSpecificKeys, type IKeyBinding, KEY_BINDING_OPEN_IN_TAB, KEY_BINDING_REDO, KEY_BINDING_UNDO } from '@cloudbeaver/core-view';
+import {
+  KEY_BINDING_ADD_NEW_ROW,
+  KEY_BINDING_DELETE_ROW,
+  KEY_BINDING_DUPLICATE_ROW,
+  KEY_BINDING_REVERT_INLINE_EDITOR_CHANGES,
+} from '@cloudbeaver/plugin-data-spreadsheet-new';
 import { KEY_BINDING_COLLAPSE_ALL, KEY_BINDING_ENABLE_FILTER, KEY_BINDING_LINK_OBJECT } from '@cloudbeaver/plugin-navigation-tree';
 import {
   KEY_BINDING_SQL_EDITOR_EXECUTE,
@@ -19,33 +25,21 @@ import {
 import type { IShortcut } from './IShortcut.js';
 
 export const DATA_VIEWER_SHORTCUTS: IShortcut[] = [
-  {
-    label: 'data_viewer_shortcut_start_inline_editing',
-    code: ['Enter', 'Backspace'],
-  },
   {
     label: 'data_viewer_shortcut_revert_inline_editor_changes',
-    code: ['Escape'],
+    code: transformKeys(KEY_BINDING_REVERT_INLINE_EDITOR_CHANGES),
   },
   {
     label: 'data_viewer_shortcut_add_new_row',
-    code: ['Alt + Insert'],
+    code: transformKeys(KEY_BINDING_ADD_NEW_ROW),
   },
   {
     label: 'data_viewer_shortcut_duplicate_row',
-    code: ['Ctrl + Alt + Insert'],
+    code: transformKeys(KEY_BINDING_DUPLICATE_ROW),
   },
   {
     label: 'data_viewer_shortcut_delete_row',
-    code: ['Delete'],
-  },
-  {
-    label: 'data_viewer_shortcut_past_value',
-    code: ['Ctrl + V'],
-  },
-  {
-    label: 'data_viewer_shortcut_copy_value',
-    code: ['Ctrl + C'],
+    code: transformKeys(KEY_BINDING_DELETE_ROW),
   },
 ];
 
@@ -112,7 +106,7 @@ function transformModToDisplayKey(key: string): string {
   }
 
   if (OS === OperatingSystem.macOS) {
-    return key.replace('MOD', 'CMD').replace('ALT', 'OPTION').replace('BACKSPACE', 'DELETE');
+    return key.replace('MOD', 'CMD').replace('ALT', 'OPTION');
   }
   return key;
 }

webapp/packages/plugin-help/tsconfig.json

@@ -39,6 +39,9 @@
     {
       "path": "../core-view/tsconfig.json"
     },
+    {
+      "path": "../plugin-data-spreadsheet-new/tsconfig.json"
+    },
     {
       "path": "../plugin-navigation-tree/tsconfig.json"
     },

webapp/packages/plugin-navigation-tree/src/NavigationTree/ElementsTree/ElementsTreeTools/NavigationTreeSettings/KEY_BINDING_ENABLE_FILTER.ts

@@ -9,6 +9,6 @@ import { createKeyBinding } from '@cloudbeaver/core-view';
 
 export const KEY_BINDING_ENABLE_FILTER = createKeyBinding({
   id: 'enable-filter',
-  keys: 'ctrl+f',
+  keys: 'mod+f',
   preventDefault: true,
 });

webapp/packages/plugin-navigation-tree/src/NavigationTree/ElementsTree/KEY_BINDING_COLLAPSE_ALL.ts

@@ -9,6 +9,6 @@ import { createKeyBinding } from '@cloudbeaver/core-view';
 
 export const KEY_BINDING_COLLAPSE_ALL = createKeyBinding({
   id: 'collapse-all',
-  keys: 'ctrl+shift+/',
+  keys: 'shift+ctrl+/',
   preventDefault: true,
 });

webapp/packages/plugin-navigation-tree/src/NavigationTree/ElementsTree/KEY_BINDING_LINK_OBJECT.ts

@@ -9,6 +9,6 @@ import { createKeyBinding } from '@cloudbeaver/core-view';
 
 export const KEY_BINDING_LINK_OBJECT = createKeyBinding({
   id: 'link-object',
-  keys: 'ctrl+shift+,',
+  keys: 'shift+ctrl+,',
   preventDefault: true,
 });

webapp/packages/plugin-sql-editor/src/actions/bindings/KEY_BINDING_SQL_EDITOR_EXECUTE.ts

@@ -9,6 +9,6 @@ import { createKeyBinding } from '@cloudbeaver/core-view';
 
 export const KEY_BINDING_SQL_EDITOR_EXECUTE = createKeyBinding({
   id: 'sql-editor-execute',
-  keys: 'ctrl+enter',
+  keys: 'mod+enter',
   preventDefault: true,
 });

webapp/packages/plugin-sql-editor/src/actions/bindings/KEY_BINDING_SQL_EDITOR_EXECUTE_NEW.ts

@@ -9,6 +9,6 @@ import { createKeyBinding } from '@cloudbeaver/core-view';
 
 export const KEY_BINDING_SQL_EDITOR_EXECUTE_NEW = createKeyBinding({
   id: 'sql-editor-execute-new',
-  keys: ['ctrl+\\', 'shift+ctrl+enter'],
+  keys: ['mod+\\', 'shift+mod+enter'],
   preventDefault: true,
 });

webapp/packages/plugin-sql-editor/src/actions/bindings/KEY_BINDING_SQL_EDITOR_FORMAT.ts

@@ -9,6 +9,6 @@ import { createKeyBinding } from '@cloudbeaver/core-view';
 
 export const KEY_BINDING_SQL_EDITOR_FORMAT = createKeyBinding({
   id: 'sql-editor-format',
-  keys: 'shift+ctrl+f',
+  keys: 'shift+mod+f',
   preventDefault: true,
 });

webapp/packages/plugin-sql-editor/src/actions/bindings/KEY_BINDING_SQL_EDITOR_SHOW_EXECUTION_PLAN.ts

@@ -9,6 +9,6 @@ import { createKeyBinding } from '@cloudbeaver/core-view';
 
 export const KEY_BINDING_SQL_EDITOR_SHOW_EXECUTION_PLAN = createKeyBinding({
   id: 'sql-editor-show-execution-plan',
-  keys: 'shift+ctrl+e',
+  keys: 'shift+mod+e',
   preventDefault: true,
 });