Skip to content

Commit

Permalink
Add prompt for connector configuration being in editable mode (#202463)
Browse files Browse the repository at this point in the history
### Closes elastic/search-team#8547
## Summary

User creates connectors following a set of steps. During configuration
step they are able to open configuration form and then click "Next" -
configuration will not be saved and user will not be prompted about it.

This change adds a prompt for this step - if the configuration is in
editable state, the prompt will be shown. It does not check that the
form was edited, however, and it's on purpose. I'm open to changing it
to only prompt if any value changed, but I feel that it's important to
prompt even if no values were entered, just to confirm with the user
that they want to move on without specifying any values.

https://github.com/user-attachments/assets/af768d6d-282d-4f67-a1d0-c54bcf1cb2d0

### Checklist

Check the PR satisfies following conditions.

Reviewers should verify this PR satisfies this list as well.

- [ ] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
- [ ]
[Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html)
was added for features that require explanation or tutorials
- [ ] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [ ] If a plugin configuration key changed, check if it needs to be
allowlisted in the cloud and added to the [docker
list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker)
- [ ] This was checked for breaking HTTP API changes, and any breaking
changes have been approved by the breaking-change committee. The
`release_note:breaking` label should be applied in these situations.
- [ ] [Flaky Test
Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was
used on any tests changed
- [ ] The PR description includes the appropriate Release Notes section,
and the correct `release_note:*` label is applied per the
[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)

---------

Co-authored-by: kibanamachine <[email protected]>
(cherry picked from commit b8a4101)
  • Loading branch information
artem-shelkovnikov committed Dec 5, 2024
1 parent a93125e commit 03a390e
Show file tree
Hide file tree
Showing 2 changed files with 48 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,7 @@ interface ConnectorConfigurationProps {
isLoading: boolean;
saveConfig: (configuration: Record<string, string | number | boolean | null>) => void;
saveAndSync?: (configuration: Record<string, string | number | boolean | null>) => void;
onEditStateChange?: (isEdit: boolean) => void;
stackManagementLink?: string;
subscriptionLink?: string;
children?: React.ReactNode;
Expand Down Expand Up @@ -94,6 +95,7 @@ export const ConnectorConfigurationComponent: FC<
isLoading,
saveConfig,
saveAndSync,
onEditStateChange,
subscriptionLink,
stackManagementLink,
}) => {
Expand All @@ -110,6 +112,15 @@ 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;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
* 2.0.
*/

import React, { useEffect } from 'react';
import React, { useEffect, useState } from 'react';

import { useActions, useValues } from 'kea';

Expand All @@ -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';

Expand All @@ -40,6 +41,8 @@ export const ConfigurationStep: React.FC<ConfigurationStepProps> = ({ title, set
const { connector } = useValues(ConnectorViewLogic);
const { updateConnectorConfiguration } = useActions(ConnectorViewLogic);
const { setFormDirty } = useActions(NewConnectorLogic);
const { overlays } = useKibana().services;
const [isFormEditing, setIsFormEditing] = useState<boolean>(false);
const { status } = useValues(ConnectorConfigurationApiLogic);
const isSyncing = false;

Expand Down Expand Up @@ -77,6 +80,7 @@ export const ConfigurationStep: React.FC<ConfigurationStepProps> = ({ title, set
connectorId: connector.id,
});
}}
onEditStateChange={setIsFormEditing}
/>
<EuiSpacer size="m" />
{isSyncing && (
Expand Down Expand Up @@ -111,7 +115,38 @@ export const ConfigurationStep: React.FC<ConfigurationStepProps> = ({ title, set
<EuiSpacer size="m" />
<EuiButton
data-test-subj="enterpriseSearchStartStepGenerateConfigurationButton"
onClick={() => {
onClick={async () => {
if (isFormEditing) {
const confirmResponse = await overlays?.openConfirm(
i18n.translate('xpack.enterpriseSearch.configureConnector.unsavedPrompt.body', {
defaultMessage:
'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.configureConnector.unsavedPrompt.title',
{
defaultMessage: 'Connector configuration is not saved',
}
),
cancelButtonText: i18n.translate(
'xpack.enterpriseSearch.configureConnector.unsavedPrompt.cancel',
{
defaultMessage: 'Continue setup',
}
),
confirmButtonText: i18n.translate(
'xpack.enterpriseSearch.configureConnector.unsavedPrompt.confirm',
{
defaultMessage: 'Leave the page',
}
),
}
);
if (!confirmResponse) {
return;
}
}
setFormDirty(false);
setCurrentStep('finish');
}}
Expand Down

0 comments on commit 03a390e

Please sign in to comment.