Integrate with Vis Augmenter to augment Dashboard visualizations (#596)

Signed-off-by: Ashish Agrawal <[email protected]>
Co-authored-by: David Sinclair <[email protected]>

.github/workflows/cypress-workflow.yml

@@ -2,10 +2,10 @@ name: E2E Cypress tests
 on:
   pull_request:
     branches:
-      - "*"
+      - "**"
   push:
     branches:
-      - "*"
+      - "**"
 env:
   OPENSEARCH_DASHBOARDS_VERSION: 'main'
   OPENSEARCH_VERSION: '3.0.0-SNAPSHOT'

.github/workflows/unit-tests-workflow.yml

@@ -2,10 +2,10 @@ name: Unit tests workflow
 on:
   push:
     branches:
-      - "*"
+      - "**"
   pull_request:
     branches:
-      - "*"
+      - "**"
 env:
   OPENSEARCH_DASHBOARDS_VERSION: 'main'
 jobs:

cypress/integration/query_level_monitor_spec.js

@@ -30,7 +30,8 @@ const addVisualQueryLevelTrigger = (
   thresholdValue
 ) => {
   // Click 'Add trigger' button
-  cy.contains('Add trigger', { timeout: 20000 }).click({ force: true });
+  if (triggerIndex === 0) cy.contains('Add trigger', { timeout: 20000 }).click({ force: true });
+  else cy.contains('Add another trigger', { timeout: 20000 }).click({ force: true });
 
   if (isEdit) {
     // TODO: Passing button props in EUI accordion was added in newer versions (31.7.0+).

opensearch_dashboards.json

@@ -3,7 +3,17 @@
   "version": "3.0.0.0",
   "opensearchDashboardsVersion": "3.0.0",
   "configPath": ["opensearch_alerting"],
-  "requiredPlugins": [],
+  "requiredPlugins": [
+    "uiActions",
+    "dashboard",
+    "embeddable",
+    "opensearchDashboardsReact",
+    "savedObjects",
+    "expressions",
+    "data",
+    "visAugmenter",
+    "opensearchDashboardsUtils"
+  ],
   "server": true,
   "ui": true
 }

package.json

@@ -28,6 +28,7 @@
     }
   },
   "devDependencies": {
+    "@babel/plugin-transform-modules-commonjs": "^7.16.5",
     "@elastic/elastic-eslint-config-kibana": "link:../../packages/opensearch-eslint-config-opensearch-dashboards",
     "@elastic/eslint-import-resolver-kibana": "link:../../packages/osd-eslint-import-resolver-opensearch-dashboards",
     "cypress": "^6.0.0",

public/actions/alerting_dashboard_action.tsx

@@ -0,0 +1,70 @@
+import { EuiIconType } from '@elastic/eui/src/components/icon/icon';
+import { IEmbeddable } from '../../../../src/plugins/dashboard/public/embeddable_plugin';
+import {
+  DASHBOARD_CONTAINER_TYPE,
+  DashboardContainer,
+} from '../../../../src/plugins/dashboard/public';
+import { IncompatibleActionError, createAction } from '../../../../src/plugins/ui_actions/public';
+import { isReferenceOrValueEmbeddable } from '../../../../src/plugins/embeddable/public';
+import { Action } from '../../../../src/plugins/ui_actions/public';
+import { isEligibleForVisLayers } from '../../../../src/plugins/vis_augmenter/public';
+import { getUISettings } from '../services';
+
+export const ACTION_ALERTING = 'alerting';
+
+function isDashboard(embeddable: IEmbeddable): embeddable is DashboardContainer {
+  return embeddable.type === DASHBOARD_CONTAINER_TYPE;
+}
+
+export interface ActionContext {
+  embeddable: IEmbeddable;
+}
+
+export interface CreateOptions {
+  grouping: Action['grouping'];
+  title: JSX.Element | string;
+  icon: EuiIconType;
+  id: string;
+  type: Action['type'];
+  order: number;
+  onExecute: Function;
+}
+
+export const createAlertingAction = ({
+  grouping,
+  title,
+  icon,
+  id,
+  order,
+  onExecute,
+  type,
+}: CreateOptions) =>
+  createAction({
+    id,
+    order,
+    getDisplayName: ({ embeddable }: ActionContext) => {
+      if (!embeddable.parent || !isDashboard(embeddable.parent)) {
+        throw new IncompatibleActionError();
+      }
+      return title;
+    },
+    getIconType: () => icon,
+    type,
+    grouping,
+    // Do not show actions for certin visualizations
+    isCompatible: async ({ embeddable }: ActionContext) => {
+      return Boolean(
+        embeddable.parent &&
+        embeddable.getInput()?.viewMode === 'view' &&
+        isDashboard(embeddable.parent) &&
+        isEligibleForVisLayers(embeddable.vis, getUISettings())
+      );
+    },
+    execute: async (context: ActionContext) => {
+      if (!isReferenceOrValueEmbeddable(context.embeddable)) {
+        throw new IncompatibleActionError();
+      }
+
+      onExecute(context);
+    },
+  });

public/components/FeatureAnywhereContextMenu/AddAlertingMonitor/AddAlertingMonitor.test.js

@@ -0,0 +1,21 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import React from 'react';
+import { httpServiceMock, notificationServiceMock } from '../../../../../../src/core/public/mocks';
+import { shallow } from 'enzyme';
+import AddAlertingMonitor from './AddAlertingMonitor';
+import { setClient, setNotifications } from '../../../services';
+
+describe('AddAlertingMonitor', () => {
+  const httpClient = httpServiceMock.createStartContract();
+  setClient(httpClient);
+  const notifications = notificationServiceMock.createStartContract();
+  setNotifications(notifications);
+  test('renders', () => {
+    const wrapper = shallow(<AddAlertingMonitor {...{ embeddable: { vis: { title: '' } } }} />);
+    expect(wrapper).toMatchSnapshot();
+  });
+});