Add UI notifier to indicate secret fields and to remember / reenter values

x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/email/email_connector.test.tsx

@@ -74,4 +74,51 @@ describe('EmailActionConnectorFields renders', () => {
  expect(wrapper.find('[data-test-subj="emailUserInput"]').length > 0).toBeFalsy();
  expect(wrapper.find('[data-test-subj="emailPasswordInput"]').length > 0).toBeFalsy();
  });
+
+ test('should display a message to remember username and password when creating a connector with authentication', () => {
+ const actionConnector = {
+ actionTypeId: '.email',
+ config: {
+ hasAuth: true,
+ },
+ secrets: {},
+ } as EmailActionConnector;
+ const wrapper = mountWithIntl(
+ <EmailActionConnectorFields
+ action={actionConnector}
+ errors={{ from: [], port: [], host: [], user: [], password: [] }}
+ editActionConfig={() => {}}
+ editActionSecrets={() => {}}
+ docLinks={{ ELASTIC_WEBSITE_URL: '', DOC_LINK_VERSION: '' } as DocLinksStart}
+ readOnly={false}
+ />
+ );
+ expect(wrapper.find('[data-test-subj="rememberValuesMessage"]').length).toBeGreaterThan(0);
+ expect(wrapper.find('[data-test-subj="reenterValuesMessage"]').length).toEqual(0);
+ });
+
+ test('should display a message when editing an authenticated email connector explaining why username and password must be re-entered', () => {
+ const actionConnector = {
+ secrets: {},
+ id: 'test',
+ actionTypeId: '.email',
+ name: 'email',
+ config: {
+ from: '[email protected]',
+ hasAuth: true,
+ },
+ } as EmailActionConnector;
+ const wrapper = mountWithIntl(
+ <EmailActionConnectorFields
+ action={actionConnector}
+ errors={{ from: [], port: [], host: [], user: [], password: [] }}
+ editActionConfig={() => {}}
+ editActionSecrets={() => {}}
+ docLinks={{ ELASTIC_WEBSITE_URL: '', DOC_LINK_VERSION: '' } as DocLinksStart}
+ readOnly={false}
+ />
+ );
+ expect(wrapper.find('[data-test-subj="reenterValuesMessage"]').length).toBeGreaterThan(0);
+ expect(wrapper.find('[data-test-subj="rememberValuesMessage"]').length).toEqual(0);
+ });
 });

x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/email/email_connector.tsx

@@ -12,6 +12,7 @@ import {
  EuiFieldPassword,
  EuiSwitch,
  EuiFormRow,
+ EuiText,
  EuiTitle,
  EuiSpacer,
  EuiCallOut,
@@ -202,17 +203,7 @@ export const EmailActionConnectorFields: React.FunctionComponent<ActionConnector
  </EuiFlexGroup>
  {hasAuth ? (
  <>
- {action.id ? (
- <>
- <EuiSpacer size="m" />
- <EuiCallOut
- size="s"
- title="Username and password are encrypted. Please reenter values for these fields."
- iconType="iInCircle"
- />
- <EuiSpacer size="m" />
- </>
- ) : null}
+ {getEncryptedFieldNotifyLabel(!action.id)}
  <EuiFlexGroup justifyContent="spaceBetween">
  <EuiFlexItem>
  <EuiFormRow
@@ -289,5 +280,40 @@ function nullableString(str: string | null | undefined) {
  return str;
 }
 
+function getEncryptedFieldNotifyLabel(isCreate: boolean) {
+ if (isCreate) {
+ return (
+ <Fragment>
+ <EuiSpacer size="s" />
+ <EuiText color="secondary" size="s" data-test-subj="rememberValuesMessage">
+ <FormattedMessage
+ id="xpack.triggersActionsUI.components.builtinActionTypes.emailAction.rememberValuesLabel"
+ defaultMessage="Remember these values. You must reenter them each time you edit the connector."
+ />
+ </EuiText>
+ <EuiSpacer size="s" />
+ </Fragment>
+ );
+ }
+ return (
+ <Fragment>
+ <EuiSpacer size="m" />
+ <EuiCallOut
+ size="s"
+ iconType="iInCircle"
+ data-test-subj="reenterValuesMessage"
+ title={i18n.translate(
+ 'xpack.triggersActionsUI.components.builtinActionTypes.emailAction.reenterValuesLabel',
+ {
+ defaultMessage:
+ 'Username and password are encrypted. Please reenter values for these fields.',
+ }
+ )}
+ />
+ <EuiSpacer size="m" />
+ </Fragment>
+ );
+}
+
 // eslint-disable-next-line import/no-default-export
 export { EmailActionConnectorFields as default };

x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira_connectors.test.tsx

@@ -96,4 +96,60 @@ describe('JiraActionConnectorFields renders', () => {
  wrapper.find('[data-test-subj="connector-jira-apiToken-form-input"]').length > 0
  ).toBeTruthy();
  });
+
+ test('should display a message on create to remember credentials', () => {
+ const actionConnector = {
+ actionTypeId: '.jira',
+ isPreconfigured: false,
+ secrets: {},
+ config: {},
+ } as JiraActionConnector;
+ const deps = {
+ docLinks: { ELASTIC_WEBSITE_URL: '', DOC_LINK_VERSION: '' } as DocLinksStart,
+ };
+ const wrapper = mountWithIntl(
+ <JiraConnectorFields
+ action={actionConnector}
+ errors={{ apiUrl: [], email: [], apiToken: [], projectKey: [] }}
+ editActionConfig={() => {}}
+ editActionSecrets={() => {}}
+ docLinks={deps!.docLinks}
+ readOnly={false}
+ />
+ );
+ expect(wrapper.find('[data-test-subj="rememberValuesMessage"]').length).toBeGreaterThan(0);
+ expect(wrapper.find('[data-test-subj="reenterValuesMessage"]').length).toEqual(0);
+ });
+
+ test('should display a message on edit to re-enter credentials', () => {
+ const actionConnector = {
+ secrets: {
+ email: 'email',
+ apiToken: 'token',
+ },
+ id: 'test',
+ actionTypeId: '.jira',
+ isPreconfigured: false,
+ name: 'jira',
+ config: {
+ apiUrl: 'https://test/',
+ projectKey: 'CK',
+ },
+ } as JiraActionConnector;
+ const deps = {
+ docLinks: { ELASTIC_WEBSITE_URL: '', DOC_LINK_VERSION: '' } as DocLinksStart,
+ };
+ const wrapper = mountWithIntl(
+ <JiraConnectorFields
+ action={actionConnector}
+ errors={{ apiUrl: [], email: [], apiToken: [], projectKey: [] }}
+ editActionConfig={() => {}}
+ editActionSecrets={() => {}}
+ docLinks={deps!.docLinks}
+ readOnly={false}
+ />
+ );
+ expect(wrapper.find('[data-test-subj="reenterValuesMessage"]').length).toBeGreaterThan(0);
+ expect(wrapper.find('[data-test-subj="rememberValuesMessage"]').length).toEqual(0);
+ });
 });

x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/jira_connectors.tsx

@@ -6,12 +6,15 @@
 import React, { useCallback } from 'react';
 
 import {
+ EuiCallOut,
  EuiFieldText,
  EuiFlexGroup,
  EuiFlexItem,
  EuiFormRow,
  EuiFieldPassword,
  EuiSpacer,
+ EuiText,
+ EuiTitle,
 } from '@elastic/eui';
 
 import { isEmpty } from 'lodash';
@@ -133,6 +136,20 @@ const JiraConnectorFields: React.FC<ActionConnectorFieldsProps<JiraActionConnect
  </EuiFlexItem>
  </EuiFlexGroup>
  <EuiSpacer size="m" />
+ <EuiFlexGroup>
+ <EuiFlexItem>
+ <EuiTitle size="xxs">
+ <h4>{i18n.JIRA_AUTHENTICATION_LABEL}</h4>
+ </EuiTitle>
+ </EuiFlexItem>
+ </EuiFlexGroup>
+ <EuiSpacer size="m" />
+ <EuiFlexGroup>
+ <EuiFlexItem>
+ <EuiFormRow fullWidth>{getEncryptedFieldNotifyLabel(!action.id)}</EuiFormRow>
+ </EuiFlexItem>
+ </EuiFlexGroup>
+ <EuiSpacer size="m" />
  <EuiFlexGroup>
  <EuiFlexItem>
  <EuiFormRow
@@ -205,5 +222,23 @@ const JiraConnectorFields: React.FC<ActionConnectorFieldsProps<JiraActionConnect
  );
 };
 
+function getEncryptedFieldNotifyLabel(isCreate: boolean) {
+ if (isCreate) {
+ return (
+ <EuiText color="secondary" size="s" data-test-subj="rememberValuesMessage">
+ {i18n.JIRA_REMEMBER_VALUES_LABEL}
+ </EuiText>
+ );
+ }
+ return (
+ <EuiCallOut
+ size="s"
+ iconType="iInCircle"
+ title={i18n.JIRA_REENTER_VALUES_LABEL}
+ data-test-subj="reenterValuesMessage"
+ />
+ );
+}
+
 // eslint-disable-next-line import/no-default-export
 export { JiraConnectorFields as default };

x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/jira/translations.ts

@@ -55,6 +55,29 @@ export const JIRA_PROJECT_KEY_REQUIRED = i18n.translate(
  }
 );
 
+export const JIRA_AUTHENTICATION_LABEL = i18n.translate(
+ 'xpack.triggersActionsUI.components.builtinActionTypes.jira.authenticationLabel',
+ {
+ defaultMessage: 'Authentication',
+ }
+);
+
+export const JIRA_REMEMBER_VALUES_LABEL = i18n.translate(
+ 'xpack.triggersActionsUI.components.builtinActionTypes.jira.rememberValuesLabel',
+ {
+ defaultMessage:
+ 'Remember these values. You must reenter them each time you edit the connector.',
+ }
+);
+
+export const JIRA_REENTER_VALUES_LABEL = i18n.translate(
+ 'xpack.triggersActionsUI.components.builtinActionTypes.jira.reenterValuesLabel',
+ {
+ defaultMessage:
+ 'Authentication credentials are encrypted. Please reenter values for these fields.',
+ }
+);
+
 export const JIRA_EMAIL_LABEL = i18n.translate(
  'xpack.triggersActionsUI.components.builtinActionTypes.jira.emailTextFieldLabel',
  {

x-pack/plugins/triggers_actions_ui/public/application/components/builtin_action_types/pagerduty/pagerduty_connectors.test.tsx

@@ -49,4 +49,56 @@ describe('PagerDutyActionConnectorFields renders', () => {
  );
  expect(wrapper.find('[data-test-subj="pagerdutyRoutingKeyInput"]').length > 0).toBeTruthy();
  });
+
+ test('should display a message on create to remember credentials', () => {
+ const actionConnector = {
+ actionTypeId: '.pagerduty',
+ secrets: {},
+ config: {},
+ } as PagerDutyActionConnector;
+ const deps = {
+ docLinks: { ELASTIC_WEBSITE_URL: '', DOC_LINK_VERSION: '' } as DocLinksStart,
+ };
+ const wrapper = mountWithIntl(
+ <PagerDutyActionConnectorFields
+ action={actionConnector}
+ errors={{ index: [], routingKey: [] }}
+ editActionConfig={() => {}}
+ editActionSecrets={() => {}}
+ docLinks={deps!.docLinks}
+ readOnly={false}
+ />
+ );
+ expect(wrapper.find('[data-test-subj="rememberValuesMessage"]').length).toBeGreaterThan(0);
+ expect(wrapper.find('[data-test-subj="reenterValuesMessage"]').length).toEqual(0);
+ });
+
+ test('should display a message on edit to re-enter credentials', () => {
+ const actionConnector = {
+ secrets: {
+ routingKey: 'test',
+ },
+ id: 'test',
+ actionTypeId: '.pagerduty',
+ name: 'pagerduty',
+ config: {
+ apiUrl: 'http:\\test',
+ },
+ } as PagerDutyActionConnector;
+ const deps = {
+ docLinks: { ELASTIC_WEBSITE_URL: '', DOC_LINK_VERSION: '' } as DocLinksStart,
+ };
+ const wrapper = mountWithIntl(
+ <PagerDutyActionConnectorFields
+ action={actionConnector}
+ errors={{ index: [], routingKey: [] }}
+ editActionConfig={() => {}}
+ editActionSecrets={() => {}}
+ docLinks={deps!.docLinks}
+ readOnly={false}
+ />
+ );
+ expect(wrapper.find('[data-test-subj="reenterValuesMessage"]').length).toBeGreaterThan(0);
+ expect(wrapper.find('[data-test-subj="rememberValuesMessage"]').length).toEqual(0);
+ });
 });