Show warning message when attempting to create an APM alert in stack management

x-pack/plugins/apm/public/components/alerting/error_count_alert_trigger/index.tsx

@@ -8,14 +8,20 @@
 import { i18n } from '@kbn/i18n';
 import { defaults, omit } from 'lodash';
 import React from 'react';
-import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
 import { ForLastExpression } from '../../../../../triggers_actions_ui/public';
+import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
 import { asInteger } from '../../../../common/utils/formatters';
 import { useEnvironmentsFetcher } from '../../../hooks/use_environments_fetcher';
 import { useFetcher } from '../../../hooks/use_fetcher';
 import { ChartPreview } from '../chart_preview';
 import { EnvironmentField, IsAboveField, ServiceField } from '../fields';
-import { AlertMetadata, getIntervalAndTimeRange, TimeUnit } from '../helper';
+import {
+  AlertMetadata,
+  getIntervalAndTimeRange,
+  isNewApmRuleFromStackManagement,
+  TimeUnit,
+} from '../helper';
+import { NewAlertEmptyPrompt } from '../new_alert_empty_prompt';
 import { ServiceAlertTrigger } from '../service_alert_trigger';
 
 export interface AlertParams {
@@ -81,6 +87,10 @@ export function ErrorCountAlertTrigger(props: Props) {
     ]
   );
 
+  if (isNewApmRuleFromStackManagement(alertParams, metadata)) {
+    return <NewAlertEmptyPrompt />;
+  }
+
   const fields = [
     <ServiceField value={params.serviceName} />,
     <EnvironmentField

x-pack/plugins/apm/public/components/alerting/helper.ts

@@ -36,3 +36,14 @@ export function getIntervalAndTimeRange({
     end: new Date(end).toISOString(),
   };
 }
+
+export function isNewApmRuleFromStackManagement(
+  alertParams: any,
+  metadata?: AlertMetadata
+) {
+  return (
+    alertParams !== undefined &&
+    Object.keys(alertParams).length === 0 &&
+    metadata === undefined
+  );
+}

x-pack/plugins/apm/public/components/alerting/new_alert_empty_prompt.tsx

@@ -0,0 +1,47 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+/* eslint-disable @elastic/eui/href-or-on-click */
+
+import { EuiButton, EuiEmptyPrompt } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import React, { MouseEvent } from 'react';
+import { useKibana } from '../../../../../../src/plugins/kibana_react/public';
+
+export function NewAlertEmptyPrompt() {
+  const { services } = useKibana();
+  const apmUrl = services.http?.basePath.prepend('/app/apm');
+  const navigateToUrl = services.application?.navigateToUrl;
+  const handleClick = (event: MouseEvent<HTMLAnchorElement>) => {
+    event.preventDefault();
+    if (apmUrl && navigateToUrl) {
+      navigateToUrl(apmUrl);
+    }
+  };
+
+  return (
+    <EuiEmptyPrompt
+      iconType="alert"
+      body={i18n.translate('xpack.apm.NewAlertEmptyPrompt.bodyDescription', {
+        defaultMessage:
+          'APM rules cannot be created in Stack Management. Go to APM and use the "Alerts and rules" menu.',
+      })}
+      actions={[
+        <EuiButton
+          color="primary"
+          fill={true}
+          href={apmUrl}
+          onClick={handleClick}
+        >
+          {i18n.translate('xpack.apm.NewAlertEmptyPrompt.goToApmLinkText', {
+            defaultMessage: 'Go to APM',
+          })}
+        </EuiButton>,
+      ]}
+    />
+  );
+}

x-pack/plugins/apm/public/components/alerting/transaction_duration_alert_trigger/index.tsx

@@ -9,10 +9,10 @@ import { EuiSelect } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { defaults, map, omit } from 'lodash';
 import React from 'react';
-import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
 import { CoreStart } from '../../../../../../../src/core/public';
 import { useKibana } from '../../../../../../../src/plugins/kibana_react/public';
 import { ForLastExpression } from '../../../../../triggers_actions_ui/public';
+import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
 import { getDurationFormatter } from '../../../../common/utils/formatters';
 import { useServiceTransactionTypesFetcher } from '../../../context/apm_service/use_service_transaction_types_fetcher';
 import { useEnvironmentsFetcher } from '../../../hooks/use_environments_fetcher';
@@ -29,7 +29,13 @@ import {
   ServiceField,
   TransactionTypeField,
 } from '../fields';
-import { AlertMetadata, getIntervalAndTimeRange, TimeUnit } from '../helper';
+import {
+  AlertMetadata,
+  getIntervalAndTimeRange,
+  isNewApmRuleFromStackManagement,
+  TimeUnit,
+} from '../helper';
+import { NewAlertEmptyPrompt } from '../new_alert_empty_prompt';
 import { ServiceAlertTrigger } from '../service_alert_trigger';
 import { PopoverExpression } from '../service_alert_trigger/popover_expression';
 
@@ -154,6 +160,10 @@ export function TransactionDurationAlertTrigger(props: Props) {
     />
   );
 
+  if (isNewApmRuleFromStackManagement(alertParams, metadata)) {
+    return <NewAlertEmptyPrompt />;
+  }
+
   if (!params.serviceName) {
     return null;
   }

x-pack/plugins/apm/public/components/alerting/transaction_duration_anomaly_alert_trigger/index.tsx

@@ -17,7 +17,8 @@ import {
   ServiceField,
   TransactionTypeField,
 } from '../fields';
-import { AlertMetadata } from '../helper';
+import { AlertMetadata, isNewApmRuleFromStackManagement } from '../helper';
+import { NewAlertEmptyPrompt } from '../new_alert_empty_prompt';
 import { ServiceAlertTrigger } from '../service_alert_trigger';
 import { PopoverExpression } from '../service_alert_trigger/popover_expression';
 import {
@@ -73,6 +74,10 @@ export function TransactionDurationAnomalyAlertTrigger(props: Props) {
     end: metadata?.end,
   });
 
+  if (isNewApmRuleFromStackManagement(alertParams, metadata)) {
+    return <NewAlertEmptyPrompt />;
+  }
+
   const fields = [
     <ServiceField value={params.serviceName} />,
     <TransactionTypeField

x-pack/plugins/apm/public/components/alerting/transaction_error_rate_alert_trigger/index.tsx

@@ -7,10 +7,10 @@
 
 import { defaults, omit } from 'lodash';
 import React from 'react';
-import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
 import { CoreStart } from '../../../../../../../src/core/public';
 import { useKibana } from '../../../../../../../src/plugins/kibana_react/public';
 import { ForLastExpression } from '../../../../../triggers_actions_ui/public';
+import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
 import { asPercent } from '../../../../common/utils/formatters';
 import { useServiceTransactionTypesFetcher } from '../../../context/apm_service/use_service_transaction_types_fetcher';
 import { useEnvironmentsFetcher } from '../../../hooks/use_environments_fetcher';
@@ -23,7 +23,13 @@ import {
   ServiceField,
   TransactionTypeField,
 } from '../fields';
-import { AlertMetadata, getIntervalAndTimeRange, TimeUnit } from '../helper';
+import {
+  AlertMetadata,
+  getIntervalAndTimeRange,
+  isNewApmRuleFromStackManagement,
+  TimeUnit,
+} from '../helper';
+import { NewAlertEmptyPrompt } from '../new_alert_empty_prompt';
 import { ServiceAlertTrigger } from '../service_alert_trigger';
 
 interface AlertParams {
@@ -102,6 +108,10 @@ export function TransactionErrorRateAlertTrigger(props: Props) {
     ]
   );
 
+  if (isNewApmRuleFromStackManagement(alertParams, metadata)) {
+    return <NewAlertEmptyPrompt />;
+  }
+
   const fields = [
     <ServiceField value={params.serviceName} />,
     <TransactionTypeField