[ResponseOps][Connectors] Add support of additional fields for ServiceNow ITSM and SecOps

x-pack/plugins/stack_connectors/common/servicenow/constants.ts

@@ -0,0 +1,8 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+export const MAX_ADDITIONAL_FIELDS_LENGTH = 20;

x-pack/plugins/stack_connectors/public/connector_types/jira/jira.test.tsx

@@ -89,9 +89,7 @@ describe('jira action params validation', () => {
       errors: {
         'subActionParams.incident.summary': [],
         'subActionParams.incident.labels': [],
-        'subActionParams.incident.otherFields': [
-          'Additional fields field must be a valid JSON object.',
-        ],
+        'subActionParams.incident.otherFields': ['Invalid JSON.'],
       },
     });
   });
@@ -142,7 +140,7 @@ describe('jira action params validation', () => {
         'subActionParams.incident.summary': [],
         'subActionParams.incident.labels': [],
         'subActionParams.incident.otherFields': [
-          `A maximum of ${MAX_OTHER_FIELDS_LENGTH} additional fields can be defined at a time.`,
+          `A maximum of ${MAX_OTHER_FIELDS_LENGTH} attributes can be defined at a time.`,
         ],
       },
     });

x-pack/plugins/stack_connectors/public/connector_types/jira/jira.tsx

@@ -13,6 +13,7 @@ import type {
 } from '@kbn/triggers-actions-ui-plugin/public';
 import { MAX_OTHER_FIELDS_LENGTH } from '../../../common/jira/constants';
 import { JiraConfig, JiraSecrets, JiraActionParams } from './types';
+import { validateJSON } from '../lib/validate_json';
 
 export const JIRA_DESC = i18n.translate('xpack.stackConnectors.components.jira.selectMessageText', {
   defaultMessage: 'Create an incident in Jira.',
@@ -58,19 +59,15 @@ export function getConnectorType(): ConnectorTypeModel<JiraConfig, JiraSecrets,
           errors['subActionParams.incident.labels'].push(translations.LABELS_WHITE_SPACES);
       }
 
-      try {
-        const otherFields = actionParams.subActionParams?.incident?.otherFields;
-        if (otherFields) {
-          const parsedOtherFields = JSON.parse(otherFields);
-          if (Object.keys(parsedOtherFields).length > MAX_OTHER_FIELDS_LENGTH) {
-            errors['subActionParams.incident.otherFields'] = [
-              translations.OTHER_FIELDS_LENGTH_ERROR(MAX_OTHER_FIELDS_LENGTH),
-            ];
-          }
-        }
-      } catch (error) {
-        errors['subActionParams.incident.otherFields'] = [translations.INVALID_JSON_FORMAT];
+      const jsonErrors = validateJSON({
+        value: actionParams.subActionParams?.incident?.otherFields,
+        maxProperties: MAX_OTHER_FIELDS_LENGTH,
+      });
+
+      if (jsonErrors) {
+        errors['subActionParams.incident.otherFields'] = [jsonErrors];
       }
+
       return validationResult;
     },
     actionParamsFields: lazy(() => import('./jira_params')),

x-pack/plugins/stack_connectors/public/connector_types/lib/servicenow/additional_fields.test.tsx

@@ -0,0 +1,75 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React from 'react';
+import { render, screen, waitFor } from '@testing-library/react';
+import { __IntlProvider as IntlProvider } from '@kbn/i18n-react';
+import { AdditionalFields } from './additional_fields';
+import userEvent from '@testing-library/user-event';
+
+describe('Credentials', () => {
+  const onChange = jest.fn();
+  const value = JSON.stringify({ foo: 'test' });
+  const props = { value, errors: [], onChange };
+
+  it('renders the additional fields correctly', async () => {
+    render(
+      <IntlProvider locale="en">
+        <AdditionalFields {...props} />
+      </IntlProvider>
+    );
+
+    expect(await screen.findByTestId('additionalFields')).toBeInTheDocument();
+  });
+
+  it('sets the value correctly', async () => {
+    render(
+      <IntlProvider locale="en">
+        <AdditionalFields {...props} />
+      </IntlProvider>
+    );
+
+    expect(await screen.findByText(value)).toBeInTheDocument();
+  });
+
+  it('changes the value correctly', async () => {
+    const newValue = JSON.stringify({ bar: 'test' });
+
+    render(
+      <IntlProvider locale="en">
+        <AdditionalFields {...props} value={undefined} />
+      </IntlProvider>
+    );
+
+    userEvent.paste(await screen.findByTestId('additional_fieldsJsonEditor'), newValue);
+
+    await waitFor(() => {
+      expect(onChange).toHaveBeenCalledWith(newValue);
+    });
+
+    expect(await screen.findByText(newValue)).toBeInTheDocument();
+  });
+
+  it('updating wth an empty string sets its value to null', async () => {
+    const newValue = JSON.stringify({ bar: 'test' });
+
+    render(
+      <IntlProvider locale="en">
+        <AdditionalFields {...props} value={undefined} />
+      </IntlProvider>
+    );
+
+    const editor = await screen.findByTestId('additional_fieldsJsonEditor');
+
+    userEvent.paste(editor, newValue);
+    userEvent.clear(editor);
+
+    await waitFor(() => {
+      expect(onChange).toHaveBeenCalledWith(null);
+    });
+  });
+});

x-pack/plugins/stack_connectors/public/connector_types/lib/servicenow/additional_fields.tsx

@@ -0,0 +1,54 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { EuiIconTip } from '@elastic/eui';
+import { JsonEditorWithMessageVariables } from '@kbn/triggers-actions-ui-plugin/public';
+import React from 'react';
+import { ActionVariable } from '@kbn/alerting-types';
+import { isEmpty } from 'lodash';
+import * as i18n from './translations';
+
+interface AdditionalFieldsProps {
+  value?: string | null;
+  errors?: string[];
+  messageVariables?: ActionVariable[];
+  onChange: (value: string | null) => void;
+}
+
+export const AdditionalFieldsComponent: React.FC<AdditionalFieldsProps> = ({
+  value,
+  errors,
+  messageVariables,
+  onChange,
+}) => {
+  return (
+    <JsonEditorWithMessageVariables
+      messageVariables={messageVariables}
+      paramsProperty={'additional_fields'}
+      inputTargetValue={value}
+      errors={errors ?? []}
+      dataTestSubj="additionalFields"
+      label={
+        <>
+          {i18n.ADDITIONAL_FIELDS}
+          <EuiIconTip
+            size="s"
+            color="subdued"
+            type="questionInCircle"
+            className="eui-alignTop"
+            data-test-subj="otherFieldsHelpTooltip"
+            aria-label={i18n.ADDITIONAL_FIELDS_HELP}
+            content={i18n.ADDITIONAL_FIELDS_HELP_TEXT}
+          />
+        </>
+      }
+      onDocumentsChange={(json: string) => onChange(isEmpty(json) ? null : json)}
+    />
+  );
+};
+
+export const AdditionalFields = React.memo(AdditionalFieldsComponent);

x-pack/plugins/stack_connectors/public/connector_types/lib/servicenow/translations.ts

@@ -441,3 +441,32 @@ export const ADDITIONAL_INFO_JSON_ERROR = i18n.translate(
     defaultMessage: 'The additional info field does not have a valid JSON format.',
   }
 );
+
+export const ADDITIONAL_FIELDS = i18n.translate(
+  'xpack.stackConnectors.components.servicenow.additionalFieldsTooltip',
+  {
+    defaultMessage: 'Additional fields',
+  }
+);
+
+export const ADDITIONAL_FIELDS_HELP = i18n.translate(
+  'xpack.stackConnectors.components.servicenow.additionalFieldsHelpTooltip',
+  {
+    defaultMessage: 'Additional fields help',
+  }
+);
+
+export const ADDITIONAL_FIELDS_HELP_TEXT = i18n.translate(
+  'xpack.stackConnectors.components.servicenow.additionalFieldsHelpTooltipText',
+  {
+    defaultMessage:
+      'Additional fields in JSON format as defined in the Elastic ServiceNow application',
+  }
+);
+
+export const ADDITIONAL_FIELDS_JSON_ERROR = i18n.translate(
+  'xpack.stackConnectors.components.servicenow.additionalFieldsError',
+  {
+    defaultMessage: 'No valid JSON.',
+  }
+);

x-pack/plugins/stack_connectors/public/connector_types/lib/validate_json.test.ts

@@ -0,0 +1,36 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { validateJSON } from './validate_json';
+
+describe('validateJSON', () => {
+  it('does not return an error for valid JSON and no maxProperties', () => {
+    expect(validateJSON({ value: JSON.stringify({ foo: 'test' }) })).toBeUndefined();
+  });
+
+  it('does not return an error for valid JSON and attributes less than maxProperties', () => {
+    expect(
+      validateJSON({ value: JSON.stringify({ foo: 'test' }), maxProperties: 1 })
+    ).toBeUndefined();
+  });
+
+  it('does not return an error with empty value and maxProperties=0', () => {
+    expect(validateJSON({ maxProperties: 0 })).toBeUndefined();
+  });
+
+  it('validates syntax errors correctly', () => {
+    expect(validateJSON({ value: 'foo' })).toBe('Invalid JSON.');
+  });
+
+  it('validates max properties correctly', () => {
+    const value = { foo: 'test', bar: 'test 2' };
+
+    expect(validateJSON({ value: JSON.stringify(value), maxProperties: 1 })).toBe(
+      'A maximum of 1 attributes can be defined at a time.'
+    );
+  });
+});

x-pack/plugins/stack_connectors/public/connector_types/lib/validate_json.ts

@@ -0,0 +1,40 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { i18n } from '@kbn/i18n';
+
+interface ValidateJSONArgs {
+  value?: string | null;
+  maxProperties?: number;
+}
+
+export const MAX_ATTRIBUTES_ERROR = (length: number) =>
+  i18n.translate('xpack.stackConnectors.schema.additionalFieldsLengthError', {
+    values: { length },
+    defaultMessage: 'A maximum of {length} attributes can be defined at a time.',
+  });
+
+export const INVALID_JSON_FORMAT = i18n.translate(
+  'xpack.stackConnectors.components.otherFieldsFormatErrorMessage',
+  {
+    defaultMessage: 'Invalid JSON.',
+  }
+);
+
+export const validateJSON = ({ value, maxProperties }: ValidateJSONArgs) => {
+  try {
+    if (value) {
+      const parsedOtherFields = JSON.parse(value);
+
+      if (maxProperties && Object.keys(parsedOtherFields).length > maxProperties) {
+        return MAX_ATTRIBUTES_ERROR(maxProperties);
+      }
+    }
+  } catch (error) {
+    return INVALID_JSON_FORMAT;
+  }
+};

x-pack/plugins/stack_connectors/public/connector_types/servicenow_itsm/servicenow_itsm.test.tsx

@@ -10,6 +10,7 @@ import { registerConnectorTypes } from '..';
 import type { ActionTypeModel as ConnectorTypeModel } from '@kbn/triggers-actions-ui-plugin/public/types';
 import { experimentalFeaturesMock, registrationServicesMock } from '../../mocks';
 import { ExperimentalFeaturesService } from '../../common/experimental_features_service';
+import { MAX_ADDITIONAL_FIELDS_LENGTH } from '../../../common/servicenow/constants';
 
 const SERVICENOW_ITSM_CONNECTOR_TYPE_ID = '.servicenow';
 let connectorTypeRegistry: TypeRegistry<ConnectorTypeModel>;
@@ -31,13 +32,15 @@ describe('servicenow action params validation', () => {
   test(`${SERVICENOW_ITSM_CONNECTOR_TYPE_ID}: action params validation succeeds when action params is valid`, async () => {
     const connectorTypeModel = connectorTypeRegistry.get(SERVICENOW_ITSM_CONNECTOR_TYPE_ID);
     const actionParams = {
+      subAction: 'pushToService',
       subActionParams: { incident: { short_description: 'some title {{test}}' }, comments: [] },
     };
 
     expect(await connectorTypeModel.validateParams(actionParams)).toEqual({
       errors: {
         ['subActionParams.incident.correlation_id']: [],
         ['subActionParams.incident.short_description']: [],
+        ['subActionParams.incident.additional_fields']: [],
       },
     });
   });
@@ -53,6 +56,7 @@ describe('servicenow action params validation', () => {
       errors: {
         ['subActionParams.incident.correlation_id']: [],
         ['subActionParams.incident.short_description']: [],
+        ['subActionParams.incident.additional_fields']: [],
       },
     });
   });
@@ -67,6 +71,7 @@ describe('servicenow action params validation', () => {
       errors: {
         ['subActionParams.incident.correlation_id']: [],
         ['subActionParams.incident.short_description']: ['Short description is required.'],
+        ['subActionParams.incident.additional_fields']: [],
       },
     });
   });
@@ -82,6 +87,52 @@ describe('servicenow action params validation', () => {
       errors: {
         ['subActionParams.incident.correlation_id']: ['Correlation id is required.'],
         ['subActionParams.incident.short_description']: [],
+        ['subActionParams.incident.additional_fields']: [],
+      },
+    });
+  });
+
+  test('params validation fails when additional_fields is not valid JSON', async () => {
+    const connectorTypeModel = connectorTypeRegistry.get(SERVICENOW_ITSM_CONNECTOR_TYPE_ID);
+    const actionParams = {
+      subAction: 'pushToService',
+      subActionParams: {
+        incident: { short_description: 'some title', additional_fields: 'invalid json' },
+      },
+    };
+
+    expect(await connectorTypeModel.validateParams(actionParams)).toEqual({
+      errors: {
+        'subActionParams.incident.correlation_id': [],
+        'subActionParams.incident.short_description': [],
+        'subActionParams.incident.additional_fields': ['Invalid JSON.'],
+      },
+    });
+  });
+
+  test(`params validation succeeds when its valid json and additional_fields has ${
+    MAX_ADDITIONAL_FIELDS_LENGTH + 1
+  } fields`, async () => {
+    const longJSON: { [key in string]: string } = {};
+    for (let i = 0; i < MAX_ADDITIONAL_FIELDS_LENGTH + 1; i++) {
+      longJSON[`key${i}`] = 'value';
+    }
+
+    const connectorTypeModel = connectorTypeRegistry.get(SERVICENOW_ITSM_CONNECTOR_TYPE_ID);
+    const actionParams = {
+      subAction: 'pushToService',
+      subActionParams: {
+        incident: { short_description: 'some title', additional_fields: JSON.stringify(longJSON) },
+      },
+    };
+
+    expect(await connectorTypeModel.validateParams(actionParams)).toEqual({
+      errors: {
+        'subActionParams.incident.correlation_id': [],
+        'subActionParams.incident.short_description': [],
+        ['subActionParams.incident.additional_fields']: [
+          `A maximum of ${MAX_ADDITIONAL_FIELDS_LENGTH} attributes can be defined at a time.`,
+        ],
       },
     });
   });