From a899f111eabae6596d555157b012a94da8c89835 Mon Sep 17 00:00:00 2001 From: Artem Shelkovnikov Date: Mon, 2 Dec 2024 13:44:51 +0100 Subject: [PATCH 1/5] Add prompt for connector configuration being in editable mode --- .../configuration/connector_configuration.tsx | 8 +++++++ .../create_connector/configuration_step.tsx | 22 +++++++++++++++++-- 2 files changed, 28 insertions(+), 2 deletions(-) diff --git a/packages/kbn-search-connectors/components/configuration/connector_configuration.tsx b/packages/kbn-search-connectors/components/configuration/connector_configuration.tsx index cd80b2489012e..56e913dde03f3 100644 --- a/packages/kbn-search-connectors/components/configuration/connector_configuration.tsx +++ b/packages/kbn-search-connectors/components/configuration/connector_configuration.tsx @@ -47,6 +47,7 @@ interface ConnectorConfigurationProps { isLoading: boolean; saveConfig: (configuration: Record) => void; saveAndSync?: (configuration: Record) => void; + onEditStateChange?: (isEdit: boolean) => void; stackManagementLink?: string; subscriptionLink?: string; children?: React.ReactNode; @@ -94,6 +95,7 @@ export const ConnectorConfigurationComponent: FC< isLoading, saveConfig, saveAndSync, + onEditStateChange, subscriptionLink, stackManagementLink, }) => { @@ -110,6 +112,12 @@ export const ConnectorConfigurationComponent: FC< ); const [isEditing, setIsEditing] = useState(false); + useEffect(function propogateEditState() { + if (onEditStateChange) { + onEditStateChange(isEditing) + } + }, [isEditing, onEditStateChange]) + useEffect(() => { if (!isDeepEqual(configuration, configurationRef.current)) { configurationRef.current = configuration; diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx index 9749c49ea4d68..9de39e395a2e9 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useEffect } from 'react'; +import React, { useEffect, useState } from 'react'; import { useActions, useValues } from 'kea'; @@ -21,6 +21,7 @@ import { } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; +import { useKibana } from '@kbn/kibana-react-plugin/public'; import { ConnectorConfigurationComponent, ConnectorStatus } from '@kbn/search-connectors'; @@ -40,6 +41,8 @@ export const ConfigurationStep: React.FC = ({ title, set const { connector } = useValues(ConnectorViewLogic); const { updateConnectorConfiguration } = useActions(ConnectorViewLogic); const { setFormDirty } = useActions(NewConnectorLogic); + const { overlays } = useKibana().services; + const [isFormEditing, setIsFormEditing] = useState(false); const { status } = useValues(ConnectorConfigurationApiLogic); const isSyncing = false; @@ -77,6 +80,7 @@ export const ConfigurationStep: React.FC = ({ title, set connectorId: connector.id, }); }} + onEditStateChange={setIsFormEditing} /> {isSyncing && ( @@ -111,7 +115,21 @@ export const ConfigurationStep: React.FC = ({ title, set { + onClick={async () => { + if (isFormEditing) { + const confirmResponse = await overlays?.openConfirm( + i18n.translate( + 'xpack.enterpriseSearch.createConnector.configurationStep.confirmEditableStepNext', + { + defaultMessage: + 'Connector configuration is in editable mode and there might be unsaved changes. Are you sure you want to finish configuration without saving the configuration?', + } + ) + ); + if (!confirmResponse) { + return; + } + } setFormDirty(false); setCurrentStep('finish'); }} From 980f8542f892031f77910b9d6276d3f95d37ad8d Mon Sep 17 00:00:00 2001 From: kibanamachine <42973632+kibanamachine@users.noreply.github.com> Date: Mon, 2 Dec 2024 14:19:06 +0000 Subject: [PATCH 2/5] [CI] Auto-commit changed files from 'node scripts/eslint --no-cache --fix' --- .../configuration/connector_configuration.tsx | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/packages/kbn-search-connectors/components/configuration/connector_configuration.tsx b/packages/kbn-search-connectors/components/configuration/connector_configuration.tsx index 56e913dde03f3..8adc6ac2e38c4 100644 --- a/packages/kbn-search-connectors/components/configuration/connector_configuration.tsx +++ b/packages/kbn-search-connectors/components/configuration/connector_configuration.tsx @@ -112,11 +112,14 @@ export const ConnectorConfigurationComponent: FC< ); const [isEditing, setIsEditing] = useState(false); - useEffect(function propogateEditState() { - if (onEditStateChange) { - onEditStateChange(isEditing) - } - }, [isEditing, onEditStateChange]) + useEffect( + function propogateEditState() { + if (onEditStateChange) { + onEditStateChange(isEditing); + } + }, + [isEditing, onEditStateChange] + ); useEffect(() => { if (!isDeepEqual(configuration, configurationRef.current)) { From a2306c9b693a28b88e9a0805d0839df1df11b5f8 Mon Sep 17 00:00:00 2001 From: Artem Shelkovnikov Date: Tue, 3 Dec 2024 17:27:18 +0100 Subject: [PATCH 3/5] Change copy for configuration step --- .../create_connector/configuration_step.tsx | 27 ++++++++++++++----- 1 file changed, 20 insertions(+), 7 deletions(-) diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx index 9de39e395a2e9..20bcff3dcdd8b 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx @@ -118,13 +118,26 @@ export const ConfigurationStep: React.FC = ({ title, set onClick={async () => { if (isFormEditing) { const confirmResponse = await overlays?.openConfirm( - i18n.translate( - 'xpack.enterpriseSearch.createConnector.configurationStep.confirmEditableStepNext', - { - defaultMessage: - 'Connector configuration is in editable mode and there might be unsaved changes. Are you sure you want to finish configuration without saving the configuration?', - } - ) + i18n.translate('xpack.enterpriseSearch.createConnector.unsavedPrompt.body', { + defaultMessage: 'Your connector is created but missing some details. You can complete the setup later in the connector configuration page, but this guided flow offers more help.', + }), + { + title: i18n.translate('xpack.enterpriseSearch.createConnector.unsavedPrompt.title', { + defaultMessage: 'Your connector is not fully configured', + }), + cancelButtonText: i18n.translate( + 'xpack.enterpriseSearch.createConnector.unsavedPrompt.cancel', + { + defaultMessage: 'Continue setup', + } + ), + confirmButtonText: i18n.translate( + 'xpack.enterpriseSearch.createConnector.unsavedPrompt.confirm', + { + defaultMessage: 'Leave the page', + } + ), + } ); if (!confirmResponse) { return; From 3df1e85dda603341dfe0f373d2f50e3a2bbfa918 Mon Sep 17 00:00:00 2001 From: kibanamachine <42973632+kibanamachine@users.noreply.github.com> Date: Wed, 4 Dec 2024 11:44:12 +0000 Subject: [PATCH 4/5] [CI] Auto-commit changed files from 'node scripts/eslint --no-cache --fix' --- .../create_connector/configuration_step.tsx | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx index 20bcff3dcdd8b..014b6536bd194 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx @@ -119,12 +119,16 @@ export const ConfigurationStep: React.FC = ({ title, set if (isFormEditing) { const confirmResponse = await overlays?.openConfirm( i18n.translate('xpack.enterpriseSearch.createConnector.unsavedPrompt.body', { - defaultMessage: 'Your connector is created but missing some details. You can complete the setup later in the connector configuration page, but this guided flow offers more help.', + defaultMessage: + 'Your connector is created but missing some details. You can complete the setup later in the connector configuration page, but this guided flow offers more help.', }), { - title: i18n.translate('xpack.enterpriseSearch.createConnector.unsavedPrompt.title', { - defaultMessage: 'Your connector is not fully configured', - }), + title: i18n.translate( + 'xpack.enterpriseSearch.createConnector.unsavedPrompt.title', + { + defaultMessage: 'Your connector is not fully configured', + } + ), cancelButtonText: i18n.translate( 'xpack.enterpriseSearch.createConnector.unsavedPrompt.cancel', { From 7ecd46a54cfe2e601f82a53cdb03155ee4f4cf49 Mon Sep 17 00:00:00 2001 From: Artem Shelkovnikov Date: Wed, 4 Dec 2024 16:11:33 +0100 Subject: [PATCH 5/5] Change translation tags + copy --- .../create_connector/configuration_step.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx index 014b6536bd194..f8bff23aa56a1 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/create_connector/configuration_step.tsx @@ -118,25 +118,25 @@ export const ConfigurationStep: React.FC = ({ title, set onClick={async () => { if (isFormEditing) { const confirmResponse = await overlays?.openConfirm( - i18n.translate('xpack.enterpriseSearch.createConnector.unsavedPrompt.body', { + i18n.translate('xpack.enterpriseSearch.configureConnector.unsavedPrompt.body', { defaultMessage: - 'Your connector is created but missing some details. You can complete the setup later in the connector configuration page, but this guided flow offers more help.', + 'You are still editing connector configuration, are you sure you want to continue without saving? You can complete the setup later in the connector configuration page, but this guided flow offers more help.', }), { title: i18n.translate( - 'xpack.enterpriseSearch.createConnector.unsavedPrompt.title', + 'xpack.enterpriseSearch.configureConnector.unsavedPrompt.title', { - defaultMessage: 'Your connector is not fully configured', + defaultMessage: 'Connector configuration is not saved', } ), cancelButtonText: i18n.translate( - 'xpack.enterpriseSearch.createConnector.unsavedPrompt.cancel', + 'xpack.enterpriseSearch.configureConnector.unsavedPrompt.cancel', { defaultMessage: 'Continue setup', } ), confirmButtonText: i18n.translate( - 'xpack.enterpriseSearch.createConnector.unsavedPrompt.confirm', + 'xpack.enterpriseSearch.configureConnector.unsavedPrompt.confirm', { defaultMessage: 'Leave the page', }