From 94e560b0d37a1d091e32fa7e948ab2c34cee3c0c Mon Sep 17 00:00:00 2001 From: Vladimir Nebolsin <107650674+mnmsvlw@users.noreply.github.com> Date: Fri, 8 Nov 2024 03:56:30 +0400 Subject: [PATCH] =?UTF-8?q?#5351=20=E2=80=93=20Inform=20User=20to=20Apply?= =?UTF-8?q?=20Layout=20after=20Settings=20Adjustment=20(#5921)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * #5351 - inform user to apply layout after settings adjustment * Update reaction component margin size related tests --- .../CDXML-Files/cdxml-files.spec.ts | 2 ++ .../Cml-files/cml-files.spec.ts | 2 ++ .../KET-Files/ket-files-properties.spec.ts | 5 ++++ .../MOL-Files/mol-files.spec.ts | 2 ++ .../PNG-Files/png-files.spec.ts | 1 + .../Rxn-Files/rxn-files.spec.ts | 3 +++ .../SDF-Files/sdf-files.spec.ts | 2 ++ .../SVG_Files/svg-files.spec.ts | 1 + .../ACS Style/acs-style-settings.spec.ts | 3 +++ .../default-settings-verification.spec.ts | 16 ++++++++++++ .../modal/components/InfoModal/InfoModal.tsx | 4 +-- .../components/meta/Settings/Settings.tsx | 26 ++++++++++++++++--- 12 files changed, 62 insertions(+), 5 deletions(-) diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/CDXML-Files/cdxml-files.spec.ts b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/CDXML-Files/cdxml-files.spec.ts index 209768c2be..76e526da2e 100644 --- a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/CDXML-Files/cdxml-files.spec.ts +++ b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/CDXML-Files/cdxml-files.spec.ts @@ -601,6 +601,7 @@ test.describe('Tests for API setMolecule/getMolecule', () => { await setReactionMarginSizeOptionUnit(page, 'px-option'); await setReactionMarginSizeValue(page, '7.8'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const expectedFile = await getCdxml(page); @@ -637,6 +638,7 @@ test.describe('Tests for API setMolecule/getMolecule', () => { await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const expectedFile = await getCdxml(page); diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/Cml-files/cml-files.spec.ts b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/Cml-files/cml-files.spec.ts index fca89f71b9..6d5707f120 100644 --- a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/Cml-files/cml-files.spec.ts +++ b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/Cml-files/cml-files.spec.ts @@ -605,6 +605,7 @@ test.describe('CML files', () => { await setReactionMarginSizeOptionUnit(page, 'cm-option'); await setReactionMarginSizeValue(page, '1.8'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const expectedFile = await getCml(page); @@ -640,6 +641,7 @@ test.describe('CML files', () => { await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const expectedFile = await getCml(page); diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/KET-Files/ket-files-properties.spec.ts b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/KET-Files/ket-files-properties.spec.ts index 675f86d3e0..0808976edc 100644 --- a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/KET-Files/ket-files-properties.spec.ts +++ b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/KET-Files/ket-files-properties.spec.ts @@ -192,6 +192,7 @@ test.describe('Ket files', () => { await setReactionMarginSizeOptionUnit(page, 'px-option'); await setReactionMarginSizeValue(page, '47.8'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const expectedFile = await getKet(page); @@ -225,6 +226,7 @@ test.describe('Ket files', () => { await setReactionMarginSizeOptionUnit(page, 'pt-option'); await setReactionMarginSizeValue(page, '7.8'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const expectedFile = await getKet(page); @@ -258,6 +260,7 @@ test.describe('Ket files', () => { await setReactionMarginSizeOptionUnit(page, 'cm-option'); await setReactionMarginSizeValue(page, '3.8'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const expectedFile = await getKet(page); @@ -291,6 +294,7 @@ test.describe('Ket files', () => { await setReactionMarginSizeOptionUnit(page, 'inch-option'); await setReactionMarginSizeValue(page, '7.8'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const expectedFile = await getKet(page); @@ -320,6 +324,7 @@ test.describe('Ket files', () => { await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const expectedFile = await getKet(page); diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/MOL-Files/mol-files.spec.ts b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/MOL-Files/mol-files.spec.ts index fcd379f2d0..8fc3099822 100644 --- a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/MOL-Files/mol-files.spec.ts +++ b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/MOL-Files/mol-files.spec.ts @@ -973,6 +973,7 @@ test.describe('Open and Save file', () => { await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); @@ -1012,6 +1013,7 @@ test.describe('Open and Save file', () => { await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PNG-Files/png-files.spec.ts b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PNG-Files/png-files.spec.ts index 5f7a747670..b0a950454c 100644 --- a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PNG-Files/png-files.spec.ts +++ b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/PNG-Files/png-files.spec.ts @@ -169,6 +169,7 @@ test.describe('Saving in .png files', () => { await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); await clickOnSaveFileAndOpenDropdown(page); diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/Rxn-Files/rxn-files.spec.ts b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/Rxn-Files/rxn-files.spec.ts index 5de1f090ff..1a9d783390 100644 --- a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/Rxn-Files/rxn-files.spec.ts +++ b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/Rxn-Files/rxn-files.spec.ts @@ -1323,6 +1323,7 @@ test.describe('Tests for Open and Save RXN file operations', () => { await setReactionMarginSizeOptionUnit(page, 'px-option'); await setReactionMarginSizeValue(page, '47.8'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const METADATA_STRINGS_INDEXES = [2, 7, 34, 65, 100, 118]; @@ -1360,6 +1361,7 @@ test.describe('Tests for Open and Save RXN file operations', () => { await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const METADATA_STRINGS_INDEXES = [2, 7, 32, 54]; @@ -1397,6 +1399,7 @@ test.describe('Tests for Open and Save RXN file operations', () => { await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); const METADATA_STRINGS_INDEXES = [2, 7, 32, 54]; diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/SDF-Files/sdf-files.spec.ts b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/SDF-Files/sdf-files.spec.ts index 9a5c6fa57d..8860afcb15 100644 --- a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/SDF-Files/sdf-files.spec.ts +++ b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/SDF-Files/sdf-files.spec.ts @@ -772,6 +772,7 @@ test('The ACS setting is applied, click on layout and it should be save to sdf 3 await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); @@ -814,6 +815,7 @@ test('The ACS setting is applied, click on layout and it should be save to sdf 2 await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); diff --git a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/SVG_Files/svg-files.spec.ts b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/SVG_Files/svg-files.spec.ts index 358de4d7ca..8503bc5c12 100644 --- a/ketcher-autotests/tests/File-Management/Open-And-Save-Files/SVG_Files/svg-files.spec.ts +++ b/ketcher-autotests/tests/File-Management/Open-And-Save-Files/SVG_Files/svg-files.spec.ts @@ -130,6 +130,7 @@ test.describe('Saving in .svg files', () => { await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); await clickOnSaveFileAndOpenDropdown(page); diff --git a/ketcher-autotests/tests/Settings/ACS Style/acs-style-settings.spec.ts b/ketcher-autotests/tests/Settings/ACS Style/acs-style-settings.spec.ts index 82f2d9a1bf..ad8b75c31c 100644 --- a/ketcher-autotests/tests/Settings/ACS Style/acs-style-settings.spec.ts +++ b/ketcher-autotests/tests/Settings/ACS Style/acs-style-settings.spec.ts @@ -38,6 +38,7 @@ test.describe('ACS Style Settings', () => { await scrollToDownInSetting(page); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -53,6 +54,7 @@ test.describe('ACS Style Settings', () => { await openSettings(page); await pressButton(page, 'Set ACS Settings'); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); await openSettings(page); @@ -62,6 +64,7 @@ test.describe('ACS Style Settings', () => { await scrollToDownInSetting(page); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await takeEditorScreenshot(page); }); }); diff --git a/ketcher-autotests/tests/Settings/General/default-settings-verification.spec.ts b/ketcher-autotests/tests/Settings/General/default-settings-verification.spec.ts index f986ac5d5a..d1b1b202bd 100644 --- a/ketcher-autotests/tests/Settings/General/default-settings-verification.spec.ts +++ b/ketcher-autotests/tests/Settings/General/default-settings-verification.spec.ts @@ -572,6 +572,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -594,6 +595,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -616,6 +618,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -638,6 +641,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -660,6 +664,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -682,6 +687,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -704,6 +710,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -726,6 +733,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -749,6 +757,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -772,6 +781,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -795,6 +805,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -818,6 +829,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -840,6 +852,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -862,6 +875,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -884,6 +898,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); @@ -906,6 +921,7 @@ test.describe('General Settings', () => { await page.waitForTimeout(1000); await takeEditorScreenshot(page); await pressButton(page, 'Apply'); + await pressButton(page, 'OK'); await selectTopPanelButton(TopPanelButton.Layout, page); await takeEditorScreenshot(page); }); diff --git a/packages/ketcher-react/src/script/ui/views/modal/components/InfoModal/InfoModal.tsx b/packages/ketcher-react/src/script/ui/views/modal/components/InfoModal/InfoModal.tsx index 8469077521..b36fe493d5 100644 --- a/packages/ketcher-react/src/script/ui/views/modal/components/InfoModal/InfoModal.tsx +++ b/packages/ketcher-react/src/script/ui/views/modal/components/InfoModal/InfoModal.tsx @@ -28,7 +28,7 @@ function ErrorInfoModal(props) { const defaultCutCopyMessage = `This action is unavailable via menu. Instead, use shortcut to ${props.message}.`; - const headerContent =
{error.message}
; + const headerContent =
{props.title ?? error.message}
; return ( - Close + {props.button || 'Close'} , ]} headerContent={headerContent} diff --git a/packages/ketcher-react/src/script/ui/views/modal/components/meta/Settings/Settings.tsx b/packages/ketcher-react/src/script/ui/views/modal/components/meta/Settings/Settings.tsx index 548dc5a9db..574d6684d9 100644 --- a/packages/ketcher-react/src/script/ui/views/modal/components/meta/Settings/Settings.tsx +++ b/packages/ketcher-react/src/script/ui/views/modal/components/meta/Settings/Settings.tsx @@ -42,6 +42,7 @@ import fieldGroups from './fieldGroups'; import { isEqual } from 'lodash'; import { Icon } from 'components'; import { ACS_STYLE_DEFAULT_SETTINGS } from 'src/constants'; +import { onAction } from 'src/script/ui/state/shared'; interface SettingsProps extends BaseProps { initState: any; @@ -350,7 +351,7 @@ const SettingsDialog = (props: Props) => { return ( formState.result} + result={() => [formState.result, initState]} valid={() => formState.valid} params={prop} buttonsNameMap={{ OK: 'Apply' }} @@ -396,8 +397,27 @@ const mapDispatchToProps = (dispatch, ownProps) => ({ }, onReset: () => dispatch(setDefaultSettings()), onOk: (res) => { - dispatch(saveSettings(res)); - ownProps.onOk(res); + const [result, initState] = res; + + dispatch(saveSettings(result)); + ownProps.onOk(result); + + const showNotification = + initState.reactionComponentMarginSize !== + result.reactionComponentMarginSize; + + showNotification && + dispatch( + onAction({ + dialog: 'info-modal', + prop: { + title: '', + customText: + 'To fully apply these changes, you need to apply the layout.', + button: 'OK', + }, + }), + ); }, onACSStyle: (result) => { dispatch(updateFormState({ result }));