Backmerge: #2940 – No modal windows are opened during R-Group adding (#…

…2942) (#2943)

* Bump word-wrap from 1.2.3 to 1.2.4 (#2937)

Bumps [word-wrap](https://github.com/jonschlinkert/word-wrap) from 1.2.3 to 1.2.4.
- [Release notes](https://github.com/jonschlinkert/word-wrap/releases)
- [Commits](jonschlinkert/word-wrap@1.2.3...1.2.4)

---
updated-dependencies:
- dependency-name: word-wrap
  dependency-type: indirect
...




* 2940 - fix: no modal windows are opened during r-group adding

* #2940 – fix types and console warnings

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Anna Justus <50149163+Iogsotot@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

packages/ketcher-core/src/application/editor/editor.types.ts

@@ -64,6 +64,8 @@ export interface Editor {
     message: Subscription;
     elementEdit: PipelineSubscription;
     bondEdit: PipelineSubscription;
+    zoomIn: PipelineSubscription;
+    zoomOut: PipelineSubscription;
     rgroupEdit: PipelineSubscription;
     sgroupEdit: PipelineSubscription;
     sdataEdit: PipelineSubscription;

packages/ketcher-react/src/script/editor/Editor.ts

@@ -133,6 +133,8 @@ class Editor implements KetcherEditor {
   event: {
     message: Subscription;
     elementEdit: PipelineSubscription;
+    zoomIn: PipelineSubscription;
+    zoomOut: PipelineSubscription;
     bondEdit: PipelineSubscription;
     rgroupEdit: PipelineSubscription;
     sgroupEdit: PipelineSubscription;
@@ -188,6 +190,8 @@ class Editor implements KetcherEditor {
       message: new Subscription(),
       elementEdit: new PipelineSubscription(),
       bondEdit: new PipelineSubscription(),
+      zoomIn: new PipelineSubscription(),
+      zoomOut: new PipelineSubscription(),
       rgroupEdit: new PipelineSubscription(),
       sgroupEdit: new PipelineSubscription(),
       sdataEdit: new PipelineSubscription(),

packages/ketcher-react/src/script/ui/App/App.tsx

@@ -26,7 +26,7 @@ import { createTheme, ThemeProvider } from '@mui/material';
 import AppClipArea from '../views/AppClipArea';
 import { AppHiddenContainer } from './AppHidden';
 import AppModalContainer from '../views/modal';
-import Editor from '../views/Editor';
+import ConnectedEditor from '../views/Editor';
 import classes from './App.module.less';
 import { initFGTemplates } from '../state/functionalGroups';
 import { initSaltsAndSolventsTemplates } from '../state/saltsAndSolvents';
@@ -62,6 +62,9 @@ const App = (props: Props) => {
     window.scrollTo(0, 0);
   }, []);
 
+  // Temporary workaround: add proper types for Editor
+  const Editor = ConnectedEditor as React.ComponentType<{ className: string }>;
+
   return (
     <ThemeProvider theme={muiTheme}>
       <div className={classes.app}>

packages/ketcher-react/src/script/ui/state/editor/index.js

@@ -229,5 +229,8 @@ export default function initEditor(dispatch, getState) {
         dispatch(updateFloatingTools(payload));
       },
     ),
+
+    onZoomIn: updateAction,
+    onZoomOut: updateAction,
   };
 }

packages/ketcher-react/src/script/ui/views/Editor.jsx

@@ -31,7 +31,7 @@ const mapDispatchToProps = (dispatch) => {
   return {
     onZoomIn,
     onZoomOut,
-    ...initEditor(dispatch),
+    ...dispatch(initEditor),
   };
 };
 

packages/ketcher-react/src/script/ui/views/components/StructEditor/StructEditor.jsx

@@ -224,6 +224,8 @@ class StructEditor extends Component {
       onEnhancedStereoEdit,
       onQuickEdit,
       onBondEdit,
+      onZoomIn,
+      onZoomOut,
       onRgroupEdit,
       onSgroupEdit,
       onRemoveFG,