[APM] Adds 'Anomaly detection' settings page to create ML jobs per environment

x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/add_environments.tsx

@@ -44,8 +44,9 @@ export const AddEnvironments = ({
     { preservePreviousData: false }
   );
 
-  const availableEnvironmentOptions = data.map((env) => ({
-    label: env,
+  const environments = [...data, ENVIRONMENT_NOT_DEFINED];
+  const environmentOptions = environments.map((env) => ({
+    label: env === ENVIRONMENT_NOT_DEFINED ? NOT_DEFINED_OPTION_LABEL : env,
     value: env,
     disabled: currentEnvironments.includes(env),
   }));
@@ -74,7 +75,7 @@ export const AddEnvironments = ({
           'xpack.apm.settings.anomalyDetection.addEnvironments.descriptionText',
           {
             defaultMessage:
-              'Choose the service environments that you want to enable anomaly detection for. Anomalies will surface for all the services and their transaction types.',
+              'Select the service environments that you want to enable anomaly detection in. Anomalies will surface for all services and transaction types within the selected environments.',
           }
         )}
       </EuiText>
@@ -96,7 +97,7 @@ export const AddEnvironments = ({
               defaultMessage: 'Select or add environments',
             }
           )}
-          options={[...availableEnvironmentOptions, NOT_DEFINED_OPTION]}
+          options={environmentOptions}
           selectedOptions={selectedOptions}
           onChange={(nextSelectedOptions) => {
             setSelected(nextSelectedOptions);
@@ -156,9 +157,9 @@ export const AddEnvironments = ({
   );
 };
 
-const NOT_DEFINED_OPTION = {
-  value: ENVIRONMENT_NOT_DEFINED,
-  label: i18n.translate('xpack.apm.filter.environment.notDefinedLabel', {
+const NOT_DEFINED_OPTION_LABEL = i18n.translate(
+  'xpack.apm.filter.environment.notDefinedLabel',
+  {
     defaultMessage: 'Not defined',
-  }),
-};
+  }
+);

x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/index.tsx

@@ -38,7 +38,7 @@ export const AnomalyDetection = () => {
       <EuiText>
         {i18n.translate('xpack.apm.settings.anomalyDetection.descriptionText', {
           defaultMessage:
-            'The Machine Learning integration enables you to see the health status of your applications in the Service map and identifies anomalies in your transaction duration to show unexpected increase in response time.',
+            'The Machine Learning anomaly detection integration enables application health status indicators in the Service map by identifying transaction duration anomalies.',
         })}
       </EuiText>
       <EuiSpacer size="l" />

x-pack/plugins/apm/public/components/app/Settings/anomaly_detection/jobs_list.tsx

@@ -101,15 +101,14 @@ export const JobsList = ({
       <EuiText>
         <FormattedMessage
           id="xpack.apm.settings.anomalyDetection.jobList.mlDescriptionText"
-          defaultMessage="You can {mlJobsLink}."
+          defaultMessage="Manage existing anomaly detection jobs in {mlJobsLink}."
           values={{
             mlJobsLink: (
               <MLLink path="jobs">
                 {i18n.translate(
                   'xpack.apm.settings.anomalyDetection.jobList.mlDescriptionText.mlJobsLinkText',
                   {
-                    defaultMessage:
-                      'manage the anomaly detection jobs in Machine Learning',
+                    defaultMessage: 'Machine Learning',
                   }
                 )}
               </MLLink>

x-pack/plugins/apm/public/components/app/Settings/index.tsx

@@ -49,12 +49,15 @@ export const Settings: React.FC = (props) => {
                     ),
                   },
                   {
-                    name: i18n.translate('xpack.apm.settings.indices', {
-                      defaultMessage: 'Indices',
-                    }),
-                    id: '2',
-                    href: getAPMHref('/settings/apm-indices', search),
-                    isSelected: pathname === '/settings/apm-indices',
+                    name: i18n.translate(
+                      'xpack.apm.settings.anomalyDetection',
+                      {
+                        defaultMessage: 'Anomaly detection',
+                      }
+                    ),
+                    id: '4',
+                    href: getAPMHref('/settings/anomaly-detection', search),
+                    isSelected: pathname === '/settings/anomaly-detection',
                   },
                   {
                     name: i18n.translate('xpack.apm.settings.customizeApp', {
@@ -65,15 +68,12 @@ export const Settings: React.FC = (props) => {
                     isSelected: pathname === '/settings/customize-ui',
                   },
                   {
-                    name: i18n.translate(
-                      'xpack.apm.settings.anomalyDetection',
-                      {
-                        defaultMessage: 'Anomaly detection',
-                      }
-                    ),
-                    id: '4',
-                    href: getAPMHref('/settings/anomaly-detection', search),
-                    isSelected: pathname === '/settings/anomaly-detection',
+                    name: i18n.translate('xpack.apm.settings.indices', {
+                      defaultMessage: 'Indices',
+                    }),
+                    id: '2',
+                    href: getAPMHref('/settings/apm-indices', search),
+                    isSelected: pathname === '/settings/apm-indices',
                   },
                 ],
               },