Macro: #3251 - Rna preset name should be autofilled when user selects…

… rna parts (#3418) * #3251 - Rna preset name autofilled --------- Co-authored-by: Gayane Chilingaryan <[email protected]> Co-authored-by: Roman Rodionov <[email protected]>
epam · Oct 18, 2023 · 8cc717e · 8cc717e
1 parent 3a29d09
commit 8cc717e
Showing 1 changed file with 26 additions and 5 deletions.
diff --git a/...her-polymer-editor-react/src/components/monomerLibrary/RnaBuilder/RnaEditor/RnaEditor.tsx b/...her-polymer-editor-react/src/components/monomerLibrary/RnaBuilder/RnaEditor/RnaEditor.tsx
@@ -29,6 +29,7 @@ import {
   RnaBuilderPresetsItem,
   savePreset,
   selectActivePreset,
+  selectActiveRnaBuilderItem,
   selectIsEditMode,
   selectPresetFullName,
   selectPresets,
@@ -53,6 +54,9 @@ export const RnaEditor = () => {
   const presets = useAppSelector(selectPresets);
   const isEditMode = useAppSelector(selectIsEditMode);
   const activePresetFullName = selectPresetFullName(activePreset);
+  const activeMonomerGroup = useAppSelector(selectActiveRnaBuilderItem);
+  const [, setPresetName] = useState('');
+  const [editedPresetName, setEditedPresetName] = useState(false);
 
   const dispatch = useAppDispatch();
   const hasPresets = presets.length !== 0;
@@ -79,8 +83,23 @@ export const RnaEditor = () => {
     setExpanded(!expanded);
   };
 
-  const changeName = (event: ChangeEvent<HTMLInputElement>) => {
-    dispatch(setActivePresetName(event.target.value));
+  useEffect(() => {
+    if (
+      activeMonomerGroup !== RnaBuilderPresetsItem.Presets &&
+      !editedPresetName
+    ) {
+      setPresetName(activePresetFullName);
+      dispatch(setActivePresetName(activePresetFullName));
+    }
+  }, [activeMonomerGroup, activePresetFullName, editedPresetName]);
+
+  const onChangeName = (event: ChangeEvent<HTMLInputElement>) => {
+    if (isEditMode) {
+      const newPresetName = event.target.value;
+      dispatch(setActivePresetName(newPresetName));
+      setPresetName(newPresetName);
+      setEditedPresetName(newPresetName.trim() !== '');
+    }
   };
 
   const saveActivePreset = () => {
@@ -106,14 +125,16 @@ export const RnaEditor = () => {
   };
 
   const cancelEdit = () => {
-    if (presets.length === 0) {
+    if (presets.length === 0 || !activePreset.presetInList) {
       dispatch(createNewPreset());
-      return;
+    } else {
+      dispatch(setActivePreset(activePreset.presetInList));
     }
 
     if (!activePreset.presetInList) {
       dispatch(setActivePreset(presets[0]));
     }
+
     setIsEditMode(false);
   };
 
@@ -142,7 +163,7 @@ export const RnaEditor = () => {
           <RnaEditorExpanded
             name={activePreset.name}
             isEditMode={isEditMode}
-            onChangeName={changeName}
+            onChangeName={onChangeName}
             onSave={saveActivePreset}
             onCancel={cancelEdit}
             onEdit={activateEditMode}