#3509 - Macro: RNA tab view while opening the RNA tab

- fixed presets deletion - fixed monomer selection
epam · Nov 9, 2023 · 8289299 · 8289299
1 parent 905f86a
commit 8289299
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 8 deletions.
diff --git a/...lymer-editor-react/src/components/monomerLibrary/RnaBuilder/RnaAccordion/RnaAccordion.tsx b/...lymer-editor-react/src/components/monomerLibrary/RnaBuilder/RnaAccordion/RnaAccordion.tsx
@@ -231,7 +231,6 @@ export const RnaAccordion = ({ libraryName, duplicatePreset, editPreset }) => {
                 return (
                   <MonomerGroup
                     key={groupTitle}
-                    disabled={!isEditMode}
                     title={groupData.groups.length > 1 ? groupTitle : undefined}
                     items={groupItems as MonomerItemType[]}
                     selectedMonomerUniqueKey={

diff --git a/...ages/ketcher-polymer-editor-react/src/components/monomerLibrary/RnaBuilder/RnaBuilder.tsx b/...ages/ketcher-polymer-editor-react/src/components/monomerLibrary/RnaBuilder/RnaBuilder.tsx
@@ -74,7 +74,7 @@ export const RnaBuilder = ({ libraryName }) => {
   return (
     <RnaBuilderContainer>
       <RnaEditor
-        duplicatePreset={duplicatePreset}
+        duplicatePreset={() => duplicatePreset()}
         activateEditMode={activateEditMode}
       />
       <RnaAccordion

diff --git a/...r-polymer-editor-react/src/components/monomerLibrary/monomerLibraryGroup/MonomerGroup.tsx b/...r-polymer-editor-react/src/components/monomerLibrary/monomerLibraryGroup/MonomerGroup.tsx
@@ -13,7 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  ***************************************************************************/
-import { useCallback, useMemo } from 'react';
+import { useCallback, useMemo, useState } from 'react';
 import { EmptyFunction } from 'helpers';
 import { debounce } from 'lodash';
 import { MonomerItem } from '../monomerLibraryItem';
@@ -29,6 +29,7 @@ import {
   selectEditor,
   selectTool,
 } from 'state/common';
+import { selectIsEditMode } from 'state/rna-builder';
 
 const MonomerGroup = ({
   items,
@@ -41,6 +42,9 @@ const MonomerGroup = ({
   const dispatch = useAppDispatch();
   const preview = useAppSelector(selectShowPreview);
   const editor = useAppSelector(selectEditor);
+  const isEditMode = useAppSelector(selectIsEditMode);
+  const [selectedItemInGroup, setSelectedItemInGroup] =
+    useState<MonomerItemType>();
 
   const dispatchShowPreview = useCallback(
     (payload) => dispatch(showPreview(payload)),
@@ -73,6 +77,7 @@ const MonomerGroup = ({
 
   const selectMonomer = (monomer: MonomerItemType) => {
     dispatch(selectTool('monomer'));
+    setSelectedItemInGroup(monomer);
 
     if (['FAVORITES', 'PEPTIDE', 'CHEM'].includes(libraryName ?? '')) {
       editor.events.selectMonomer.dispatch(monomer);
@@ -99,7 +104,11 @@ const MonomerGroup = ({
               disabled={disabled}
               item={monomer}
               isSelected={
-                selectedMonomerUniqueKey === getMonomerUniqueKey(monomer)
+                isEditMode
+                  ? selectedMonomerUniqueKey === getMonomerUniqueKey(monomer)
+                  : selectedItemInGroup &&
+                    getMonomerUniqueKey(selectedItemInGroup) ===
+                      getMonomerUniqueKey(monomer)
               }
               onMouseLeave={handleItemMouseLeave}
               onMouseMove={(e) => handleItemMouseMove(monomer, e)}

diff --git a/packages/ketcher-polymer-editor-react/src/state/rna-builder/rnaBuilderSlice.ts b/packages/ketcher-polymer-editor-react/src/state/rna-builder/rnaBuilderSlice.ts
@@ -110,11 +110,13 @@ export const rnaBuilderSlice = createSlice({
     deletePreset: (state, action: PayloadAction<IRnaPreset>) => {
       const preset = action.payload;
 
+      const presetIndexInList = state.presets.findIndex(
+        (presetInList) => presetInList.name === preset.name,
+      );
+      state.presets.splice(presetIndexInList, 1);
+
       if (preset.presetInList) {
-        const presetIndexInList = state.presets.findIndex(
-          (presetInList) => presetInList.name === preset.presetInList?.name,
-        );
-        state.presets.splice(presetIndexInList, 1);
+        state.activePreset = null;
       }
     },
     setIsEditMode: (state, action: PayloadAction<boolean>) => {