[ML] Anomaly Detection: Adds a page to list supplied job configurations

packages/deeplinks/ml/deep_links.ts

@@ -36,6 +36,7 @@ export type LinkId =
   | 'calendarSettings'
   | 'calendarSettings'
   | 'filterListsSettings'
-  | 'notifications';
+  | 'notifications'
+  | 'suppliedConfigurations';
 
 export type DeepLinkId = AppId | `${AppId}:${LinkId}`;

packages/default-nav/ml/default_navigation.ts

@@ -58,6 +58,9 @@ export const defaultNavigation: MlNodeDefinition = {
         {
           link: 'ml:singleMetricViewer',
         },
+        {
+          link: 'ml:suppliedConfigurations',
+        },
         {
           link: 'ml:settings',
         },

packages/kbn-doc-links/src/get_doc_links.ts

@@ -563,6 +563,8 @@ export const getDocLinks = ({ kibanaBranch, buildFlavor }: GetDocLinkOptions): D
       setUpgradeMode: `${ELASTICSEARCH_DOCS}ml-set-upgrade-mode.html`,
       trainedModels: `${MACHINE_LEARNING_DOCS}ml-trained-models.html`,
       startTrainedModelsDeployment: `${MACHINE_LEARNING_DOCS}ml-nlp-deploy-model.html`,
+      logsAnomalyDetectionConfigs: `${MACHINE_LEARNING_DOCS}ootb-ml-jobs-logs-ui.html`,
+      metricsAnomalyDetectionConfigs: `${MACHINE_LEARNING_DOCS}ootb-ml-jobs-metrics-ui.html`,
       nlpElser: `${MACHINE_LEARNING_DOCS}ml-nlp-elser.html`,
       nlpE5: `${MACHINE_LEARNING_DOCS}ml-nlp-e5.html`,
       nlpImportModel: `${MACHINE_LEARNING_DOCS}ml-nlp-import-model.html`,

x-pack/packages/security-solution/navigation/src/constants.ts

@@ -45,6 +45,7 @@ export enum ExternalPageName {
   mlAnomalyDetection = 'ml:anomalyDetection',
   mlAnomalyExplorer = 'ml:anomalyExplorer',
   mlSingleMetricViewer = 'ml:singleMetricViewer',
+  mlSuppliedConfigurations = 'ml:suppliedConfigurations',
   mlSettings = 'ml:settings',
   mlDataFrameAnalytics = 'ml:dataFrameAnalytics',
   mlResultExplorer = 'ml:resultExplorer',

x-pack/plugins/ml/common/constants/locator.ts

@@ -22,6 +22,7 @@ export const ML_PAGES = {
   MEMORY_USAGE: 'memory_usage',
   DATA_FRAME_ANALYTICS_EXPLORATION: 'data_frame_analytics/exploration',
   DATA_FRAME_ANALYTICS_MAP: 'data_frame_analytics/map',
+  SUPPLIED_CONFIGURATIONS: 'supplied_configurations',
   /**
    * Page: Data Visualizer
    */

x-pack/plugins/ml/common/types/locator.ts

@@ -72,7 +72,8 @@ export type MlGenericUrlState = MLPageState<
   | typeof ML_PAGES.AIOPS_LOG_RATE_ANALYSIS
   | typeof ML_PAGES.AIOPS_LOG_RATE_ANALYSIS_INDEX_SELECT
   | typeof ML_PAGES.AIOPS_CHANGE_POINT_DETECTION_INDEX_SELECT
-  | typeof ML_PAGES.AIOPS_CHANGE_POINT_DETECTION,
+  | typeof ML_PAGES.AIOPS_CHANGE_POINT_DETECTION
+  | typeof ML_PAGES.SUPPLIED_CONFIGURATIONS,
   MlGenericUrlPageState | undefined
 >;
 export interface AnomalyDetectionQueryState {

x-pack/plugins/ml/common/types/modules.ts

@@ -67,6 +67,13 @@ export interface RecognizeResult {
   logo: Logo;
 }
 
+export interface RecognizeModuleResultDataView {
+  id: string;
+  title: string;
+  name: string | undefined;
+}
+export type RecognizeModuleResult = RecognizeModuleResultDataView[];
+
 export interface FileBasedModule extends Omit<Module, 'jobs' | 'datafeeds' | 'kibana'> {
   jobs: Array<{ file: string; id: string }>;
   datafeeds: Array<{ file: string; job_id: string; id: string }>;

x-pack/plugins/ml/public/application/components/ml_page/side_nav.tsx

@@ -152,6 +152,18 @@ export function useSideNavItems(activeRoute: MlRoute | undefined) {
             testSubj: 'mlMainTab settings',
             highlightNestedRoutes: true,
           },
+          {
+            id: 'supplied_cofigurations',
+            name: i18n.translate(
+              'xpack.ml.navMenu.anomalyDetection.suppliedConfigurationsLinkText',
+              {
+                defaultMessage: 'Supplied Configurations',
+              }
+            ),
+            disabled: disableLinks,
+            pathId: ML_PAGES.SUPPLIED_CONFIGURATIONS,
+            testSubj: 'mlMainTab suppliedConfigurations',
+          },
         ],
       },
       {

x-pack/plugins/ml/public/application/contexts/ml/serverless_context.tsx

@@ -10,6 +10,7 @@ import React, { createContext, useContext, useMemo } from 'react';
 import type { ExperimentalFeatures, MlFeatures } from '../../../../common/constants/app';
 
 export interface EnabledFeatures {
+  showLogsSuppliedConfigurationsInfo: boolean;
   showContextualInsights: boolean;
   showNodeInfo: boolean;
   showMLNavMenu: boolean;
@@ -20,6 +21,7 @@ export interface EnabledFeatures {
   showRuleFormV2: boolean;
 }
 export const EnabledFeaturesContext = createContext<EnabledFeatures>({
+  showLogsSuppliedConfigurationsInfo: true,
   showContextualInsights: true,
   showNodeInfo: true,
   showMLNavMenu: true,
@@ -45,6 +47,7 @@ export const EnabledFeaturesContextProvider: FC<PropsWithChildren<Props>> = ({
   experimentalFeatures,
 }) => {
   const features: EnabledFeatures = {
+    showLogsSuppliedConfigurationsInfo: !isServerless,
     showContextualInsights: isServerless,
     showNodeInfo: !isServerless,
     showMLNavMenu,

x-pack/plugins/ml/public/application/jobs/new_job/recognize/page.tsx

@@ -24,6 +24,7 @@ import { isPopulatedObject } from '@kbn/ml-is-populated-object';
 import { addExcludeFrozenToQuery } from '@kbn/ml-query-utils';
 import { TIME_FORMAT } from '@kbn/ml-date-utils';
 import { type RuntimeMappings } from '@kbn/ml-runtime-field-utils';
+import type { Module } from '../../../../../common/types/modules';
 import { useDataSource } from '../../../contexts/ml';
 import { useMlKibana, useMlLocator } from '../../../contexts/kibana';
 import type {
@@ -108,7 +109,7 @@ export const Page: FC<PageProps> = ({ moduleId, existingGroupIds }) => {
    */
   const loadModule = useCallback(async () => {
     try {
-      const response = await getDataRecognizerModule({ moduleId });
+      const response = (await getDataRecognizerModule({ moduleId })) as Module;
       setJobs(response.jobs);
       setKibanaObjects(response.kibana);
 

x-pack/plugins/ml/public/application/routing/breadcrumbs.ts

@@ -50,6 +50,14 @@ export const TRAINED_MODELS: ChromeBreadcrumb = Object.freeze({
   deepLinkId: 'ml:modelManagement',
 });
 
+export const SUPPLIED_CONFIGURATIONS: ChromeBreadcrumb = Object.freeze({
+  text: i18n.translate('xpack.ml.suppliedConfigurationsLabel', {
+    defaultMessage: 'Supplied configurations',
+  }),
+  href: '/supplied_configurations',
+  deepLinkId: 'ml:suppliedConfigurations',
+});
+
 export const DATA_VISUALIZER_BREADCRUMB: ChromeBreadcrumb = Object.freeze({
   text: i18n.translate('xpack.ml.datavisualizerBreadcrumbLabel', {
     defaultMessage: 'Data Visualizer',
@@ -153,6 +161,7 @@ const breadcrumbs = {
   CREATE_JOB_BREADCRUMB,
   CALENDAR_MANAGEMENT_BREADCRUMB,
   FILTER_LISTS_BREADCRUMB,
+  SUPPLIED_CONFIGURATIONS,
 };
 type Breadcrumb = keyof typeof breadcrumbs;
 

x-pack/plugins/ml/public/application/routing/routes/index.ts

@@ -17,3 +17,4 @@ export * from './explorer';
 export * from './trained_models';
 export * from './notifications';
 export * from './memory_usage';
+export * from './supplied_configurations';

x-pack/plugins/ml/public/application/routing/routes/supplied_configurations/index.ts

@@ -0,0 +1,8 @@
+/*
+ * 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.
+ */
+
+export * from './supplied_configurations_view';

x-pack/plugins/ml/public/application/routing/routes/supplied_configurations/supplied_configurations_view.tsx

@@ -0,0 +1,86 @@
+/*
+ * 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.
+ */
+
+import type { FC } from 'react';
+import React from 'react';
+import { FormattedMessage } from '@kbn/i18n-react';
+import { i18n } from '@kbn/i18n';
+import { EuiFlexGroup, EuiFlexItem, EuiText } from '@elastic/eui';
+import { dynamic } from '@kbn/shared-ux-utility';
+import { ML_PAGES } from '../../../../locator';
+import type { NavigateToPath } from '../../../contexts/kibana';
+import type { MlRoute } from '../../router';
+import { createPath, PageLoader } from '../../router';
+import { useRouteResolver } from '../../use_resolver';
+import { basicResolvers } from '../../resolvers';
+import { getBreadcrumbWithUrlForApp } from '../../breadcrumbs';
+import { MlPageHeader } from '../../../components/page_header';
+
+const SuppliedConfigurations = dynamic(async () => ({
+  default: (await import('../../../supplied_configurations/supplied_configurations'))
+    .SuppliedConfigurations,
+}));
+
+export const suppliedConfigurationsRouteFactory = (
+  navigateToPath: NavigateToPath,
+  basePath: string
+): MlRoute => ({
+  id: 'supplied_configurations',
+  path: createPath(ML_PAGES.SUPPLIED_CONFIGURATIONS),
+  title: i18n.translate('xpack.ml.suppliedConfigurations.suppliedConfigurations.docTitle', {
+    defaultMessage: 'Supplied configurations',
+  }),
+  render: () => <PageWrapper />,
+  breadcrumbs: [
+    getBreadcrumbWithUrlForApp('ML_BREADCRUMB', navigateToPath, basePath),
+    getBreadcrumbWithUrlForApp('ANOMALY_DETECTION_BREADCRUMB', navigateToPath, basePath),
+    {
+      text: i18n.translate(
+        'xpack.ml.suppliedConfigurationsBreadcrumbs.suppliedConfigurationsLabel',
+        {
+          defaultMessage: 'Supplied configurations',
+        }
+      ),
+    },
+  ],
+  enableDatePicker: false,
+  'data-test-subj': 'mlPageSuppliedConfigurations',
+});
+
+const PageWrapper: FC = () => {
+  const { context } = useRouteResolver('full', ['canGetJobs'], basicResolvers());
+
+  return (
+    <PageLoader context={context}>
+      <MlPageHeader>
+        <EuiFlexGroup
+          responsive={false}
+          wrap={false}
+          alignItems={'flexStart'}
+          gutterSize={'m'}
+          direction="column"
+        >
+          <EuiFlexItem grow={false}>
+            <FormattedMessage
+              id="xpack.ml.suppliedConfigurations.preconfigurecJobsHeader"
+              defaultMessage="Supplied configurations"
+            />
+          </EuiFlexItem>
+          <EuiFlexItem grow={false}>
+            <EuiText size="s">
+              <FormattedMessage
+                id="xpack.ml.suppliedConfigurations.preconfigurecJobsHeaderDescription"
+                defaultMessage="This page lists pre-defined anomaly detection job configurations with related Kibana assets."
+              />
+            </EuiText>
+          </EuiFlexItem>
+        </EuiFlexGroup>
+      </MlPageHeader>
+      <SuppliedConfigurations />
+    </PageLoader>
+  );
+};

x-pack/plugins/ml/public/application/services/dashboard_service.test.ts

@@ -35,8 +35,8 @@ describe('DashboardService', () => {
     });
     expect(resp).toEqual([]);
   });
-  test('should generate edit url to the dashboard', () => {
-    dashboardService.getDashboardEditUrl('test-id');
+  test('should generate url to the dashboard', () => {
+    dashboardService.getDashboardUrl('test-id');
     expect(dashboard.locator?.getUrl).toHaveBeenCalledWith({
       dashboardId: 'test-id',
       useHash: false,

x-pack/plugins/ml/public/application/services/dashboard_service.ts

@@ -27,9 +27,18 @@ export function dashboardServiceProvider(dashboardService: DashboardStart) {
       return responses.hits;
     },
     /**
-     * Generates dashboard url with edit mode
+     * Fetch dashboards by id
      */
-    async getDashboardEditUrl(dashboardId: string) {
+    async fetchDashboardsById(ids: string[]) {
+      const findDashboardsService = await dashboardService.findDashboardsService();
+      const responses = await findDashboardsService.findByIds(ids);
+      const existingDashboards = responses.filter(({ status }) => status === 'success');
+      return existingDashboards;
+    },
+    /**
+     * Generates dashboard url
+     */
+    async getDashboardUrl(dashboardId: string, viewMode: ViewMode = ViewMode.EDIT) {
       return await dashboardService.locator?.getUrl({
         dashboardId,
         viewMode: ViewMode.EDIT,

x-pack/plugins/ml/public/application/services/ml_api_service/index.ts

@@ -19,6 +19,7 @@ import type {
   MlNodeCount,
 } from '../../../../common/types/ml_server_info';
 import type { MlCapabilitiesResponse } from '../../../../common/types/capabilities';
+import type { RecognizeModuleResult } from '../../../../common/types/modules';
 import type { Calendar, CalendarId, UpdateCalendar } from '../../../../common/types/calendars';
 import type { BucketSpanEstimatorData } from '../../../../common/types/job_service';
 import type {
@@ -439,6 +440,15 @@ export function mlApiProvider(httpService: HttpService) {
       });
     },
 
+    recognizeModule({ moduleId, size }: { moduleId: string; size?: number }) {
+      return httpService.http<RecognizeModuleResult>({
+        path: `${ML_INTERNAL_BASE_PATH}/modules/recognize_by_module/${moduleId}`,
+        method: 'GET',
+        version: '1',
+        query: { size },
+      });
+    },
+
     listDataRecognizerModules(filter?: string[]) {
       return httpService.http<any>({
         path: `${ML_INTERNAL_BASE_PATH}/modules/get_module`,
@@ -448,9 +458,10 @@ export function mlApiProvider(httpService: HttpService) {
       });
     },
 
-    getDataRecognizerModule({ moduleId, filter }: { moduleId: string; filter?: string[] }) {
-      return httpService.http<Module>({
-        path: `${ML_INTERNAL_BASE_PATH}/modules/get_module/${moduleId}`,
+    getDataRecognizerModule(params?: { moduleId: string; filter?: string[] }) {
+      const { moduleId, filter } = params || {};
+      return httpService.http<Module | Module[]>({
+        path: `${ML_INTERNAL_BASE_PATH}/modules/get_module/${moduleId ?? ''}`,
         method: 'GET',
         version: '1',
         query: { filter: filter?.join(',') },