parent
b5c3d85982
commit
c49c4199b8
|
@ -5,14 +5,16 @@
|
|||
* 2.0.
|
||||
*/
|
||||
|
||||
import { ConnectorTypes } from '../../../../common';
|
||||
import { ActionTypeConnector, ConnectorTypes } from '../../../../common';
|
||||
import { ActionConnector } from '../../../containers/configure/types';
|
||||
import { UseConnectorsResponse } from '../../../containers/configure/use_connectors';
|
||||
import { ReturnUseCaseConfigure } from '../../../containers/configure/use_configure';
|
||||
import { UseActionTypesResponse } from '../../../containers/configure/use_action_types';
|
||||
import { connectorsMock, actionTypesMock } from '../../../containers/configure/mock';
|
||||
export { mappings } from '../../../containers/configure/mock';
|
||||
|
||||
export const connectors: ActionConnector[] = connectorsMock;
|
||||
export const actionTypes: ActionTypeConnector[] = actionTypesMock;
|
||||
|
||||
export const searchURL =
|
||||
'?timerange=(global:(linkTo:!(),timerange:(from:1585487656371,fromStr:now-24h,kind:relative,to:1585574056371,toStr:now)),timeline:(linkTo:!(),timerange:(from:1585227005527,kind:absolute,to:1585313405527)))';
|
||||
|
|
|
@ -11,7 +11,7 @@ import { mount, ReactWrapper } from 'enzyme';
|
|||
import { Connectors, Props } from './connectors';
|
||||
import { TestProviders } from '../../common/mock';
|
||||
import { ConnectorsDropdown } from './connectors_dropdown';
|
||||
import { connectors } from './__mock__';
|
||||
import { connectors, actionTypes } from './__mock__';
|
||||
import { ConnectorTypes } from '../../../common';
|
||||
import { useKibana } from '../../common/lib/kibana';
|
||||
|
||||
|
@ -24,6 +24,7 @@ describe('Connectors', () => {
|
|||
const handleShowEditFlyout = jest.fn();
|
||||
|
||||
const props: Props = {
|
||||
actionTypes,
|
||||
connectors,
|
||||
disabled: false,
|
||||
handleShowEditFlyout,
|
||||
|
|
|
@ -21,7 +21,7 @@ import * as i18n from './translations';
|
|||
|
||||
import { ActionConnector, CaseConnectorMapping } from '../../containers/configure/types';
|
||||
import { Mapping } from './mapping';
|
||||
import { ConnectorTypes } from '../../../common';
|
||||
import { ActionTypeConnector, ConnectorTypes } from '../../../common';
|
||||
|
||||
const EuiFormRowExtended = styled(EuiFormRow)`
|
||||
.euiFormRow__labelWrapper {
|
||||
|
@ -32,6 +32,7 @@ const EuiFormRowExtended = styled(EuiFormRow)`
|
|||
`;
|
||||
|
||||
export interface Props {
|
||||
actionTypes: ActionTypeConnector[];
|
||||
connectors: ActionConnector[];
|
||||
disabled: boolean;
|
||||
handleShowEditFlyout: () => void;
|
||||
|
@ -42,6 +43,7 @@ export interface Props {
|
|||
updateConnectorDisabled: boolean;
|
||||
}
|
||||
const ConnectorsComponent: React.FC<Props> = ({
|
||||
actionTypes,
|
||||
connectors,
|
||||
disabled,
|
||||
handleShowEditFlyout,
|
||||
|
@ -56,6 +58,11 @@ const ConnectorsComponent: React.FC<Props> = ({
|
|||
[connectors, selectedConnector.id]
|
||||
);
|
||||
|
||||
const actionTypeName = useMemo(
|
||||
() => actionTypes.find((c) => c.id === selectedConnector.type)?.name ?? 'Unknown',
|
||||
[actionTypes, selectedConnector.type]
|
||||
);
|
||||
|
||||
const dropDownLabel = useMemo(
|
||||
() => (
|
||||
<EuiFlexGroup justifyContent="spaceBetween">
|
||||
|
@ -103,7 +110,7 @@ const ConnectorsComponent: React.FC<Props> = ({
|
|||
{selectedConnector.type !== ConnectorTypes.none ? (
|
||||
<EuiFlexItem grow={false}>
|
||||
<Mapping
|
||||
connectorActionTypeId={selectedConnector.type}
|
||||
actionTypeName={actionTypeName}
|
||||
isLoading={isLoading}
|
||||
mappings={mappings}
|
||||
/>
|
||||
|
|
|
@ -12,24 +12,16 @@ import { FieldMapping, FieldMappingProps } from './field_mapping';
|
|||
import { mappings } from './__mock__';
|
||||
import { TestProviders } from '../../common/mock';
|
||||
import { FieldMappingRowStatic } from './field_mapping_row_static';
|
||||
import { useKibana } from '../../common/lib/kibana';
|
||||
|
||||
jest.mock('../../common/lib/kibana');
|
||||
const useKibanaMock = useKibana as jest.Mocked<typeof useKibana>;
|
||||
|
||||
describe('FieldMappingRow', () => {
|
||||
let wrapper: ReactWrapper;
|
||||
const props: FieldMappingProps = {
|
||||
actionTypeName: 'ServiceNow ITSM',
|
||||
isLoading: false,
|
||||
mappings,
|
||||
connectorActionTypeId: '.servicenow',
|
||||
};
|
||||
|
||||
beforeAll(() => {
|
||||
useKibanaMock().services.triggersActionsUi.actionTypeRegistry.get = jest.fn().mockReturnValue({
|
||||
actionTypeTitle: '.servicenow',
|
||||
iconClass: 'logoSecurity',
|
||||
});
|
||||
wrapper = mount(<FieldMapping {...props} />, { wrappingComponent: TestProviders });
|
||||
});
|
||||
|
||||
|
@ -61,4 +53,13 @@ describe('FieldMappingRow', () => {
|
|||
expect(row.prop('selectedThirdParty')).toEqual(mappings[index].target);
|
||||
});
|
||||
});
|
||||
|
||||
test('displays the label of the second column correctly', () => {
|
||||
expect(
|
||||
wrapper
|
||||
.find('[data-test-subj="case-configure-field-mappings-second-col-label"]')
|
||||
.first()
|
||||
.text()
|
||||
).toBe('ServiceNow ITSM field');
|
||||
});
|
||||
});
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
* 2.0.
|
||||
*/
|
||||
|
||||
import React, { useMemo } from 'react';
|
||||
import React from 'react';
|
||||
import { EuiFlexItem, EuiFlexGroup } from '@elastic/eui';
|
||||
import styled from 'styled-components';
|
||||
|
||||
|
@ -13,7 +13,6 @@ import { FieldMappingRowStatic } from './field_mapping_row_static';
|
|||
import * as i18n from './translations';
|
||||
|
||||
import { CaseConnectorMapping } from '../../containers/configure/types';
|
||||
import { useKibana } from '../../common/lib/kibana';
|
||||
|
||||
const FieldRowWrapper = styled.div`
|
||||
margin: 10px 0;
|
||||
|
@ -21,22 +20,16 @@ const FieldRowWrapper = styled.div`
|
|||
`;
|
||||
|
||||
export interface FieldMappingProps {
|
||||
connectorActionTypeId: string;
|
||||
actionTypeName: string;
|
||||
isLoading: boolean;
|
||||
mappings: CaseConnectorMapping[];
|
||||
}
|
||||
|
||||
const FieldMappingComponent: React.FC<FieldMappingProps> = ({
|
||||
connectorActionTypeId,
|
||||
actionTypeName,
|
||||
isLoading,
|
||||
mappings,
|
||||
}) => {
|
||||
const { triggersActionsUi } = useKibana().services;
|
||||
const selectedConnector = useMemo(
|
||||
() => triggersActionsUi.actionTypeRegistry.get(connectorActionTypeId) ?? { fields: {} },
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
[connectorActionTypeId]
|
||||
);
|
||||
return mappings.length ? (
|
||||
<EuiFlexGroup direction="column" gutterSize="none">
|
||||
<EuiFlexItem>
|
||||
|
@ -45,10 +38,8 @@ const FieldMappingComponent: React.FC<FieldMappingProps> = ({
|
|||
<EuiFlexItem>
|
||||
<span className="euiFormLabel">{i18n.FIELD_MAPPING_FIRST_COL}</span>
|
||||
</EuiFlexItem>
|
||||
<EuiFlexItem>
|
||||
<span className="euiFormLabel">
|
||||
{i18n.FIELD_MAPPING_SECOND_COL(selectedConnector.actionTypeTitle ?? '')}
|
||||
</span>
|
||||
<EuiFlexItem data-test-subj="case-configure-field-mappings-second-col-label">
|
||||
<span className="euiFormLabel">{i18n.FIELD_MAPPING_SECOND_COL(actionTypeName)}</span>
|
||||
</EuiFlexItem>
|
||||
<EuiFlexItem>
|
||||
<span className="euiFormLabel">{i18n.FIELD_MAPPING_THIRD_COL}</span>
|
||||
|
|
|
@ -205,6 +205,7 @@ const ConfigureCasesComponent: React.FC<Omit<ConfigureCasesProps, 'owner'>> = ({
|
|||
</SectionWrapper>
|
||||
<SectionWrapper>
|
||||
<Connectors
|
||||
actionTypes={actionTypes}
|
||||
connectors={connectors ?? []}
|
||||
disabled={persistLoading || isLoadingConnectors || !userCanCrud}
|
||||
handleShowEditFlyout={onClickUpdateConnector}
|
||||
|
|
|
@ -11,26 +11,14 @@ import { mount } from 'enzyme';
|
|||
import { TestProviders } from '../../common/mock';
|
||||
import { Mapping, MappingProps } from './mapping';
|
||||
import { mappings } from './__mock__';
|
||||
import { useKibana } from '../../common/lib/kibana';
|
||||
|
||||
jest.mock('../../common/lib/kibana');
|
||||
const useKibanaMock = useKibana as jest.Mocked<typeof useKibana>;
|
||||
|
||||
describe('Mapping', () => {
|
||||
const props: MappingProps = {
|
||||
connectorActionTypeId: '.servicenow',
|
||||
actionTypeName: 'ServiceNow ITSM',
|
||||
isLoading: false,
|
||||
mappings,
|
||||
};
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
useKibanaMock().services.triggersActionsUi.actionTypeRegistry.get = jest.fn().mockReturnValue({
|
||||
actionTypeTitle: 'ServiceNow ITSM',
|
||||
iconClass: 'logoSecurity',
|
||||
});
|
||||
});
|
||||
|
||||
test('it shows mapping form group', () => {
|
||||
const wrapper = mount(<Mapping {...props} />, { wrappingComponent: TestProviders });
|
||||
expect(wrapper.find('[data-test-subj="static-mappings"]').first().exists()).toBe(true);
|
||||
|
@ -45,6 +33,21 @@ describe('Mapping', () => {
|
|||
'short_description'
|
||||
);
|
||||
});
|
||||
|
||||
test('displays the title correctly', () => {
|
||||
const wrapper = mount(<Mapping {...props} />, { wrappingComponent: TestProviders });
|
||||
expect(wrapper.find('[data-test-subj="field-mapping-text"] h4').first().text()).toBe(
|
||||
'ServiceNow ITSM field mappings'
|
||||
);
|
||||
});
|
||||
|
||||
test('displays the description correctly', () => {
|
||||
const wrapper = mount(<Mapping {...props} />, { wrappingComponent: TestProviders });
|
||||
expect(wrapper.find('[data-test-subj="field-mapping-desc"]').first().text()).toBe(
|
||||
'Map Case fields to ServiceNow ITSM fields when pushing data to ServiceNow ITSM. Field mappings require an established connection to ServiceNow ITSM.'
|
||||
);
|
||||
});
|
||||
|
||||
test('displays connection warning when isLoading: false and mappings: []', () => {
|
||||
const wrapper = mount(<Mapping {...{ ...props, mappings: [] }} />, {
|
||||
wrappingComponent: TestProviders,
|
||||
|
|
|
@ -14,42 +14,32 @@ import * as i18n from './translations';
|
|||
|
||||
import { FieldMapping } from './field_mapping';
|
||||
import { CaseConnectorMapping } from '../../containers/configure/types';
|
||||
import { useKibana } from '../../common/lib/kibana';
|
||||
|
||||
export interface MappingProps {
|
||||
connectorActionTypeId: string;
|
||||
actionTypeName: string;
|
||||
isLoading: boolean;
|
||||
mappings: CaseConnectorMapping[];
|
||||
}
|
||||
|
||||
const MappingComponent: React.FC<MappingProps> = ({
|
||||
connectorActionTypeId,
|
||||
isLoading,
|
||||
mappings,
|
||||
}) => {
|
||||
const { triggersActionsUi } = useKibana().services;
|
||||
const selectedConnector = useMemo(
|
||||
() => triggersActionsUi.actionTypeRegistry.get(connectorActionTypeId),
|
||||
[connectorActionTypeId, triggersActionsUi]
|
||||
);
|
||||
const MappingComponent: React.FC<MappingProps> = ({ actionTypeName, isLoading, mappings }) => {
|
||||
const fieldMappingDesc: { desc: string; color: TextColor } = useMemo(
|
||||
() =>
|
||||
mappings.length > 0 || isLoading
|
||||
? {
|
||||
desc: i18n.FIELD_MAPPING_DESC(selectedConnector.actionTypeTitle ?? ''),
|
||||
desc: i18n.FIELD_MAPPING_DESC(actionTypeName),
|
||||
color: 'subdued',
|
||||
}
|
||||
: {
|
||||
desc: i18n.FIELD_MAPPING_DESC_ERR(selectedConnector.actionTypeTitle ?? ''),
|
||||
desc: i18n.FIELD_MAPPING_DESC_ERR(actionTypeName),
|
||||
color: 'danger',
|
||||
},
|
||||
[isLoading, mappings.length, selectedConnector.actionTypeTitle]
|
||||
[isLoading, mappings.length, actionTypeName]
|
||||
);
|
||||
return (
|
||||
<EuiFlexGroup direction="column" gutterSize="none">
|
||||
<EuiFlexItem grow={false}>
|
||||
<EuiText size="xs">
|
||||
<h4>{i18n.FIELD_MAPPING_TITLE(selectedConnector.actionTypeTitle ?? '')}</h4>
|
||||
<EuiText size="xs" data-test-subj="field-mapping-text">
|
||||
<h4>{i18n.FIELD_MAPPING_TITLE(actionTypeName)}</h4>
|
||||
<EuiTextColor data-test-subj="field-mapping-desc" color={fieldMappingDesc.color}>
|
||||
{fieldMappingDesc.desc}
|
||||
</EuiTextColor>
|
||||
|
@ -57,7 +47,7 @@ const MappingComponent: React.FC<MappingProps> = ({
|
|||
</EuiFlexItem>
|
||||
<EuiFlexItem grow={false}>
|
||||
<FieldMapping
|
||||
connectorActionTypeId={connectorActionTypeId}
|
||||
actionTypeName={actionTypeName}
|
||||
data-test-subj="case-mappings-field"
|
||||
isLoading={isLoading}
|
||||
mappings={mappings}
|
||||
|
|
Loading…
Reference in a new issue