[Alerting UI] Replace direct components links in Cases plugin with th…

…e actionsTypeRegistry exposed by the triggersActionsUi plugin setup contract

x-pack/plugins/cases/public/common/lib/kibana/__mocks__/index.ts

@@ -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);

x-pack/plugins/cases/public/components/configure_cases/connectors.test.tsx

@@ -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();
@@ -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', () => {

x-pack/plugins/cases/public/components/configure_cases/connectors_dropdown.test.tsx

@@ -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;

x-pack/plugins/cases/public/components/configure_cases/connectors_dropdown.tsx

@@ -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[];
@@ -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) => {
@@ -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>

x-pack/plugins/cases/public/components/configure_cases/field_mapping.test.tsx

@@ -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;

x-pack/plugins/cases/public/components/configure_cases/field_mapping.tsx

@@ -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;
@@ -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 ? (
@@ -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>

x-pack/plugins/cases/public/components/configure_cases/index.test.tsx

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

x-pack/plugins/cases/public/components/configure_cases/mapping.test.tsx

@@ -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 = {

x-pack/plugins/cases/public/components/configure_cases/mapping.tsx

@@ -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;
@@ -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>

x-pack/plugins/cases/public/components/connector_selector/form.test.tsx

@@ -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', () => {
@@ -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 () => {

x-pack/plugins/cases/public/components/connectors/card.tsx

@@ -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;
@@ -31,6 +31,8 @@ const ConnectorCardDisplay: React.FC<ConnectorCardProps> = ({
   listItems,
   isLoading,
 }) => {
+  const { triggersActionsUi } = useKibana().services;
+
   const description = useMemo(
     () => (
       <StyledText>
@@ -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 (

x-pack/plugins/cases/public/components/connectors/case/index.ts

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

x-pack/plugins/cases/public/components/connectors/index.ts

@@ -19,7 +19,6 @@ import {
 
 export { getActionType as getCaseConnectorUi } from './case';
 
-export * from './config';
 export * from './types';
 
 interface GetCaseConnectorsReturn {

x-pack/plugins/cases/public/components/connectors/types.ts

@@ -5,6 +5,7 @@
  * 2.0.
  */
 
+import { IconType } from '@elastic/eui';
 import React from 'react';
 
 import {
@@ -26,7 +27,7 @@ export interface ThirdPartyField {
 
 export interface ConnectorConfiguration {
   name: string;
-  logo: string;
+  logo: IconType;
 }
 
 export interface CaseConnector<UIProps = unknown> {

x-pack/plugins/cases/public/components/create/connector.test.tsx

@@ -25,6 +25,13 @@ jest.mock('../../common/lib/kibana', () => {
       services: {
         notifications: {},
         http: {},
+        triggersActionsUi: {
+          actionTypeRegistry: {
+            get: jest.fn().mockReturnValue({
+              actionTypeTitle: 'test',
+            }),
+          },
+        },
       },
     }),
   };

x-pack/plugins/cases/public/components/edit_connector/index.test.tsx

@@ -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 = {

x-pack/plugins/triggers_actions_ui/public/common/index.ts

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