tbonelee opened a new pull request, #5080: URL: https://github.com/apache/zeppelin/pull/5080
### What is this PR for? Keyboard event handling logic is currently split between in `paragraph.component.ts`(Angular) and `code-editor.component.ts` (Monaco editor) in new UI. Since both Angular and the Monaco editor capture key events, the auctual handler depends on where the focus is. Refactoring this logic would improve cohesion and type safety, making the code more readable and less prone to bugs. #### Changes ##### Extracted keybinding logic into a separate module - Keybinding logic involves low-level event handling details, but it is not a core responsibility of the components. - To improve separation of concerns and reusability, I extracted the logic into a dedicated module: `@zeppelin/key-binding`. ##### Added a keybinding coverter - Introduced a converter from Angular keybindings to Monaco editor keybindings. - This allows keybindings defined once in `shortcuts-map.ts` to be reused for both Angular and Monaco editor handlers. ##### Unified keybinding handling in a single class - Initialization of keybinding handlers for both Angular and Monaco editor is now managed by a new `KeyBinder` class. - A `KeyBinder` instance is created in each `ParagraphComponent`. - Angular handlers are registerd during `ParagraphComponent` initialization, while Monaco handlers are registered when the editor is initialized (triggered by the `initKeyBindings` emitter in `NotebookParagraphCodeEditorComponent`). - All handlers simpley emit the appropriate action key to an RxJS `Subject` within `KeyBinder`. ##### Categorized handler for each action between Angular and Monaco editor at type level. - All actions are mapped to corresponding handler method name via `ParagraphActionToHandlerName`. Each actions must be explicitly specified as a key at the type level, and each value must be one of the method names from `NotebookParagraphKeyboardEventHandler`. - The `MonacoKeyboardEventHandler` type defines method names for some actions, while the rest are defined in `AngularKeyboardEventHandler`. Both are subtypes of `NotebookParagraphKeyboardEventHandler` and the methods in each type are mutually exclusive. - `NotebookParagraphCodeEditorComponent` implements the Monaco handler, and `ParagraphComponent` implements the Angular handler. - Both handler implementation receives an `action` parameter via` handleKeyEvent(action, event)`, then look up the corresponding method in `ParagraphActionToHandlerName` using the `action` value. ### What type of PR is it? Refactoring ### What is the Jira issue? [ZEPPELIN-6332](https://issues.apache.org/jira/browse/ZEPPELIN-6332) ### How should this be tested? Since E2E tests are not added, we could check key shortcuts manually while running Zeppelin. ### Questions: * Does the license files need to update? No * Is there breaking changes for older versions? No * Does this needs documentation? No -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected]
