Adding functionality to associate existing detector with a visualizat…

…ion (opensearch-project#484) * Adding associate existing Signed-off-by: Amit Galitzky <amgalitz@amazon.com> * removed usememo, addressed other comments Signed-off-by: Amit Galitzky <amgalitz@amazon.com> * merge cleanup Signed-off-by: Amit Galitzky <amgalitz@amazon.com> * added integration to call on alerting Signed-off-by: Amit Galitzky <amgalitz@amazon.com> * cleaned up files and added changes to check if detector is deleted in expr fn Signed-off-by: Amit Galitzky <amgalitz@amazon.com> * fixing dependency and notifcations issues Signed-off-by: Amit Galitzky <amgalitz@amazon.com> * removed long toast life time Signed-off-by: Amit Galitzky <amgalitz@amazon.com> --------- Signed-off-by: Amit Galitzky <amgalitz@amazon.com>
amitgalitz · Jul 7, 2023 · 3479e20 · 3479e20
1 parent 1e4f962
commit 3479e20
Show file tree

Hide file tree

Showing 14 changed files with 630 additions and 107 deletions.
diff --git a/public/components/FeatureAnywhereContextMenu/AnywhereParentFlyout/AnywhereParentFlyout.tsx b/public/components/FeatureAnywhereContextMenu/AnywhereParentFlyout/AnywhereParentFlyout.tsx
@@ -6,7 +6,8 @@ import React, { useState } from 'react';
 import { get } from 'lodash';
 import AssociatedDetectors from '../AssociatedDetectors/containers/AssociatedDetectors';
 import { getEmbeddable } from '../../../../public/services';
-import AddAnomalyDetector from '../CreateAnomalyDetector/AddAnomalyDetector';
+import AddAnomalyDetector from '../CreateAnomalyDetector';
+import { FLYOUT_MODES } from './constants';
 
 const AnywhereParentFlyout = ({ startingFlyout, ...props }) => {
   const embeddable = getEmbeddable().getEmbeddableFactory;
@@ -15,11 +16,12 @@ const AnywhereParentFlyout = ({ startingFlyout, ...props }) => {
   ];
 
   const [mode, setMode] = useState(startingFlyout);
-  const [selectedDetectorId, setSelectedDetectorId] = useState();
+  const [selectedDetector, setSelectedDetector] = useState(undefined);
 
   const AnywhereFlyout = {
-    create: AddAnomalyDetector,
-    associated: AssociatedDetectors,
+    [FLYOUT_MODES.create]: AddAnomalyDetector,
+    [FLYOUT_MODES.associated]: AssociatedDetectors,
+    [FLYOUT_MODES.existing]: AddAnomalyDetector,
   }[mode];
 
   return (
@@ -29,8 +31,8 @@ const AnywhereParentFlyout = ({ startingFlyout, ...props }) => {
         setMode,
         mode,
         indices,
-        selectedDetectorId,
-        setSelectedDetectorId,
+        selectedDetector,
+        setSelectedDetector,
       }}
     />
   );

diff --git a/public/components/FeatureAnywhereContextMenu/AnywhereParentFlyout/constants.ts b/public/components/FeatureAnywhereContextMenu/AnywhereParentFlyout/constants.ts
@@ -0,0 +1,13 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+//created: Flyout for creating a new anomaly detector from a visualization
+//associated: Flyout for listing all the associated detectors to the given visualization
+//existing: Flyout for associating existing detectors with the current visualizations
+export enum FLYOUT_MODES {
+  create = 'create',
+  associated = 'associated',
+  existing = 'existing',
+}
diff --git a/...ponents/FeatureAnywhereContextMenu/AssociatedDetectors/containers/AssociatedDetectors.tsx b/...ponents/FeatureAnywhereContextMenu/AssociatedDetectors/containers/AssociatedDetectors.tsx
@@ -24,6 +24,7 @@ import { DetectorListItem } from '../../../../models/interfaces';
 import {
   getSavedFeatureAnywhereLoader,
   getNotifications,
+  getUISettings,
 } from '../../../../services';
 import {
   GET_ALL_DETECTORS_QUERY_PARAMS,
@@ -39,7 +40,11 @@ import {
   EmptyAssociatedDetectorMessage,
   ConfirmUnlinkDetectorModal,
 } from '../components';
-import { ISavedAugmentVis } from '../../../../../../../src/plugins/vis_augmenter/public';
+import {
+  ISavedAugmentVis,
+  SavedAugmentVisLoader,
+  getAugmentVisSavedObjs,
+} from '../../../../../../../src/plugins/vis_augmenter/public';
 import { ASSOCIATED_DETECTOR_ACTION } from '../utils/constants';
 
 interface ConfirmModalState {
@@ -82,8 +87,10 @@ function AssociatedDetectors({ embeddable, closeFlyout, setMode }) {
   );
 
   // Establish savedObjectLoader for all operations on vis_augment saved objects
-  const savedObjectLoader: SavedObjectLoader = getSavedFeatureAnywhereLoader();
+  const savedObjectLoader: SavedAugmentVisLoader =
+    getSavedFeatureAnywhereLoader();
 
+  const uiSettings = getUISettings();
   const notifications = getNotifications();
 
   useEffect(() => {
@@ -127,15 +134,12 @@ function AssociatedDetectors({ embeddable, closeFlyout, setMode }) {
 
   // Handles all changes in the assoicated detectors such as unlinking or new detectors associated
   useEffect(() => {
-    // Gets all augmented saved objects
-    savedObjectLoader
-      .findAll()
-      .then((resp: any) => {
-        if (resp != undefined) {
-          const savedAugmentObjectsArr: ISavedAugmentVis[] = get(
-            resp,
-            'hits',
-            []
+    // Gets all augmented saved objects that are associated to the given visualization
+    getAugmentVisSavedObjs(embeddable.vis.id, savedObjectLoader, uiSettings)
+      .then((savedAugmentObjectsArr: any) => {
+        if (savedAugmentObjectsArr != undefined) {
+          console.log(
+            'savedAugmentObjectsArr: ' + JSON.stringify(savedAugmentObjectsArr)
           );
           const curSelectedDetectors = getAssociatedDetectors(
             Object.values(allDetectors),
@@ -156,14 +160,8 @@ function AssociatedDetectors({ embeddable, closeFlyout, setMode }) {
   // that are associated to the current visualization
   const getAssociatedDetectors = (
     detectors: DetectorListItem[],
-    savedAugmentObjects: ISavedAugmentVis[]
+    savedAugmentForThisVisualization: ISavedAugmentVis[]
   ) => {
-    // Filter all savedAugmentObjects that aren't linked to the specific visualization
-    const savedAugmentForThisVisualization: ISavedAugmentVis[] =
-      savedAugmentObjects.filter(
-        (savedObj) => get(savedObj, 'visId', '') === embeddable.vis.id
-      );
-
     // Map all detector IDs for all the found augmented vis objects
     const savedAugmentDetectorsSet = new Set(
       savedAugmentForThisVisualization.map((savedObject) =>
@@ -180,18 +178,13 @@ function AssociatedDetectors({ embeddable, closeFlyout, setMode }) {
 
   const onUnlinkDetector = async () => {
     setIsLoadingFinalDetectors(true);
-    await savedObjectLoader.findAll().then(async (resp: any) => {
-      if (resp != undefined) {
-        // gets all the saved object for this visualization
-        const savedAugmentForThisVisualization: ISavedAugmentVis[] = get(
-          resp,
-          'hits',
-          [] as ISavedAugmentVis[]
-        ).filter(
-          (savedObj: ISavedAugmentVis[]) =>
-            get(savedObj, 'visId', '') === embeddable.vis.id
-        );
-
+    // Gets all augmented saved objects that are associated to the given visualization
+    await getAugmentVisSavedObjs(
+      embeddable.vis.id,
+      savedObjectLoader,
+      uiSettings
+    ).then(async (savedAugmentForThisVisualization: any) => {
+      if (savedAugmentForThisVisualization != undefined) {
         // find saved augment object matching detector we want to unlink
         // There should only be one detector and vis pairing
         const savedAugmentToUnlink = savedAugmentForThisVisualization.find(
@@ -239,11 +232,6 @@ function AssociatedDetectors({ embeddable, closeFlyout, setMode }) {
     dispatch(getDetectorList(GET_ALL_DETECTORS_QUERY_PARAMS));
   };
 
-  // TODO: this part is incomplete because it is pending on a different PR that will have all the associate existing changes
-  const openAssociateDetectorFlyout = async () => {
-    console.log('inside create anomaly detector');
-  };
-
   const handleUnlinkDetectorAction = (detector: DetectorListItem) => {
     setDetectorToUnlink(detector);
     setConfirmModalState({
@@ -326,7 +314,7 @@ function AssociatedDetectors({ embeddable, closeFlyout, setMode }) {
                 fill
                 iconType="link"
                 onClick={() => {
-                  openAssociateDetectorFlyout();
+                  setMode('existing');
                 }}
               >
                 Associate a detector