Disable notification option for alerts if notification plugin is not …

…present (opensearch-project#136) * disable notification option if no notif plugin Signed-off-by: Aleksandar Djindjic <[email protected]> * use fragment and   Signed-off-by: Aleksandar Djindjic <[email protected]> * reference github issue in TODO Signed-off-by: Aleksandar Djindjic <[email protected]> * change console.error to teaster notifications Signed-off-by: Aleksandar Djindjic <[email protected]> * add learn more link Resolves opensearch-project#137 Signed-off-by: Aleksandar Djindjic <[email protected]> * fix console.error log Signed-off-by: Aleksandar Djindjic <[email protected]> * Adjusted OSD version used by test workflows. (opensearch-project#149) * Adjusted OSD version used by test workflows. Signed-off-by: AWSHurneyt <[email protected]> * Fixed env variable call. Signed-off-by: AWSHurneyt <[email protected]> * Revised comment to include github issue link. Signed-off-by: AWSHurneyt <[email protected]> Signed-off-by: AWSHurneyt <[email protected]> Signed-off-by: Aleksandar Djindjic <[email protected]> * use console.warn(s) Signed-off-by: Aleksandar Djindjic <[email protected]> * extract response logic to helper method Signed-off-by: Aleksandar Djindjic <[email protected]> Signed-off-by: Aleksandar Djindjic <[email protected]> Signed-off-by: AWSHurneyt <[email protected]> Co-authored-by: AWSHurneyt <[email protected]>
riysaxen-amzn · Nov 23, 2022 · 0c5d28a · 0c5d28a
1 parent d73d43c
commit 0c5d28a
Show file tree

Hide file tree

Showing 17 changed files with 178 additions and 7 deletions.
diff --git a/public/components/NotificationsCallOut/NotificationsCallOut.tsx b/public/components/NotificationsCallOut/NotificationsCallOut.tsx
@@ -0,0 +1,27 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { EuiCallOut, EuiLink, EuiSpacer } from '@elastic/eui';
+
+export const NotificationsCallOut = () => {
+  return (
+    <>
+      <EuiCallOut title="Notifications plugin is not installed" color="danger" iconType="alert">
+        <p>
+          Install the notifications plugin in order to create and select channels to send out
+          notifications.&nbsp;
+          <EuiLink href="https://opensearch.org/docs/latest/notifications-plugin/index/" external>
+            Learn more
+          </EuiLink>
+          .
+        </p>
+      </EuiCallOut>
+      <EuiSpacer size="m" />
+    </>
+  );
+};
+
+export default NotificationsCallOut;
diff --git a/public/components/NotificationsCallOut/index.ts b/public/components/NotificationsCallOut/index.ts
@@ -0,0 +1,8 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { NotificationsCallOut } from './NotificationsCallOut';
+
+export { NotificationsCallOut };
diff --git a/...eateDetector/components/ConfigureAlerts/components/AlertCondition/AlertConditionPanel.tsx b/...eateDetector/components/ConfigureAlerts/components/AlertCondition/AlertConditionPanel.tsx
@@ -26,6 +26,7 @@ import { CreateDetectorRulesOptions } from '../../../../../../models/types';
 import { NotificationChannelOption, NotificationChannelTypeOptions } from '../../models/interfaces';
 import { NOTIFICATIONS_HREF } from '../../../../../../utils/constants';
 import { getNameErrorMessage, validateName } from '../../../../../../utils/validation';
+import { NotificationsCallOut } from '../../../../../../components/NotificationsCallOut';
 
 interface AlertConditionPanelProps extends RouteComponentProps {
   alertCondition: AlertCondition;
@@ -34,6 +35,7 @@ interface AlertConditionPanelProps extends RouteComponentProps {
   detector: Detector;
   indexNum: number;
   isEdit: boolean;
+  hasNotificationPlugin: boolean;
   loadingNotifications: boolean;
   onAlertTriggerChanged: (newDetector: Detector) => void;
   refreshNotificationChannels: () => void;
@@ -251,6 +253,7 @@ export default class AlertConditionPanel extends Component<
       loadingNotifications,
       refreshNotificationChannels,
       rulesOptions,
+      hasNotificationPlugin,
     } = this.props;
     const { nameFieldTouched, nameIsInvalid, selectedNames } = this.state;
     const { name, sev_levels: ruleSeverityLevels, tags, severity } = alertCondition;
@@ -422,16 +425,29 @@ export default class AlertConditionPanel extends Component<
                 onChange={this.onNotificationChannelsChange}
                 singleSelection={{ asPlainText: true }}
                 onBlur={refreshNotificationChannels}
+                isDisabled={!hasNotificationPlugin}
               />
             </EuiFormRow>
           </EuiFlexItem>
           <EuiFlexItem grow={false}>
-            <EuiButton href={NOTIFICATIONS_HREF} iconType={'popout'} target={'_blank'}>
+            <EuiButton
+              href={NOTIFICATIONS_HREF}
+              iconType={'popout'}
+              target={'_blank'}
+              isDisabled={!hasNotificationPlugin}
+            >
               Manage channels
             </EuiButton>
           </EuiFlexItem>
         </EuiFlexGroup>
 
+        {!hasNotificationPlugin && (
+          <>
+            <EuiSpacer size="m" />
+            <NotificationsCallOut />
+          </>
+        )}
+
         <EuiSpacer size={'xxl'} />
 
         <EuiAccordion

diff --git a/public/pages/CreateDetector/components/ConfigureAlerts/containers/ConfigureAlerts.tsx b/public/pages/CreateDetector/components/ConfigureAlerts/containers/ConfigureAlerts.tsx
@@ -30,6 +30,7 @@ interface ConfigureAlertsProps extends RouteComponentProps {
   changeDetector: (detector: Detector) => void;
   updateDataValidState: (step: DetectorCreationStep, isValid: boolean) => void;
   notificationsService: NotificationsService;
+  hasNotificationPlugin: boolean;
 }
 
 interface ConfigureAlertsState {
@@ -133,6 +134,7 @@ export default class ConfigureAlerts extends Component<ConfigureAlertsProps, Con
                   loadingNotifications={loading}
                   onAlertTriggerChanged={this.onAlertTriggerChanged}
                   refreshNotificationChannels={this.getNotificationChannels}
+                  hasNotificationPlugin={this.props.hasNotificationPlugin}
                 />
               </EuiAccordion>
             </EuiPanel>

diff --git a/public/pages/CreateDetector/containers/CreateDetector.tsx b/public/pages/CreateDetector/containers/CreateDetector.tsx
@@ -8,7 +8,13 @@ import { RouteComponentProps } from 'react-router-dom';
 import { EuiButton, EuiButtonEmpty, EuiFlexGroup, EuiFlexItem, EuiSteps } from '@elastic/eui';
 import DefineDetector from '../components/DefineDetector/containers/DefineDetector';
 import { createDetectorSteps } from '../utils/constants';
-import { BREADCRUMBS, EMPTY_DEFAULT_DETECTOR, PLUGIN_NAME, ROUTES } from '../../../utils/constants';
+import {
+  BREADCRUMBS,
+  EMPTY_DEFAULT_DETECTOR,
+  PLUGIN_NAME,
+  ROUTES,
+  OS_NOTIFICATION_PLUGIN,
+} from '../../../utils/constants';
 import ConfigureFieldMapping from '../components/ConfigureFieldMapping';
 import ConfigureAlerts from '../components/ConfigureAlerts';
 import { Detector, FieldMapping } from '../../../../models/interfaces';
@@ -25,7 +31,11 @@ import {
 } from '../components/DefineDetector/components/DetectionRules/types/interfaces';
 import { RuleInfo } from '../../../../server/models/interfaces';
 import { NotificationsStart } from 'opensearch-dashboards/public';
-import { errorNotificationToast, successNotificationToast } from '../../../utils/helpers';
+import {
+  errorNotificationToast,
+  successNotificationToast,
+  getPlugins,
+} from '../../../utils/helpers';
 
 interface CreateDetectorProps extends RouteComponentProps {
   isEdit: boolean;
@@ -40,6 +50,7 @@ interface CreateDetectorState {
   stepDataValid: { [step in DetectorCreationStep]: boolean };
   creatingDetector: boolean;
   rulesState: CreateDetectorRulesState;
+  plugins: string[];
 }
 
 export default class CreateDetector extends Component<CreateDetectorProps, CreateDetectorState> {
@@ -59,12 +70,14 @@ export default class CreateDetector extends Component<CreateDetectorProps, Creat
       },
       creatingDetector: false,
       rulesState: { page: { index: 0 }, allRules: [] },
+      plugins: [],
     };
   }
 
   componentDidMount(): void {
     this.context.chrome.setBreadcrumbs([BREADCRUMBS.SECURITY_ANALYTICS, BREADCRUMBS.DETECTORS]);
     this.setupRulesState();
+    this.getPlugins();
   }
 
   componentDidUpdate(
@@ -190,6 +203,13 @@ export default class CreateDetector extends Component<CreateDetectorProps, Creat
     });
   }
 
+  async getPlugins() {
+    const { services } = this.props;
+    const plugins = await getPlugins(services.opensearchService);
+
+    this.setState({ plugins });
+  }
+
   async getRules(prePackaged: boolean): Promise<RuleItemInfo[]> {
     try {
       const { detector_type } = this.state.detector;
@@ -348,6 +368,7 @@ export default class CreateDetector extends Component<CreateDetectorProps, Creat
             changeDetector={this.changeDetector}
             updateDataValidState={this.updateDataValidState}
             notificationsService={services.notificationsService}
+            hasNotificationPlugin={this.state.plugins.includes(OS_NOTIFICATION_PLUGIN)}
           />
         );
       case DetectorCreationStep.REVIEW_CREATE:

diff --git a/public/pages/Detectors/components/UpdateAlertConditions/UpdateAlertConditions.tsx b/public/pages/Detectors/components/UpdateAlertConditions/UpdateAlertConditions.tsx
@@ -9,15 +9,21 @@ import { EuiButton, EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
 import { DetectorHit } from '../../../../../server/models/interfaces';
 import { Detector } from '../../../../../models/interfaces';
 import ConfigureAlerts from '../../../CreateDetector/components/ConfigureAlerts';
-import { DetectorsService, NotificationsService, RuleService } from '../../../../services';
+import {
+  DetectorsService,
+  NotificationsService,
+  RuleService,
+  OpenSearchService,
+} from '../../../../services';
 import { RulesSharedState } from '../../../../models/interfaces';
-import { ROUTES } from '../../../../utils/constants';
+import { ROUTES, OS_NOTIFICATION_PLUGIN } from '../../../../utils/constants';
 import { NotificationsStart } from 'opensearch-dashboards/public';
-import { errorNotificationToast } from '../../../../utils/helpers';
+import { errorNotificationToast, getPlugins } from '../../../../utils/helpers';
 
 export interface UpdateAlertConditionsProps
   extends RouteComponentProps<any, any, { detectorHit: DetectorHit }> {
   detectorService: DetectorsService;
+  opensearchService: OpenSearchService;
   ruleService: RuleService;
   notificationsService: NotificationsService;
   notifications: NotificationsStart;
@@ -28,6 +34,7 @@ export interface UpdateAlertConditionsState {
   rules: object;
   rulesOptions: Pick<RulesSharedState, 'rulesOptions'>['rulesOptions'];
   submitting: boolean;
+  plugins: string[];
 }
 
 export default class UpdateAlertConditions extends Component<
@@ -41,11 +48,13 @@ export default class UpdateAlertConditions extends Component<
       rules: {},
       rulesOptions: [],
       submitting: false,
+      plugins: [],
     };
   }
 
   componentDidMount() {
     this.getRules();
+    this.getPlugins();
   }
 
   changeDetector = (detector: Detector) => {
@@ -123,6 +132,13 @@ export default class UpdateAlertConditions extends Component<
     }
   };
 
+  async getPlugins() {
+    const { opensearchService } = this.props;
+    const plugins = await getPlugins(opensearchService);
+
+    this.setState({ plugins });
+  }
+
   onCancel = () => {
     this.props.history.replace({
       pathname: `${ROUTES.DETECTOR_DETAILS}/${this.props.location.state?.detectorHit._id}`,
@@ -178,6 +194,7 @@ export default class UpdateAlertConditions extends Component<
           rulesOptions={rulesOptions}
           changeDetector={this.changeDetector}
           updateDataValidState={() => {}}
+          hasNotificationPlugin={this.state.plugins.includes(OS_NOTIFICATION_PLUGIN)}
         />
 
         <EuiFlexGroup justifyContent={'flexEnd'}>

diff --git a/public/pages/Findings/components/CreateAlertFlyout.tsx b/public/pages/Findings/components/CreateAlertFlyout.tsx
@@ -35,6 +35,7 @@ interface CreateAlertFlyoutProps extends RouteComponentProps {
   refreshNotificationChannels: () => void;
   allRules: object;
   rulesOptions: Pick<RulesSharedState, 'rulesOptions'>['rulesOptions'];
+  hasNotificationPlugin: boolean;
 }
 
 interface CreateAlertFlyoutState {
@@ -146,6 +147,7 @@ export default class CreateAlertFlyout extends Component<
             isEdit={false}
             loadingNotifications={loading}
             onAlertTriggerChanged={this.onAlertConditionChange}
+            hasNotificationPlugin={this.props.hasNotificationPlugin}
           />
           <EuiSpacer size={'m'} />
 

diff --git a/public/pages/Findings/components/FindingsTable/FindingsTable.tsx b/public/pages/Findings/components/FindingsTable/FindingsTable.tsx
@@ -39,6 +39,7 @@ interface FindingsTableProps extends RouteComponentProps {
   endTime: string;
   onRefresh: () => void;
   onFindingsFiltered: (findings: FindingItemType[]) => void;
+  hasNotificationsPlugin: boolean;
 }
 
 interface FindingsTableState {
@@ -129,6 +130,7 @@ export default class FindingsTable extends Component<FindingsTableProps, Finding
             allRules={this.props.rules}
             refreshNotificationChannels={this.props.refreshNotificationChannels}
             rulesOptions={ruleOptions}
+            hasNotificationPlugin={this.props.hasNotificationsPlugin}
           />
         ),
         flyoutOpen: true,

diff --git a/public/pages/Findings/containers/Findings/Findings.tsx b/public/pages/Findings/containers/Findings/Findings.tsx
@@ -27,6 +27,7 @@ import {
   BREADCRUMBS,
   DEFAULT_DATE_RANGE,
   MAX_RECENTLY_USED_TIME_RANGES,
+  OS_NOTIFICATION_PLUGIN,
 } from '../../../../utils/constants';
 import { getFindingsVisualizationSpec } from '../../../Overview/utils/helpers';
 import { CoreServicesContext } from '../../../../components/core_services';
@@ -41,6 +42,7 @@ import {
   createSelectComponent,
   errorNotificationToast,
   renderVisualization,
+  getPlugins,
 } from '../../../../utils/helpers';
 import { DetectorHit, RuleSource } from '../../../../../server/models/interfaces';
 import { NotificationsStart } from 'opensearch-dashboards/public';
@@ -65,6 +67,7 @@ interface FindingsState {
   recentlyUsedRanges: DurationRange[];
   groupBy: FindingsGroupByType;
   filteredFindings: FindingItemType[];
+  plugins: string[];
 }
 
 interface FindingVisualizationData {
@@ -99,6 +102,7 @@ export default class Findings extends Component<FindingsProps, FindingsState> {
       recentlyUsedRanges: [DEFAULT_DATE_RANGE],
       groupBy: 'logType',
       filteredFindings: [],
+      plugins: [],
     };
   }
 
@@ -119,6 +123,7 @@ export default class Findings extends Component<FindingsProps, FindingsState> {
   onRefresh = async () => {
     await this.getFindings();
     await this.getNotificationChannels();
+    await this.getPlugins();
     renderVisualization(this.generateVisualizationSpec(), 'findings-view');
   };
 
@@ -213,6 +218,13 @@ export default class Findings extends Component<FindingsProps, FindingsState> {
     this.setState({ notificationChannels: channels });
   };
 
+  async getPlugins() {
+    const { opensearchService } = this.props;
+    const plugins = await getPlugins(opensearchService);
+
+    this.setState({ plugins });
+  }
+
   onTimeChange = ({ start, end }: { start: string; end: string }) => {
     let { recentlyUsedRanges } = this.state;
     recentlyUsedRanges = recentlyUsedRanges.filter(
@@ -336,6 +348,7 @@ export default class Findings extends Component<FindingsProps, FindingsState> {
               notificationChannels={parseNotificationChannelsToOptions(notificationChannels)}
               refreshNotificationChannels={this.getNotificationChannels}
               onFindingsFiltered={this.onFindingsFiltered}
+              hasNotificationsPlugin={this.state.plugins.includes(OS_NOTIFICATION_PLUGIN)}
             />
           </ContentPanel>
         </EuiFlexItem>

diff --git a/public/pages/Main/Main.tsx b/public/pages/Main/Main.tsx
@@ -401,6 +401,7 @@ export default class Main extends Component<MainProps, MainState> {
                               ruleService={services.ruleService}
                               notificationsService={services.notificationsService}
                               notifications={core?.notifications}
+                              opensearchService={services.opensearchService}
                             />
                           )}
                         />

diff --git a/public/services/OpenSearchService.ts b/public/services/OpenSearchService.ts
@@ -5,7 +5,7 @@
 
 import { HttpSetup } from 'opensearch-dashboards/public';
 import { ServerResponse } from '../../server/models/types';
-import { SearchResponse } from '../../server/models/interfaces';
+import { SearchResponse, Plugin } from '../../server/models/interfaces';
 import { API } from '../../server/utils/constants';
 
 export default class OpenSearchService {
@@ -36,4 +36,9 @@ export default class OpenSearchService {
       query: { index, timeField, startTime, endTime },
     })) as ServerResponse<SearchResponse<any>>;
   };
+
+  getPlugins = async (): Promise<ServerResponse<Plugin[]>> => {
+    let url = `..${API.PLUGINS}`;
+    return await this.httpClient.get(url);
+  };
 }
diff --git a/public/utils/constants.ts b/public/utils/constants.ts
@@ -12,6 +12,7 @@ export const MAX_RECENTLY_USED_TIME_RANGES = 5;
 export const DEFAULT_DATE_RANGE = { start: 'now-15m', end: 'now' };
 
 export const PLUGIN_NAME = 'opensearch_security_analytics_dashboards';
+export const OS_NOTIFICATION_PLUGIN = 'opensearch-notifications';
 
 // TODO: Replace with actual documentation link once it's available
 export const DOCUMENTATION_URL = 'https://opensearch.org/docs/latest/';