diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.test.tsx index 41564146bb84d..488db42f4e843 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.test.tsx @@ -87,6 +87,14 @@ describe('action_form', () => { config: {}, isPreconfigured: false, }, + { + secrets: {}, + id: 'test2', + actionTypeId: actionType.id, + name: 'Test connector 2', + config: {}, + isPreconfigured: true, + }, ]); const mockes = coreMock.createSetup(); deps = { @@ -100,6 +108,7 @@ describe('action_form', () => { disabledByLicenseActionType, ]); actionTypeRegistry.has.mockReturnValue(true); + actionTypeRegistry.get.mockReturnValue(actionType); const initialAlert = ({ name: 'test', @@ -206,6 +215,29 @@ describe('action_form', () => { expect(actionOption.exists()).toBeFalsy(); }); + it(`renders available connectors for the selected action type`, async () => { + await setup(); + const actionOption = wrapper.find( + `[data-test-subj="${actionType.id}-ActionTypeSelectOption"]` + ); + actionOption.first().simulate('click'); + const combobox = wrapper.find(`[data-test-subj="selectActionConnector"]`); + expect((combobox.first().props() as any).options).toMatchInlineSnapshot(` + Array [ + Object { + "id": "test", + "key": "test", + "label": "Test connector ", + }, + Object { + "id": "test2", + "key": "test2", + "label": "Test connector 2 (pre-configured)", + }, + ] + `); + }); + it('renders action types disabled by license', async () => { await setup(); const actionOption = wrapper.find( diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx index f0c922bb3a1e1..3f964cc167c25 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx @@ -164,6 +164,7 @@ export const ActionForm = ({ label: optionTitle, value: optionTitle, id: actionItemId, + 'data-test-subj': 'itemActionConnector', }, ]; }; @@ -177,13 +178,9 @@ export const ActionForm = ({ index: number ) => { const optionsList = connectors - .filter( - connectorItem => - connectorItem.actionTypeId === actionItem.actionTypeId && - connectorItem.id === actionItem.id - ) - .map(({ name, id }) => ({ - label: name, + .filter(connectorItem => connectorItem.actionTypeId === actionItem.actionTypeId) + .map(({ name, id, isPreconfigured }) => ({ + label: `${name} ${isPreconfigured ? preconfiguredMessage : ''}`, key: id, id, })); @@ -231,6 +228,8 @@ export const ActionForm = ({ fullWidth singleSelection={{ asPlainText: true }} options={optionsList} + id={`selectActionConnector-${actionItem.id}`} + data-test-subj="selectActionConnector" selectedOptions={getSelectedOptions(actionItem.id)} onChange={selectedOptions => { setActionIdByIndex(selectedOptions[0].id ?? '', index); @@ -448,6 +447,7 @@ export const ActionForm = ({ const actionTypeConnectors = connectors.filter( field => field.actionTypeId === actionTypeModel.id ); + if (actionTypeConnectors.length > 0) { actions.push({ id: '',