Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Alerting UI] Replace direct components links in Cases plugin with the actionsTypeRegistry exposed by the triggersActionsUi plugin setup contract #100442

Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 11 additions & 1 deletion x-pack/plugins/cases/public/common/lib/kibana/__mocks__/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,17 @@ import {

export const KibanaServices = { get: jest.fn(), getKibanaVersion: jest.fn(() => '8.0.0') };
export const useKibana = jest.fn().mockReturnValue({
services: createStartServicesMock(),
services: {
...createStartServicesMock(),
triggersActionsUi: {
actionTypeRegistry: {
has: jest.fn(),
register: jest.fn(),
get: jest.fn(),
list: jest.fn(),
},
},
},
});

export const useHttp = jest.fn().mockReturnValue(createStartServicesMock().http);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,10 @@ import { TestProviders } from '../../common/mock';
import { ConnectorsDropdown } from './connectors_dropdown';
import { connectors } from './__mock__';
import { ConnectorTypes } from '../../../common';
import { useKibana } from '../../common/lib/kibana';
jest.mock('../../common/lib/kibana');

const useKibanaMock = useKibana as jest.Mocked<typeof useKibana>;
describe('Connectors', () => {
let wrapper: ReactWrapper;
const onChangeConnector = jest.fn();
Expand All @@ -32,6 +35,9 @@ describe('Connectors', () => {

beforeAll(() => {
wrapper = mount(<Connectors {...props} />, { wrappingComponent: TestProviders });
useKibanaMock().services.triggersActionsUi.actionTypeRegistry.get = jest.fn().mockReturnValue({
actionTypeTitle: 'test',
});
});

test('it shows the connectors from group', () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { EuiSuperSelect } from '@elastic/eui';
import { ConnectorsDropdown, Props } from './connectors_dropdown';
import { TestProviders } from '../../common/mock';
import { connectors } from './__mock__';
jest.mock('../../common/lib/kibana');

describe('ConnectorsDropdown', () => {
let wrapper: ReactWrapper;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@ import styled from 'styled-components';

import { ConnectorTypes } from '../../../common';
import { ActionConnector } from '../../containers/configure/types';
import { connectorsConfiguration } from '../connectors';
import * as i18n from './translations';
import { useKibana } from '../../common/lib/kibana';

export interface Props {
connectors: ActionConnector[];
Expand Down Expand Up @@ -65,6 +65,7 @@ const ConnectorsDropdownComponent: React.FC<Props> = ({
appendAddConnectorButton = false,
hideConnectorServiceNowSir = false,
}) => {
const { triggersActionsUi } = useKibana().services;
const connectorsAsOptions = useMemo(() => {
const connectorsFormatted = connectors.reduce(
(acc, connector) => {
Expand All @@ -80,7 +81,10 @@ const ConnectorsDropdownComponent: React.FC<Props> = ({
<EuiFlexGroup gutterSize="none" alignItems="center" responsive={false}>
<EuiFlexItem grow={false}>
<EuiIconExtended
type={connectorsConfiguration[connector.actionTypeId]?.logo ?? ''}
type={
triggersActionsUi.actionTypeRegistry.get(connector.actionTypeId)?.iconClass ??
''
}
size={ICON_SIZE}
/>
</EuiFlexItem>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { FieldMapping, FieldMappingProps } from './field_mapping';
import { mappings } from './__mock__';
import { TestProviders } from '../../common/mock';
import { FieldMappingRowStatic } from './field_mapping_row_static';
jest.mock('../../common/lib/kibana');

describe('FieldMappingRow', () => {
let wrapper: ReactWrapper;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import { FieldMappingRowStatic } from './field_mapping_row_static';
import * as i18n from './translations';

import { CaseConnectorMapping } from '../../containers/configure/types';
import { connectorsConfiguration } from '../connectors';
import { useKibana } from '../../common/lib/kibana';

const FieldRowWrapper = styled.div`
margin: 10px 0;
Expand All @@ -31,8 +31,10 @@ const FieldMappingComponent: React.FC<FieldMappingProps> = ({
isLoading,
mappings,
}) => {
const { triggersActionsUi } = useKibana().services;
const selectedConnector = useMemo(
() => connectorsConfiguration[connectorActionTypeId] ?? { fields: {} },
() => triggersActionsUi.actionTypeRegistry.get(connectorActionTypeId) ?? { fields: {} },
// eslint-disable-next-line react-hooks/exhaustive-deps
[connectorActionTypeId]
);
return mappings.length ? (
Expand All @@ -45,7 +47,7 @@ const FieldMappingComponent: React.FC<FieldMappingProps> = ({
</EuiFlexItem>
<EuiFlexItem>
<span className="euiFormLabel">
{i18n.FIELD_MAPPING_SECOND_COL(selectedConnector.name)}
{i18n.FIELD_MAPPING_SECOND_COL(selectedConnector.actionTypeTitle ?? '')}
</span>
</EuiFlexItem>
<EuiFlexItem>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,6 @@ import { Connectors } from './connectors';
import { ClosureOptions } from './closure_options';
import {
ActionConnector,
ConnectorAddFlyout,
ConnectorEditFlyout,
TriggersAndActionsUIPublicPluginStart,
} from '../../../../triggers_actions_ui/public';
import { actionTypeRegistryMock } from '../../../../triggers_actions_ui/public/application/action_type_registry.mock';
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import { mount } from 'enzyme';
import { TestProviders } from '../../common/mock';
import { Mapping, MappingProps } from './mapping';
import { mappings } from './__mock__';
jest.mock('../../common/lib/kibana');

describe('Mapping', () => {
const props: MappingProps = {
Expand Down
25 changes: 17 additions & 8 deletions x-pack/plugins/cases/public/components/configure_cases/mapping.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import * as i18n from './translations';

import { FieldMapping } from './field_mapping';
import { CaseConnectorMapping } from '../../containers/configure/types';
import { connectorsConfiguration } from '../connectors';
import { useKibana } from '../../common/lib/kibana';

export interface MappingProps {
connectorActionTypeId: string;
Expand All @@ -27,21 +27,30 @@ const MappingComponent: React.FC<MappingProps> = ({
isLoading,
mappings,
}) => {
const selectedConnector = useMemo(() => connectorsConfiguration[connectorActionTypeId], [
connectorActionTypeId,
]);
const { triggersActionsUi } = useKibana().services;
const selectedConnector = useMemo(
() => triggersActionsUi.actionTypeRegistry.get(connectorActionTypeId),
// eslint-disable-next-line react-hooks/exhaustive-deps
[connectorActionTypeId]
);
const fieldMappingDesc: { desc: string; color: TextColor } = useMemo(
() =>
mappings.length > 0 || isLoading
? { desc: i18n.FIELD_MAPPING_DESC(selectedConnector.name), color: 'subdued' }
: { desc: i18n.FIELD_MAPPING_DESC_ERR(selectedConnector.name), color: 'danger' },
[isLoading, mappings.length, selectedConnector.name]
? {
desc: i18n.FIELD_MAPPING_DESC(selectedConnector.actionTypeTitle ?? ''),
color: 'subdued',
}
: {
desc: i18n.FIELD_MAPPING_DESC_ERR(selectedConnector.actionTypeTitle ?? ''),
color: 'danger',
},
[isLoading, mappings.length, selectedConnector.actionTypeTitle]
);
return (
<EuiFlexGroup direction="column" gutterSize="none">
<EuiFlexItem grow={false}>
<EuiText size="xs">
<h4>{i18n.FIELD_MAPPING_TITLE(selectedConnector.name)}</h4>
<h4>{i18n.FIELD_MAPPING_TITLE(selectedConnector.actionTypeTitle ?? '')}</h4>
<EuiTextColor data-test-subj="field-mapping-desc" color={fieldMappingDesc.color}>
{fieldMappingDesc.desc}
</EuiTextColor>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,12 @@ import { UseField, Form, useForm, FormHook } from '../../common/shared_imports';
import { ConnectorSelector } from './form';
import { connectorsMock } from '../../containers/mock';
import { getFormMock } from '../__mock__/form';
import { useKibana } from '../../common/lib/kibana';

jest.mock('../../../../../../src/plugins/es_ui_shared/static/forms/hook_form_lib/hooks/use_form');
jest.mock('../../common/lib/kibana');

const useKibanaMock = useKibana as jest.Mocked<typeof useKibana>;
const useFormMock = useForm as jest.Mock;

describe('ConnectorSelector', () => {
Expand All @@ -22,6 +25,9 @@ describe('ConnectorSelector', () => {
beforeEach(() => {
jest.resetAllMocks();
useFormMock.mockImplementation(() => ({ form: formHookMock }));
useKibanaMock().services.triggersActionsUi.actionTypeRegistry.get = jest.fn().mockReturnValue({
actionTypeTitle: 'test',
});
});

it('it should render', async () => {
Expand Down
12 changes: 10 additions & 2 deletions x-pack/plugins/cases/public/components/connectors/card.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ import React, { memo, useMemo } from 'react';
import { EuiCard, EuiIcon, EuiLoadingSpinner } from '@elastic/eui';
import styled from 'styled-components';

import { connectorsConfiguration } from '.';
import { ConnectorTypes } from '../../../common';
import { useKibana } from '../../common/lib/kibana';

interface ConnectorCardProps {
connectorType: ConnectorTypes;
Expand All @@ -31,6 +31,8 @@ const ConnectorCardDisplay: React.FC<ConnectorCardProps> = ({
listItems,
isLoading,
}) => {
const { triggersActionsUi } = useKibana().services;

const description = useMemo(
() => (
<StyledText>
Expand All @@ -46,7 +48,13 @@ const ConnectorCardDisplay: React.FC<ConnectorCardProps> = ({
[listItems]
);
const icon = useMemo(
() => <EuiIcon size="xl" type={connectorsConfiguration[`${connectorType}`]?.logo ?? ''} />,
() => (
<EuiIcon
size="xl"
type={triggersActionsUi.actionTypeRegistry.get(`${connectorType}`)?.iconClass ?? ''}
/>
),
// eslint-disable-next-line react-hooks/exhaustive-deps
[connectorType]
);
return (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,7 @@

import { lazy } from 'react';

// eslint-disable-next-line @kbn/eslint/no-restricted-paths
import { ActionTypeModel } from '../../../../../triggers_actions_ui/public/types';
import { ActionTypeModel } from '../../../../../triggers_actions_ui/public';
import { CaseActionParams } from './types';
import * as i18n from './translations';

Expand Down
39 changes: 0 additions & 39 deletions x-pack/plugins/cases/public/components/connectors/config.ts

This file was deleted.

1 change: 0 additions & 1 deletion x-pack/plugins/cases/public/components/connectors/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@ import {

export { getActionType as getCaseConnectorUi } from './case';

export * from './config';
export * from './types';

interface GetCaseConnectorsReturn {
Expand Down
3 changes: 2 additions & 1 deletion x-pack/plugins/cases/public/components/connectors/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
* 2.0.
*/

import { IconType } from '@elastic/eui';
import React from 'react';

import {
Expand All @@ -26,7 +27,7 @@ export interface ThirdPartyField {

export interface ConnectorConfiguration {
name: string;
logo: string;
logo: IconType;
}

export interface CaseConnector<UIProps = unknown> {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,13 @@ jest.mock('../../common/lib/kibana', () => {
services: {
notifications: {},
http: {},
triggersActionsUi: {
actionTypeRegistry: {
get: jest.fn().mockReturnValue({
actionTypeTitle: 'test',
}),
},
},
},
}),
};
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,23 @@ import { waitFor } from '@testing-library/react';
import { caseUserActions } from '../../containers/mock';

jest.mock('../../../../../../src/plugins/es_ui_shared/static/forms/hook_form_lib/hooks/use_form');
jest.mock('../../common/lib/kibana', () => {
return {
useKibana: () => ({
services: {
notifications: {},
http: {},
triggersActionsUi: {
actionTypeRegistry: {
get: jest.fn().mockReturnValue({
actionTypeTitle: 'test',
}),
},
},
},
}),
};
});

const onSubmit = jest.fn();
const defaultProps = {
Expand Down
7 changes: 0 additions & 7 deletions x-pack/plugins/triggers_actions_ui/public/common/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,3 @@ export * from './constants';
export * from './index_controls';
export * from './lib';
export * from './types';

export {
getServiceNowITSMActionType,
getServiceNowSIRActionType,
} from '../application/components/builtin_action_types/servicenow';
export { getJiraActionType } from '../application/components/builtin_action_types/jira';
export { getResilientActionType } from '../application/components/builtin_action_types/resilient';