[Alerting] Fixed issue when connectors dropdown not showing all avail…

…able connectors (elastic#63636) (elastic#63718)
cnasikas · Apr 16, 2020 · 22c045f · 22c045f
1 parent 3a96d6a
commit 22c045f
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 7 deletions.
diff --git a/...riggers_actions_ui/public/application/sections/action_connector_form/action_form.test.tsx b/...riggers_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/...ins/triggers_actions_ui/public/application/sections/action_connector_form/action_form.tsx b/...ins/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: '',