Merge branch 'main' into serverless/poc/navigation

elastic · Mar 14, 2023 · 3985e3d · 3985e3d
2 parents 8f969b4 + b24cdb1
commit 3985e3d
Show file tree

Hide file tree

Showing 16 changed files with 128 additions and 92 deletions.
diff --git a/src/plugins/discover/public/application/main/components/top_nav/open_alerts_popover.tsx b/src/plugins/discover/public/application/main/components/top_nav/open_alerts_popover.tsx
@@ -91,7 +91,7 @@ export function AlertsPopover({
       updateDataViewList(metadata.adHocDataViewList);
     };
 
-    return triggersActionsUi?.getAddAlertFlyout({
+    return triggersActionsUi?.getAddRuleFlyout({
       metadata: discoverMetadata,
       consumer: 'discover',
       onClose: (_, metadata) => {

diff --git a/x-pack/examples/alerting_example/public/components/create_alert.tsx b/x-pack/examples/alerting_example/public/components/create_alert.tsx
@@ -5,31 +5,21 @@
  * 2.0.
  */
 
-import React, { useMemo, useState, useCallback } from 'react';
+import React, { useState, useCallback } from 'react';
 
 import { EuiIcon, EuiFlexItem, EuiCard, EuiFlexGroup } from '@elastic/eui';
 
 import { AlertingExampleComponentParams } from '../application';
 import { ALERTING_EXAMPLE_APP_ID } from '../../common/constants';
 
 export const CreateAlert = ({
-  triggersActionsUi,
+  triggersActionsUi: { getAddRuleFlyout: AddRuleFlyout },
 }: Pick<AlertingExampleComponentParams, 'triggersActionsUi'>) => {
-  const [alertFlyoutVisible, setAlertFlyoutVisibility] = useState<boolean>(false);
+  const [ruleFlyoutVisible, setRuleFlyoutVisibility] = useState<boolean>(false);
 
   const onCloseAlertFlyout = useCallback(
-    () => setAlertFlyoutVisibility(false),
-    [setAlertFlyoutVisibility]
-  );
-
-  const AddAlertFlyout = useMemo(
-    () =>
-      triggersActionsUi.getAddAlertFlyout({
-        consumer: ALERTING_EXAMPLE_APP_ID,
-        onClose: onCloseAlertFlyout,
-      }),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [onCloseAlertFlyout]
+    () => setRuleFlyoutVisibility(false),
+    [setRuleFlyoutVisibility]
   );
 
   return (
@@ -39,10 +29,14 @@ export const CreateAlert = ({
           icon={<EuiIcon size="xxl" type={`bell`} />}
           title={`Create Rule`}
           description="Create a new Rule based on one of our example Rule Types ."
-          onClick={() => setAlertFlyoutVisibility(true)}
+          onClick={() => setRuleFlyoutVisibility(true)}
         />
       </EuiFlexItem>
-      <EuiFlexItem>{alertFlyoutVisible && AddAlertFlyout}</EuiFlexItem>
+      <EuiFlexItem>
+        {ruleFlyoutVisible ? (
+          <AddRuleFlyout consumer={ALERTING_EXAMPLE_APP_ID} onClose={onCloseAlertFlyout} />
+        ) : null}
+      </EuiFlexItem>
     </EuiFlexGroup>
   );
 };
diff --git a/x-pack/plugins/apm/public/components/alerting/ui_components/alerting_flyout/index.tsx b/x-pack/plugins/apm/public/components/alerting/ui_components/alerting_flyout/index.tsx
@@ -52,7 +52,7 @@ export function AlertingFlyout(props: Props) {
   const addAlertFlyout = useMemo(
     () =>
       ruleType &&
-      services.triggersActionsUi.getAddAlertFlyout({
+      services.triggersActionsUi.getAddRuleFlyout({
         consumer: APM_SERVER_FEATURE_ID,
         onClose: onCloseAddFlyout,
         ruleTypeId: ruleType,

diff --git a/x-pack/plugins/infra/public/alerting/inventory/components/alert_flyout.tsx b/x-pack/plugins/infra/public/alerting/inventory/components/alert_flyout.tsx
@@ -30,7 +30,7 @@ export const AlertFlyout = ({ options, nodeType, filter, visible, setVisible }:
   const AddAlertFlyout = useMemo(
     () =>
       triggersActionsUI &&
-      triggersActionsUI.getAddAlertFlyout({
+      triggersActionsUI.getAddRuleFlyout({
         consumer: 'infrastructure',
         onClose: onCloseFlyout,
         canChangeTrigger: false,

diff --git a/x-pack/plugins/infra/public/alerting/log_threshold/components/alert_flyout.tsx b/x-pack/plugins/infra/public/alerting/log_threshold/components/alert_flyout.tsx
@@ -21,7 +21,7 @@ export const AlertFlyout = (props: Props) => {
   const AddAlertFlyout = useMemo(
     () =>
       triggersActionsUI &&
-      triggersActionsUI.getAddAlertFlyout({
+      triggersActionsUI.getAddRuleFlyout({
         consumer: 'logs',
         onClose: onCloseFlyout,
         canChangeTrigger: false,

diff --git a/x-pack/plugins/infra/public/alerting/metric_anomaly/components/alert_flyout.tsx b/x-pack/plugins/infra/public/alerting/metric_anomaly/components/alert_flyout.tsx
@@ -28,7 +28,7 @@ export const AlertFlyout = ({ metric, nodeType, visible, setVisible }: Props) =>
   const AddAlertFlyout = useMemo(
     () =>
       triggersActionsUI &&
-      triggersActionsUI.getAddAlertFlyout({
+      triggersActionsUI.getAddRuleFlyout({
         consumer: 'infrastructure',
         onClose: onCloseFlyout,
         canChangeTrigger: false,

diff --git a/x-pack/plugins/infra/public/alerting/metric_threshold/components/alert_flyout.tsx b/x-pack/plugins/infra/public/alerting/metric_threshold/components/alert_flyout.tsx
@@ -26,7 +26,7 @@ export const AlertFlyout = (props: Props) => {
   const AddAlertFlyout = useMemo(
     () =>
       triggersActionsUI &&
-      triggersActionsUI.getAddAlertFlyout({
+      triggersActionsUI.getAddRuleFlyout({
         consumer: 'infrastructure',
         onClose: onCloseFlyout,
         canChangeTrigger: false,

diff --git a/x-pack/plugins/ml/public/alerting/ml_alerting_flyout.tsx b/x-pack/plugins/ml/public/alerting/ml_alerting_flyout.tsx
@@ -64,7 +64,7 @@ export const MlAnomalyAlertFlyout: FC<MlAnomalyAlertFlyoutProps> = ({
       });
     }
 
-    return triggersActionsUi.getAddAlertFlyout({
+    return triggersActionsUi.getAddRuleFlyout({
       ...commonProps,
       consumer: PLUGIN_ID,
       canChangeTrigger: false,

diff --git a/x-pack/plugins/observability/public/observability_public_plugins_start.mock.tsx b/x-pack/plugins/observability/public/observability_public_plugins_start.mock.tsx
@@ -26,15 +26,13 @@ const embeddableStartMock = {
 const triggersActionsUiStartMock = {
   createStart() {
     return {
-      getAddAlertFlyout: jest.fn(() => (
-        <div data-test-subj="add-alerts-flyout">mocked component</div>
-      )),
       getAlertsSearchBar: jest.fn(() => (
         <div data-test-subj="alerts-search-bar">mocked component</div>
       )),
       getAlertsStateTable: jest.fn(() => (
         <div data-test-subj="alerts-state-table">mocked component</div>
       )),
+      getAddRuleFlyout: jest.fn(() => <div data-test-subj="add-rule-flyout">mocked component</div>),
       getEditAlertFlyout: jest.fn(() => (
         <div data-test-subj="edit-alert-flyout">mocked component</div>
       )),

diff --git a/x-pack/plugins/observability/public/pages/rules/index.tsx b/x-pack/plugins/observability/public/pages/rules/index.tsx
@@ -35,7 +35,7 @@ function RulesPage() {
     http,
     docLinks,
     triggersActionsUi: {
-      getAddAlertFlyout: AddAlertFlyout,
+      getAddRuleFlyout: AddRuleFlyout,
       getRulesList: RuleList,
       getRulesSettingsLink: RulesSettingsLink,
     },
@@ -121,7 +121,7 @@ function RulesPage() {
       </EuiFlexGroup>
 
       {addRuleFlyoutVisibility && (
-        <AddAlertFlyout
+        <AddRuleFlyout
           consumer={ALERTS_FEATURE_ID}
           filteredRuleTypes={filteredRuleTypes}
           onClose={() => {

diff --git a/...nthetics/public/legacy_uptime/components/overview/alerts/uptime_alerts_flyout_wrapper.tsx b/...nthetics/public/legacy_uptime/components/overview/alerts/uptime_alerts_flyout_wrapper.tsx
@@ -31,7 +31,7 @@ export const UptimeAlertsFlyoutWrapperComponent = ({
   );
   const AddAlertFlyout = useMemo(
     () =>
-      triggersActionsUi.getAddAlertFlyout({
+      triggersActionsUi.getAddRuleFlyout({
         consumer: 'uptime',
         onClose: onCloseAlertFlyout,
         ruleTypeId: alertTypeId,

diff --git a/x-pack/plugins/transform/public/alerting/transform_alerting_flyout.tsx b/x-pack/plugins/transform/public/alerting/transform_alerting_flyout.tsx
@@ -53,7 +53,7 @@ export const TransformAlertFlyout: FC<TransformAlertFlyoutProps> = ({
       });
     }
 
-    return triggersActionsUi.getAddAlertFlyout({
+    return triggersActionsUi.getAddRuleFlyout({
       ...commonProps,
       consumer: 'stackAlerts',
       canChangeTrigger: false,