#2423 Hotkeys for atoms don't work on Functional Groups and Salts abb…

…reviations (#2580)

* #2423 fix hotkey for functional groups

* #2423 moved logic with sgroup to handleHotkeysOverItem

* #2423 fix imports

* #2513 fix bug with SRU polymer

* #2513 move logic to Atom Tool

* #2513 replace functionalGroup by hovering

* #2513 fix issue when atom doesn't exist

packages/ketcher-core/src/domain/entities/sgroup.ts

@@ -665,6 +665,12 @@ export class SGroup {
     return !expanded && isSGroup
   }
 
+  static getAtomsSGroupWithoutAttachmentPoint(sGroup: SGroup, struct: Struct) {
+    const atomsSGroup = SGroup.getAtoms(struct, sGroup)
+    const attachmentPointId = sGroup?.getAttAtomId(struct)
+    return atomsSGroup.filter((atomId) => atomId !== attachmentPointId)
+  }
+
   /**
    * @returns `undefined`: if it's salt or solvent
    */

packages/ketcher-react/src/script/editor/tool/atom.ts

@@ -31,6 +31,8 @@ import {
 import Editor from '../Editor'
 import utils from '../shared/utils'
 import { Tool } from './Tool'
+import { deleteFunctionalGroups } from './helper/deleteFunctionalGroups'
+import { getGroupIdsFromItemArrays } from './helper/getGroupIdsFromItems'
 
 class AtomTool implements Tool {
   private readonly editor: Editor
@@ -48,16 +50,26 @@ class AtomTool implements Tool {
 
     if (editorSelection) {
       if (editorSelection.atoms) {
-        const action = fromAtomsAttrs(
-          editor.render.ctab,
-          editorSelection.atoms,
-          atomProps,
-          true
+        const struct = editor.render.ctab
+        const action = new Action()
+        const selectedSGroupsId =
+          editorSelection &&
+          getGroupIdsFromItemArrays(struct.molecule, editorSelection)
+        const deletedAtomsInSGroups = deleteFunctionalGroups(
+          selectedSGroupsId,
+          struct,
+          action
         )
+        const updatedAtoms = editorSelection?.atoms?.filter(
+          (selectAtomId) =>
+            !deletedAtomsInSGroups?.includes(selectAtomId) &&
+            struct.atoms.has(selectAtomId)
+        )
+        action.mergeWith(fromAtomsAttrs(struct, updatedAtoms, atomProps, true))
         editor.update(action)
         editor.selection(null)
+        this.editor.hoverIcon.hide()
       }
-
       this.isNotActiveTool = true
     } else {
       this.editor.hoverIcon.show()

packages/ketcher-react/src/script/editor/tool/helper/deleteFunctionalGroups.ts

@@ -0,0 +1,36 @@
+import {
+  FunctionalGroup,
+  SGroup,
+  fromSgroupDeletion,
+  fromFragmentDeletion,
+  ReStruct,
+  Action
+} from 'ketcher-core'
+
+export function deleteFunctionalGroups(
+  sGroupsId: number[],
+  struct: ReStruct,
+  action: Action
+): number[] {
+  const deletedAtoms: number[] = []
+  const functionalGroups = struct.molecule.functionalGroups
+  const sgroups = struct.sgroups
+  sGroupsId.forEach((sGroupId) => {
+    const sGroupItem = sgroups.get(sGroupId)?.item
+    if (
+      FunctionalGroup.isContractedFunctionalGroup(sGroupId, functionalGroups)
+    ) {
+      const atomsWithoutAttachmentPoint =
+        SGroup.getAtomsSGroupWithoutAttachmentPoint(sGroupItem, struct.molecule)
+      deletedAtoms.push(...atomsWithoutAttachmentPoint)
+      action.mergeWith(fromSgroupDeletion(struct, sGroupId))
+      action.mergeWith(
+        fromFragmentDeletion(struct, {
+          atoms: atomsWithoutAttachmentPoint,
+          bonds: SGroup.getBonds(struct, sGroupItem)
+        })
+      )
+    }
+  })
+  return deletedAtoms
+}

packages/ketcher-react/src/script/ui/state/handleHotkeysOverItem.ts

@@ -6,7 +6,8 @@ import {
   fromBondsAttrs,
   fromFragmentDeletion,
   FunctionalGroup,
-  Atom
+  Atom,
+  Action
 } from 'ketcher-core'
 import { STRUCT_TYPE } from 'src/constants'
 import { openDialog } from './modal'
@@ -16,6 +17,7 @@ import { Editor } from '../../editor'
 import { updateSelectedAtoms } from 'src/script/ui/state/modal/atoms'
 import { fromAtom, toAtom, fromBond, toBond } from '../data/convert/structconv'
 import SGroupTool from '../../editor/tool/sgroup'
+import { deleteFunctionalGroups } from '../../editor/tool/helper/deleteFunctionalGroups'
 
 type TNewAction = {
   tool?: string
@@ -215,6 +217,7 @@ async function isFunctionalGroupChange(
   props: HandlersProps,
   type: string
 ): Promise<boolean> {
+  if (type === 'sgroups') return true
   return await isChangingFunctionalGroup(props, type)
 }
 
@@ -231,6 +234,9 @@ function getToolHandler(itemType: string, toolName = '') {
       hand: ({ dispatch }: HandlersProps) =>
         dispatch(onAction({ tool: 'hand' }))
     },
+    sgroups: {
+      atom: (props: HandlersProps) => handleSgroupsTool(props)
+    },
     _default: {}
   }
 
@@ -253,6 +259,23 @@ function handleAtomTool({ hoveredItemId, newAction, editor }: HandlersProps) {
   editor.update(updatedAtoms)
 }
 
+function handleSgroupsTool({
+  hoveredItemId,
+  newAction,
+  editor
+}: HandlersProps) {
+  const atomProps = { ...newAction.opts }
+  const action = new Action()
+  const ctab = editor.render.ctab
+  const sGroup = ctab.molecule.sgroups.get(hoveredItemId)
+  const attachmentPoint = sGroup?.getAttAtomId(ctab.molecule)
+  deleteFunctionalGroups([hoveredItemId], ctab, action)
+  action.mergeWith(
+    fromAtomsAttrs(editor.render.ctab, attachmentPoint, atomProps, true)
+  )
+  editor.update(action)
+}
+
 function handleBondTool({ hoveredItemId, newAction, editor }: HandlersProps) {
   const newBond = fromBondAddition(
     editor.render.ctab,

packages/ketcher-react/src/script/ui/state/hotkeys.ts

@@ -28,8 +28,8 @@ import { load, onAction, removeStructAction } from './shared'
 import actions from '../action'
 import keyNorm from '../data/convert/keynorm'
 import { isIE } from 'react-device-detect'
-import { handleHotkeyOverItem } from './handleHotkeysOverItem'
 import { SettingsManager } from '../utils/settingsManager'
+import { handleHotkeyOverItem } from './handleHotkeysOverItem'
 
 export function initKeydownListener(element) {
   return function (dispatch, getState) {