From 1766e08f5c538d2f569dd2439e2fad2015741b0b Mon Sep 17 00:00:00 2001
From: Daniil Sloboda <daniil_sloboda@epam.com>
Date: Tue, 10 Sep 2024 18:08:09 +0400
Subject: [PATCH] #4965 - fixed tool reset on view only enabling

---
 .../ketcher-react/src/script/editor/Editor.ts |  2 +-
 .../src/script/ui/state/editor/index.js       | 32 +++++++++++--------
 .../modal/components/document/Open/Open.tsx   | 14 ++++++--
 .../process/Recognize/Recognize.jsx           | 13 ++++++--
 4 files changed, 41 insertions(+), 20 deletions(-)

diff --git a/packages/ketcher-react/src/script/editor/Editor.ts b/packages/ketcher-react/src/script/editor/Editor.ts
index 53258c516b..1077f6c42e 100644
--- a/packages/ketcher-react/src/script/editor/Editor.ts
+++ b/packages/ketcher-react/src/script/editor/Editor.ts
@@ -342,7 +342,7 @@ class Editor implements KetcherEditor {
   private updateToolAfterOptionsChange(wasViewOnlyEnabled: boolean) {
     const isViewOnlyEnabled = this.render.options.viewOnlyMode;
     if (!wasViewOnlyEnabled && isViewOnlyEnabled === true) {
-      this.tool('select');
+      this.event.change.dispatch('force');
     }
   }
 
diff --git a/packages/ketcher-react/src/script/ui/state/editor/index.js b/packages/ketcher-react/src/script/ui/state/editor/index.js
index c49dc47662..ca47b2090b 100644
--- a/packages/ketcher-react/src/script/ui/state/editor/index.js
+++ b/packages/ketcher-react/src/script/ui/state/editor/index.js
@@ -43,27 +43,31 @@ export default function initEditor(dispatch, getState) {
   const updateAction = debounce(100, () => dispatch({ type: 'UPDATE' }));
   const sleep = (time) => new Promise((resolve) => setTimeout(resolve, time));
 
-  function resetToSelect(dispatch) {
-    // eslint-disable-line no-shadow
-    const state = global.currentState;
-    const activeTool = state.actionState.activeTool.tool;
-    if (activeTool === 'select') return;
-    const selectMode = state.toolbar.visibleTools.select;
-    const resetOption = state.options.settings.resetToSelect;
-    if (resetOption === true || resetOption === activeTool)
-      // example: 'paste'
-      dispatch({ type: 'ACTION', action: acts[selectMode].action });
-    else updateAction();
-  }
+  const resetToSelect =
+    (force = false) =>
+    (dispatch) => {
+      // eslint-disable-line no-shadow
+      const state = global.currentState;
+      const activeTool = state.actionState.activeTool.tool;
+      if (activeTool === 'select') return;
+      const selectMode = state.toolbar.visibleTools.select;
+      const resetOption = state.options.settings.resetToSelect;
+      if (resetOption === true || resetOption === activeTool || force === true)
+        // example: 'paste'
+        dispatch({ type: 'ACTION', action: acts[selectMode].action });
+      else updateAction();
+    };
 
   return {
     onInit: (editor) => {
       dispatch({ type: 'INIT', editor });
     },
     onChange: (action) => {
-      if (action === undefined) sleep(0).then(() => dispatch(resetToSelect));
+      if (action === undefined) sleep(0).then(() => dispatch(resetToSelect()));
+      // Editor switched to view only mode
+      if (action === 'force') dispatch(resetToSelect(true));
       // new tool in reducer
-      else dispatch(resetToSelect);
+      else dispatch(resetToSelect());
     },
     onSelectionChange: () => {
       updateAction();
diff --git a/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/Open.tsx b/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/Open.tsx
index 76ec7be4fb..3795d95bab 100644
--- a/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/Open.tsx
+++ b/packages/ketcher-react/src/script/ui/views/modal/components/document/Open/Open.tsx
@@ -22,7 +22,7 @@ import Recognize from '../../process/Recognize/Recognize';
 import { fileOpener } from '../../../../../utils/';
 import { DialogActionButton } from './components/DialogActionButton';
 import { ViewSwitcher } from './components/ViewSwitcher';
-import { getFormatMimeTypeByFileName } from 'ketcher-core';
+import { getFormatMimeTypeByFileName, ketcherProvider } from 'ketcher-core';
 interface OpenProps {
   server: any;
   errorHandler: (err: string) => void;
@@ -42,7 +42,13 @@ const MODAL_STATES = {
   presentationViewer: 'presentationViewer',
 };
 
-const FooterContent = ({ structStr, openHandler, copyHandler, onCancel }) => {
+const FooterContent = ({
+  structStr,
+  openHandler,
+  copyHandler,
+  onCancel,
+  isAddToCanvasDisabled,
+}) => {
   return (
     <div className={classes.footerContent}>
       <button onClick={onCancel} className={classes.cancelButton}>
@@ -58,7 +64,7 @@ const FooterContent = ({ structStr, openHandler, copyHandler, onCancel }) => {
         />
         <DialogActionButton
           key="copyButton"
-          disabled={!structStr}
+          disabled={!structStr || isAddToCanvasDisabled}
           clickHandler={copyHandler}
           styles={classes.copyButton}
           label="Add to Canvas"
@@ -88,6 +94,7 @@ const Open: FC<Props> = (props) => {
   const [opener, setOpener] = useState<any>();
   const [currentState, setCurrentState] = useState(MODAL_STATES.idle);
   const [isLoading, setIsLoading] = useState(false);
+  const ketcher = ketcherProvider.getKetcher();
 
   useEffect(() => {
     if (server) {
@@ -162,6 +169,7 @@ const Open: FC<Props> = (props) => {
             openHandler={openHandler}
             copyHandler={copyHandler}
             onCancel={rest.onCancel}
+            isAddToCanvasDisabled={ketcher.editor.render.options.viewOnlyMode}
           />
         ) : undefined
       }
diff --git a/packages/ketcher-react/src/script/ui/views/modal/components/process/Recognize/Recognize.jsx b/packages/ketcher-react/src/script/ui/views/modal/components/process/Recognize/Recognize.jsx
index 4a17b3deeb..344932f9aa 100644
--- a/packages/ketcher-react/src/script/ui/views/modal/components/process/Recognize/Recognize.jsx
+++ b/packages/ketcher-react/src/script/ui/views/modal/components/process/Recognize/Recognize.jsx
@@ -32,12 +32,19 @@ import { range } from 'lodash/fp';
 import { recognize } from '../../../../../state/server';
 import { DialogActionButton } from 'src/script/ui/views/modal/components/document/Open/components/DialogActionButton';
 import { Icon, StructRender } from 'components';
+import { ketcherProvider } from 'ketcher-core';
 
 function isImage(file) {
   return file?.type?.includes('image');
 }
 
-function FooterContent({ onImage, structStr, openHandler, copyHandler }) {
+function FooterContent({
+  onImage,
+  structStr,
+  openHandler,
+  copyHandler,
+  isAddToCanvasDisabled,
+}) {
   return (
     <div className={classes.footerContent}>
       <OpenButton
@@ -59,7 +66,7 @@ function FooterContent({ onImage, structStr, openHandler, copyHandler }) {
         />
         <DialogActionButton
           key="copyButton"
-          disabled={!structStr}
+          disabled={!structStr || isAddToCanvasDisabled}
           clickHandler={copyHandler}
           styles={classes.primaryButton}
           label="Add to Canvas"
@@ -94,6 +101,7 @@ function RecognizeDialog(prop) {
     structStr && !(structStr instanceof Promise)
       ? { structStr, fragment }
       : null;
+  const ketcher = ketcherProvider.getKetcher();
 
   useEffect(() => {
     onRecognize(file, version);
@@ -126,6 +134,7 @@ function RecognizeDialog(prop) {
           openHandler={openHandler}
           structStr={structStr}
           copyHandler={copyHandler}
+          isAddToCanvasDisabled={ketcher.editor.render.options.viewOnlyMode}
         />
       }
       buttons={[]}