align all flyout components to overlay

opensearch-project · Nov 30, 2022 · 559d4dd · 559d4dd
1 parent 6287bd5
commit 559d4dd
Show file tree

Hide file tree

Showing 8 changed files with 14 additions and 9 deletions.
diff --git a/public/components/Flyout/flyouts/alertsDashboard.js b/public/components/Flyout/flyouts/alertsDashboard.js
@@ -15,7 +15,6 @@ const alertsDashboard = (payload) => {
       size: 'm',
       hideCloseButton: true,
       'data-test-subj': `alertsDashboardFlyout_${trigger_name}`,
-      type: 'push',
     },
     headerProps: { hasBorder: true },
     header: (

diff --git a/public/components/Flyout/flyouts/components/AlertsDashboardFlyoutComponent.js b/public/components/Flyout/flyouts/components/AlertsDashboardFlyoutComponent.js
@@ -361,7 +361,7 @@ export default class AlertsDashboardFlyoutComponent extends Component {
           columns.splice(
             0,
             0,
-            getAlertsFindingColumn(httpClient, history, true, location, notifications)
+            getAlertsFindingColumn(httpClient, history, location, notifications)
           );
           break;
         default:

diff --git a/public/pages/CreateMonitor/containers/CreateMonitor/CreateMonitor.js b/public/pages/CreateMonitor/containers/CreateMonitor/CreateMonitor.js
@@ -286,6 +286,7 @@ export default class CreateMonitor extends Component {
                 plugins={plugins}
                 isAd={values.searchType === SEARCH_TYPE.AD}
                 detectorId={this.props.detectorId}
+                setFlyout={this.props.setFlyout}
               />
               <EuiSpacer />
 

diff --git a/public/pages/Dashboard/components/AcknowledgeAlertsModal/AcknowledgeAlertsModal.js b/public/pages/Dashboard/components/AcknowledgeAlertsModal/AcknowledgeAlertsModal.js
@@ -352,7 +352,6 @@ export default class AcknowledgeAlertsModal extends Component {
             getAlertsFindingColumn(
               httpClient,
               history,
-              false,
               location,
               notifications,
               flyoutIsOpen,

diff --git a/public/pages/Dashboard/components/FindingsDashboard/FindingFlyout.js b/public/pages/Dashboard/components/FindingsDashboard/FindingFlyout.js
@@ -70,10 +70,16 @@ export default class FindingFlyout extends Component {
 
   closeFlyout = () => {
     this.setState({ isFlyoutOpen: false });
+
+    const { dashboardFlyoutIsOpen = false, closeFlyout } = this.props;
+
+    if (typeof closeFlyout === 'function') {
+      if (dashboardFlyoutIsOpen) closeFlyout();
+    }
   };
 
   async renderFlyout() {
-    const { alert, isAlertsFlyout = false } = this.props;
+    const { alert } = this.props;
     if (!_.isEmpty(alert)) await this.getFinding();
 
     const { docList, finding } = this.state;
@@ -93,9 +99,8 @@ export default class FindingFlyout extends Component {
 
     const flyout = (
       <EuiFlyout
-        type={isAlertsFlyout ? 'overlay' : 'push'}
         onClose={this.closeFlyout}
-        ownFocus={false}
+        ownFocus={true}
         hideCloseButton={true}
         side={'right'}
         size={'m'}

diff --git a/public/pages/Dashboard/components/FindingsDashboard/findingsUtils.js b/public/pages/Dashboard/components/FindingsDashboard/findingsUtils.js
@@ -41,7 +41,6 @@ export const ALERTS_FINDING_COLUMN = {
 export const getAlertsFindingColumn = (
   httpClient,
   history,
-  isAlertsFlyout = false,
   location,
   notifications,
   flyoutIsOpen,
@@ -58,7 +57,6 @@ export const getAlertsFindingColumn = (
         console.log('Alerts index contains an entry with 0 related document IDs:', alert);
       return (
         <FindingFlyout
-          isAlertsFlyout={isAlertsFlyout}
           alert={alert}
           httpClient={httpClient}
           history={history}

diff --git a/public/pages/Dashboard/containers/Dashboard.js b/public/pages/Dashboard/containers/Dashboard.js
@@ -392,7 +392,6 @@ export default class Dashboard extends Component {
             getAlertsFindingColumn(
               httpClient,
               history,
-              false,
               location,
               notifications,
               flyoutIsOpen,

diff --git a/public/pages/MonitorDetails/containers/MonitorDetails.js b/public/pages/MonitorDetails/containers/MonitorDetails.js
@@ -262,6 +262,7 @@ export default class MonitorDetails extends Component {
       history,
       httpClient,
       notifications,
+      setFlyout,
     } = this.props;
     const detectorId = _.get(monitor, MONITOR_INPUT_DETECTOR_ID, undefined);
     const groupBy = _.get(monitor, MONITOR_GROUP_BY);
@@ -277,6 +278,7 @@ export default class MonitorDetails extends Component {
         monitorType={monitor.monitor_type}
         perAlertView={true}
         groupBy={groupBy}
+        setFlyout={setFlyout}
       />
     );
   };
@@ -344,6 +346,7 @@ export default class MonitorDetails extends Component {
       httpClient,
       notifications,
       isDarkMode,
+      setFlyout,
     } = this.props;
     const { action } = queryString.parse(location.search);
     const updatingMonitor = action === MONITOR_ACTIONS.UPDATE_MONITOR;
@@ -365,6 +368,7 @@ export default class MonitorDetails extends Component {
           monitorToEdit={monitor}
           detectorId={detectorId}
           notifications={notifications}
+          setFlyout={setFlyout}
           {...this.props}
         />
       );