#4763 - Add validations to Accordion action

epam · Jul 5, 2024 · e347589 · e347589
1 parent 842f858
commit e347589
Show file tree

Hide file tree

Showing 4 changed files with 72 additions and 41 deletions.
diff --git a/ketcher-autotests/tests/Macromolecule-editor/RNA-Builder/rna-library.spec.ts b/ketcher-autotests/tests/Macromolecule-editor/RNA-Builder/rna-library.spec.ts
@@ -519,11 +519,11 @@ test.describe('RNA Library', () => {
     Test working incorrect because we have bug: https://github.com/epam/ketcher/issues/3561
     */
     await expandCollapseRnaBuilder(page);
-    await selectMonomer(page, Sugars.TwelveddR);
+    await selectMonomer(page, Sugars.TwentyFiveR);
     await selectMonomer(page, Bases.Adenine);
     await selectMonomer(page, Phosphates.Test6Ph);
     await pressAddToPresetsButton(page);
-    await page.getByTestId('12ddR(A)Test-6-Ph_A_12ddR_Test-6-Ph').click({
+    await page.getByTestId('25R(A)Test-6-Ph_A_25R_Test-6-Ph').click({
       button: 'right',
     });
     await page.getByTestId('deletepreset').click();
@@ -1002,15 +1002,13 @@ test.describe('RNA Library', () => {
      *    Check that can delete preset from Presets section
      */
     await expandCollapseRnaBuilder(page);
-    await selectMonomer(page, Sugars.TwelveddR);
+    await selectMonomer(page, Sugars.TwentyFiveR);
     await selectMonomer(page, Bases.Adenine);
     await selectMonomer(page, Phosphates.Test6Ph);
     await pressAddToPresetsButton(page);
     await expandCollapseRnaBuilder(page);
 
-    const customPreset = page.getByTestId(
-      '12ddR(A)Test-6-Ph_A_12ddR_Test-6-Ph',
-    );
+    const customPreset = page.getByTestId('25R(A)Test-6-Ph_A_25R_Test-6-Ph');
     await customPreset.hover();
     await customPreset.click({ button: 'right' });
     await page.getByText('Delete Preset').click();

diff --git a/...her-macromolecules/src/components/monomerLibrary/RnaBuilder/RnaAccordion/RnaAccordion.tsx b/...her-macromolecules/src/components/monomerLibrary/RnaBuilder/RnaAccordion/RnaAccordion.tsx
@@ -52,6 +52,9 @@ import {
   setActivePresetMonomerGroup,
   setActiveRnaBuilderItem,
   setIsEditMode,
+  setSugarValidations,
+  setBaseValidations,
+  setPhosphateValidations,
 } from 'state/rna-builder';
 import { useDispatch } from 'react-redux';
 import { IRnaPreset } from '../types';
@@ -61,6 +64,7 @@ import {
   selectIsSequenceEditInRNABuilderMode,
 } from 'state/common';
 import { RnaPresetGroup } from 'components/monomerLibrary/RnaPresetGroup/RnaPresetGroup';
+import { getValidations } from 'helpers/rnaValidations';
 
 interface IGroupsDataItem {
   groupName: RnaBuilderItem;
@@ -91,11 +95,21 @@ export const RnaAccordion = ({ libraryName, duplicatePreset, editPreset }) => {
 
   const [expandedAccordion, setExpandedAccordion] =
     useState<RnaBuilderItem | null>(activeRnaBuilderItem);
+  const [newPreset, setNewPreset] = useState(activePreset);
 
+  const dispatch = useDispatch();
   const handleAccordionSummaryClick = (rnaBuilderItem: RnaBuilderItem) => {
     if (expandedAccordion === rnaBuilderItem) {
       setExpandedAccordion(null);
-    } else setExpandedAccordion(rnaBuilderItem);
+    } else {
+      setExpandedAccordion(rnaBuilderItem);
+      const { sugarValidations, phosphateValidations, baseValidations } =
+        getValidations(newPreset);
+
+      dispatch(setSugarValidations(sugarValidations));
+      dispatch(setPhosphateValidations(phosphateValidations));
+      dispatch(setBaseValidations(baseValidations));
+    }
   };
 
   const groupsData: IGroupsDataItem[] = [
@@ -138,14 +152,18 @@ export const RnaAccordion = ({ libraryName, duplicatePreset, editPreset }) => {
     },
   ];
 
-  const dispatch = useDispatch();
-
   const selectItem = (monomer, groupName) => {
     if (!isSequenceEditInRNABuilderMode) {
       editor.events.selectMonomer.dispatch(monomer);
     }
     if (!isEditMode) return;
 
+    const monomerClass = monomer.props.MonomerClass.toLowerCase();
+    const currentPreset = {
+      ...newPreset,
+      [monomerClass]: monomer,
+    };
+    setNewPreset(currentPreset);
     dispatch(setActivePresetMonomerGroup({ groupName, groupItem: monomer }));
     dispatch(setActiveRnaBuilderItem(groupName));
   };

diff --git a/...rc/components/monomerLibrary/RnaBuilder/RnaEditor/RnaEditorExpanded/RnaEditorExpanded.tsx b/...rc/components/monomerLibrary/RnaBuilder/RnaEditor/RnaEditorExpanded/RnaEditorExpanded.tsx
@@ -72,6 +72,7 @@ import {
 } from 'components/monomerLibrary/RnaBuilder/RnaEditor/RnaEditorExpanded/helpers';
 import { openModal } from 'state/modal';
 import { getCountOfNucleoelements } from 'helpers/countNucleoelents';
+import { getValidations } from 'helpers/rnaValidations';
 
 type SequenceSelectionGroupNames = {
   [MonomerGroups.SUGARS]: string;
@@ -214,44 +215,18 @@ export const RnaEditorExpanded = ({
       newPreset,
       selectedGroup,
     );
-    const sugarValidaions: string[] = [];
-    const phosphateValidaions: string[] = [];
-    const baseValidaions: string[] = [];
 
     if (selectedRNAPartMonomer) {
       editor.events.selectMonomer.dispatch(selectedRNAPartMonomer);
     }
-    if (selectedGroup === MonomerGroups.SUGARS) {
-      if (newPreset.phosphate) {
-        sugarValidaions.push('R2');
-      }
-      if (newPreset.base) {
-        sugarValidaions.push('R3');
-      }
-    }
-    if (selectedGroup === MonomerGroups.BASES) {
-      baseValidaions.push('R1');
-      if (
-        newPreset?.sugar?.props?.MonomerCaps &&
-        !('R3' in newPreset.sugar.props.MonomerCaps)
-      ) {
-        baseValidaions.push('DISABLED');
-      }
-    }
-    if (selectedGroup === MonomerGroups.PHOSPHATES) {
-      phosphateValidaions.push('R1');
-      if (
-        newPreset?.sugar?.props?.MonomerCaps &&
-        !('R2' in newPreset.sugar.props.MonomerCaps)
-      ) {
-        phosphateValidaions.push('DISABLED');
-      }
-    }
+
     scrollToActiveItemInLibrary(selectedGroup);
     dispatch(setActiveRnaBuilderItem(selectedGroup));
-    dispatch(setSugarValidations(sugarValidaions));
-    dispatch(setPhosphateValidations(phosphateValidaions));
-    dispatch(setBaseValidations(baseValidaions));
+    const { sugarValidations, phosphateValidations, baseValidations } =
+      getValidations(newPreset);
+    dispatch(setSugarValidations(sugarValidations));
+    dispatch(setPhosphateValidations(phosphateValidations));
+    dispatch(setBaseValidations(baseValidations));
   };
 
   const onChangeName = (event: ChangeEvent<HTMLInputElement>) => {

diff --git a/packages/ketcher-macromolecules/src/helpers/rnaValidations.ts b/packages/ketcher-macromolecules/src/helpers/rnaValidations.ts
@@ -0,0 +1,40 @@
+import { IRnaPreset } from 'components/monomerLibrary/RnaBuilder/types';
+
+export const getValidations = (
+  newPreset: IRnaPreset,
+): {
+  sugarValidations: string[];
+  phosphateValidations: string[];
+  baseValidations: string[];
+} => {
+  const sugarValidations: string[] = [];
+  const phosphateValidations: string[] = [];
+  const baseValidations: string[] = [];
+
+  if (newPreset.phosphate) {
+    sugarValidations.push('R2');
+  }
+  if (newPreset.base) {
+    sugarValidations.push('R3');
+  }
+  baseValidations.push('R1');
+  if (
+    newPreset?.sugar?.props?.MonomerCaps &&
+    !('R3' in newPreset.sugar.props.MonomerCaps)
+  ) {
+    baseValidations.push('DISABLED');
+  }
+  phosphateValidations.push('R1');
+  if (
+    newPreset?.sugar?.props?.MonomerCaps &&
+    !('R2' in newPreset.sugar.props.MonomerCaps)
+  ) {
+    phosphateValidations.push('DISABLED');
+  }
+
+  return {
+    sugarValidations,
+    phosphateValidations,
+    baseValidations,
+  };
+};