[Backport 2.x] Support any channel types from Notification

public/pages/CreateTrigger/components/Action/Action.js

@@ -25,11 +25,11 @@ import {
 } from '@elastic/eui';
 import { FormikFieldText, FormikComboBox } from '../../../../components/FormControls';
 import { isInvalid, hasError, validateActionName } from '../../../../utils/validate';
-import { ActionsMap } from './utils/constants';
 import { validateDestination } from './utils/validate';
 import { DEFAULT_ACTION_TYPE, MANAGE_CHANNELS_PATH } from '../../utils/constants';
 import NotificationsCallOut from '../NotificationsCallOut';
 import MinimalAccordion from '../../../../components/FeatureAnywhereContextMenu/MinimalAccordion';
+import Message from './actions';
 
 const Action = ({
   action,
@@ -60,8 +60,14 @@ const Action = ({
   );
   const type = _.get(selectedDestination, '0.type', DEFAULT_ACTION_TYPE);
   const { name } = action;
-  const ActionComponent = ActionsMap[type].component;
-  const actionLabel = ActionsMap[type].label;
+  let ActionComponent;
+  const actionLabel = 'Notification';
+  if (type === 'webhook') {
+    ActionComponent = (props) => <Message isSubjectDisabled {...props} />;
+  } else {
+    ActionComponent = (props) => <Message {...props} />;
+  }
+
   const manageChannelsUrl = httpClient.basePath.prepend(MANAGE_CHANNELS_PATH);
   const isFirstAction = index !== undefined && index === 0;
   const refreshDestinations = useMemo(() => {

public/pages/CreateTrigger/containers/ConfigureActions/ConfigureActions.js

@@ -9,11 +9,6 @@ import { EuiPanel, EuiText, EuiSpacer, EuiLoadingSpinner } from '@elastic/eui';
 import Action from '../../components/Action';
 import ActionEmptyPrompt from '../../components/ActionEmptyPrompt';
 import AddActionButton from '../../components/AddActionButton';
-import {
-  CHANNEL_TYPES,
-  DEFAULT_MESSAGE_SOURCE,
-  FORMIK_INITIAL_ACTION_VALUES,
-} from '../../utils/constants';
 import { getAllowList } from '../../../Destinations/utils/helpers';
 import {
   MAX_QUERY_RESULT_SIZE,
@@ -111,10 +106,11 @@ class ConfigureActions extends React.Component {
     let channels = [];
     let index = 0;
     const getChannels = async () => {
+      const config_types = await this.props.notificationService.getServerFeatures();
       const getChannelsQuery = {
         from_index: index,
         max_items: MAX_CHANNELS_RESULT_SIZE,
-        config_type: CHANNEL_TYPES,
+        config_type: config_types,
         sort_field: 'name',
         sort_order: 'asc',
       };
@@ -172,7 +168,7 @@ class ConfigureActions extends React.Component {
       let channels = await this.getChannels();
 
       const destinationsAndChannels = destinations.concat(channels);
-      const channelOptionsByType = getChannelOptions(destinationsAndChannels, CHANNEL_TYPES);
+      const channelOptionsByType = getChannelOptions(destinationsAndChannels);
       this.setState({
         destinations: channelOptionsByType,
         flattenedDestinations: destinationsAndChannels,

public/pages/CreateTrigger/containers/DefineCompositeLevelTrigger/TriggerNotifications.js

@@ -15,7 +15,6 @@ import {
 } from '@elastic/eui';
 import TriggerNotificationsContent from './TriggerNotificationsContent';
 import { MAX_CHANNELS_RESULT_SIZE, OS_NOTIFICATION_PLUGIN } from '../../../../utils/constants';
-import { CHANNEL_TYPES } from '../../utils/constants';
 import { titleTemplate } from '../../../../utils/helpers';
 
 const TriggerNotifications = ({
@@ -52,10 +51,11 @@ const TriggerNotifications = ({
     let channels = [];
     let index = 0;
     const getChannels = async () => {
+      const config_types = await this.props.notificationService.getServerFeatures();
       const getChannelsQuery = {
         from_index: index,
         max_items: MAX_CHANNELS_RESULT_SIZE,
-        config_type: CHANNEL_TYPES,
+        config_type: config_types,
         sort_field: 'name',
         sort_order: 'asc',
       };

public/pages/CreateTrigger/utils/constants.js

@@ -77,5 +77,3 @@ export const DEFAULT_TRIGGER_NAME = 'New trigger';
 export const DEFAULT_ACTION_TYPE = 'slack';
 
 export const MANAGE_CHANNELS_PATH = `/app/notifications-dashboards#/channels`;
-
-export const CHANNEL_TYPES = ['slack', 'email', 'chime', 'webhook', 'ses', 'sns'];

public/pages/CreateTrigger/utils/helper.js

@@ -18,12 +18,12 @@ import {
 import moment from 'moment';
 import { formikToTrigger } from '../containers/CreateTrigger/utils/formikToTrigger';
 
-export const getChannelOptions = (channels, allowedTypes) =>
-  allowedTypes.map((type) => ({
-    key: type,
-    label: type,
+export const getChannelOptions = (channels) =>
+  channels.map((channel) => ({
+    key: channel.type,
+    label: channel.type,
     options: channels
-      .filter((channel) => channel.type === type)
+      .filter((local_channel) => local_channel.type === channel.type)
       .map((option) => ({ key: option.value, ...option })),
   }));
 

public/services/NotificationService.ts

@@ -16,6 +16,7 @@ const NODE_API_BASE_PATH = '/api/notifications';
 const NODE_API = Object.freeze({
   GET_CONFIGS: `${NODE_API_BASE_PATH}/get_configs`,
   GET_CONFIG: `${NODE_API_BASE_PATH}/get_config`,
+  GET_AVAILABLE_FEATURES: `${NODE_API_BASE_PATH}/features`,
 });
 
 export default class NotificationService {
@@ -25,6 +26,18 @@ export default class NotificationService {
     this.httpClient = httpClient;
   }
 
+  getServerFeatures = async (): Promise<Array<String>> => {
+    try {
+      const response = await this.httpClient.get(
+        NODE_API.GET_AVAILABLE_FEATURES
+      );
+      return response.allowed_config_type_list as Array<String>;
+    } catch (error) {
+      console.error('error fetching available features', error);
+      return [];
+    }
+  };
+
   getConfigs = async (queryObject: HttpFetchQuery) => {
     return this.httpClient.get<ConfigsResponse>(NODE_API.GET_CONFIGS, {
       query: queryObject,