Add MDS UTs and bug fixes

package.json

@@ -56,4 +56,4 @@
     "browserify-sign": "^4.2.2",
     "axios": "^1.6.1"
   }
-}
+}

public/pages/AnomalyCharts/containers/__tests__/AnomaliesChart.test.tsx

@@ -22,6 +22,8 @@ import {
   FAKE_ANOMALIES_RESULT,
   FAKE_DATE_RANGE,
 } from '../../../../pages/utils/__tests__/constants';
+import { Router } from 'react-router-dom';
+import { createMemoryHistory } from 'history';
 
 const DEFAULT_PROPS = {
   onDateRangeChange: jest.fn(),
@@ -47,17 +49,32 @@ const DEFAULT_PROPS = {
   entityAnomalySummaries: [],
 } as AnomaliesChartProps;
 
+const history = createMemoryHistory(); 
+
 const renderDataFilter = (chartProps: AnomaliesChartProps) => ({
   ...render(
     <Provider store={mockedStore()}>
       <CoreServicesContext.Provider value={coreServicesMock}>
-        <AnomaliesChart {...chartProps} />
+        <Router history={history}>
+          <AnomaliesChart {...chartProps} />
+        </Router>
       </CoreServicesContext.Provider>
     </Provider>
   ),
 });
 
 describe('<AnomaliesChart /> spec', () => {
+  beforeAll(() => {
+    Object.defineProperty(window, 'location', {
+      value: {
+        href: 'http://test.com',
+        pathname: '/',
+        search: '',
+        hash: '',
+      },
+      writable: true
+    });
+  });
   test('renders the component for sample / preview', () => {
     console.error = jest.fn();
     const { getByText, getAllByText } = renderDataFilter({

public/pages/AnomalyCharts/containers/__tests__/AnomalyDetailsChart.test.tsx

@@ -22,6 +22,18 @@ import {
 } from '../../../../pages/utils/__tests__/constants';
 import { INITIAL_ANOMALY_SUMMARY } from '../../utils/constants';
 import { getRandomDetector } from '../../../../redux/reducers/__tests__/utils';
+import { createMemoryHistory } from 'history';
+import { Router } from 'react-router-dom';
+
+jest.mock('../../../../services', () => ({
+  ...jest.requireActual('../../../../services'),
+
+  getDataSourceEnabled: () => ({
+    enabled: false  
+  })
+}));
+
+const history = createMemoryHistory(); 
 
 const renderAnomalyOccurenceChart = (
   isNotSample: boolean,
@@ -30,27 +42,41 @@ const renderAnomalyOccurenceChart = (
   ...render(
     <Provider store={mockedStore()}>
       <CoreServicesContext.Provider value={coreServicesMock}>
-        <AnomalyDetailsChart
-          onDateRangeChange={jest.fn()}
-          onZoomRangeChange={jest.fn()}
-          bucketizedAnomalies={false}
-          anomalySummary={INITIAL_ANOMALY_SUMMARY}
-          anomalies={FAKE_ANOMALY_DATA}
-          detector={getRandomDetector()}
-          dateRange={FAKE_DATE_RANGE}
-          isLoading={false}
-          showAlerts={isNotSample}
-          isNotSample={isNotSample}
-          isHCDetector={isHCDetector}
-          anomalyGradeSeriesName={'testAnomalyGradeSeriesName'}
-          confidenceSeriesName={'testConfidenceSeriesName'}
-        />
+        <Router history={history}>
+          <AnomalyDetailsChart
+            onDateRangeChange={jest.fn()}
+            onZoomRangeChange={jest.fn()}
+            bucketizedAnomalies={false}
+            anomalySummary={INITIAL_ANOMALY_SUMMARY}
+            anomalies={FAKE_ANOMALY_DATA}
+            detector={getRandomDetector()}
+            dateRange={FAKE_DATE_RANGE}
+            isLoading={false}
+            showAlerts={isNotSample}
+            isNotSample={isNotSample}
+            isHCDetector={isHCDetector}
+            anomalyGradeSeriesName={'testAnomalyGradeSeriesName'}
+            confidenceSeriesName={'testConfidenceSeriesName'}
+          />
+        </Router>
       </CoreServicesContext.Provider>
     </Provider>
   ),
 });
 
 describe('<AnomalyDetailsChart /> spec', () => {
+  beforeAll(() => {
+    Object.defineProperty(window, 'location', {
+      value: {
+        href: 'http://test.com',
+        pathname: '/',
+        search: '',
+        hash: '',
+      },
+      writable: true
+    });
+  });
+
   test('renders the component in case of Sample Anomaly', () => {
     console.error = jest.fn();
     const { getByText } = renderAnomalyOccurenceChart(false, false);

public/pages/AnomalyCharts/containers/__tests__/AnomalyOccurrenceChart.test.tsx

@@ -16,42 +16,67 @@ import { mockedStore } from '../../../../redux/utils/testUtils';
 import { CoreServicesContext } from '../../../../components/CoreServices/CoreServices';
 import { coreServicesMock } from '../../../../../test/mocks';
 import { AnomalyOccurrenceChart } from '../AnomalyOccurrenceChart';
+import { createMemoryHistory } from 'history';
+import { Router } from 'react-router-dom';
 import {
   FAKE_ANOMALY_DATA,
   FAKE_DATE_RANGE,
 } from '../../../../pages/utils/__tests__/constants';
 import { INITIAL_ANOMALY_SUMMARY } from '../../utils/constants';
 import { getRandomDetector } from '../../../../redux/reducers/__tests__/utils';
 
+jest.mock('../../../../services', () => ({
+  ...jest.requireActual('../../../../services'),
+
+  getDataSourceEnabled: () => ({
+    enabled: false  
+  })
+}));
+
+const history = createMemoryHistory(); 
+
 const renderAnomalyOccurenceChart = (
   isNotSample: boolean,
   isHCDetector: boolean
 ) => ({
   ...render(
     <Provider store={mockedStore()}>
       <CoreServicesContext.Provider value={coreServicesMock}>
-        <AnomalyOccurrenceChart
-          onDateRangeChange={jest.fn()}
-          onZoomRangeChange={jest.fn()}
-          title="test"
-          bucketizedAnomalies={false}
-          anomalySummary={INITIAL_ANOMALY_SUMMARY}
-          anomalies={FAKE_ANOMALY_DATA}
-          detector={getRandomDetector()}
-          dateRange={FAKE_DATE_RANGE}
-          isLoading={false}
-          showAlerts={isNotSample}
-          isNotSample={isNotSample}
-          isHCDetector={isHCDetector}
-          anomalyGradeSeriesName={'testAnomalyGradeSeriesName'}
-          confidenceSeriesName={'testConfidenceSeriesName'}
-        />
+        <Router history={history}>
+          <AnomalyOccurrenceChart
+            onDateRangeChange={jest.fn()}
+            onZoomRangeChange={jest.fn()}
+            title="test"
+            bucketizedAnomalies={false}
+            anomalySummary={INITIAL_ANOMALY_SUMMARY}
+            anomalies={FAKE_ANOMALY_DATA}
+            detector={getRandomDetector()}
+            dateRange={FAKE_DATE_RANGE}
+            isLoading={false}
+            showAlerts={isNotSample}
+            isNotSample={isNotSample}
+            isHCDetector={isHCDetector}
+            anomalyGradeSeriesName={'testAnomalyGradeSeriesName'}
+            confidenceSeriesName={'testConfidenceSeriesName'}
+          />
+        </Router>
       </CoreServicesContext.Provider>
     </Provider>
   ),
 });
 
 describe('<AnomalyOccurrenceChart /> spec', () => {
+  beforeAll(() => {
+    Object.defineProperty(window, 'location', {
+      value: {
+        href: 'http://test.com',
+        pathname: '/',
+        search: '',
+        hash: '',
+      },
+      writable: true
+    });
+  });
   test('renders the component in case of Sample Anomaly', () => {
     console.error = jest.fn();
     const { getByText } = renderAnomalyOccurenceChart(false, false);

public/pages/ConfigureModel/containers/ConfigureModel.tsx

@@ -32,7 +32,7 @@ import { RouteComponentProps, useLocation } from 'react-router-dom';
 import { AppState } from '../../../redux/reducers';
 import { getMappings } from '../../../redux/reducers/opensearch';
 import { useFetchDetectorInfo } from '../../CreateDetectorSteps/hooks/useFetchDetectorInfo';
-import { BREADCRUMBS, BASE_DOCS_LINK } from '../../../utils/constants';
+import { BREADCRUMBS, BASE_DOCS_LINK, MDS_BREADCRUMBS } from '../../../utils/constants';
 import { useHideSideNavBar } from '../../main/hooks/useHideSideNavBar';
 import { updateDetector } from '../../../redux/reducers/ad';
 import {
@@ -64,7 +64,7 @@ import {
 } from '../../../pages/utils/helpers';
 import {
   getDataSourceManagementPlugin,
-  getDataSourcePlugin,
+  getDataSourceEnabled,
   getNotifications,
   getSavedObjectsClient,
 } from '../../../services';
@@ -89,7 +89,7 @@ export function ConfigureModel(props: ConfigureModelProps) {
   const dispatch = useDispatch();
   const location = useLocation();
   const MDSQueryParams = getDataSourceFromURL(location);
-  const dataSourceEnabled = getDataSourcePlugin()?.dataSourceEnabled || false;
+  const dataSourceEnabled = getDataSourceEnabled().enabled;
   const dataSourceId = MDSQueryParams.dataSourceId;
 
   useHideSideNavBar(true, false);
@@ -122,30 +122,55 @@ export function ConfigureModel(props: ConfigureModelProps) {
   }, [detector]);
 
   useEffect(() => {
-    if (props.isEdit) {
-      core.chrome.setBreadcrumbs([
-        BREADCRUMBS.ANOMALY_DETECTOR,
-        BREADCRUMBS.DETECTORS,
-        {
-          text: detector && detector.name ? detector.name : '',
-          href: constructHrefWithDataSourceId(`#/detectors/${detectorId}`, dataSourceId, false)
-        },
-        BREADCRUMBS.EDIT_MODEL_CONFIGURATION,
-      ]);
+    if (dataSourceEnabled) {
+      if (props.isEdit) {
+        core.chrome.setBreadcrumbs([
+          MDS_BREADCRUMBS.ANOMALY_DETECTOR(dataSourceId),
+          MDS_BREADCRUMBS.DETECTORS(dataSourceId),
+          {
+            text: detector && detector.name ? detector.name : '',
+            href: constructHrefWithDataSourceId(`#/detectors/${detectorId}`, dataSourceId, false)
+          },
+          MDS_BREADCRUMBS.EDIT_MODEL_CONFIGURATION,
+        ]);
+      } else {
+        core.chrome.setBreadcrumbs([
+          MDS_BREADCRUMBS.ANOMALY_DETECTOR(dataSourceId),
+          MDS_BREADCRUMBS.DETECTORS(dataSourceId),
+          MDS_BREADCRUMBS.CREATE_DETECTOR,
+        ]);
+      }
     } else {
-      core.chrome.setBreadcrumbs([
-        BREADCRUMBS.ANOMALY_DETECTOR,
-        BREADCRUMBS.DETECTORS,
-        BREADCRUMBS.CREATE_DETECTOR,
-      ]);
+      if (props.isEdit) {
+        core.chrome.setBreadcrumbs([
+          BREADCRUMBS.ANOMALY_DETECTOR,
+          BREADCRUMBS.DETECTORS,
+          {
+            text: detector && detector.name ? detector.name : '',
+            href: `#/detectors/${detectorId}`,
+          },
+          BREADCRUMBS.EDIT_MODEL_CONFIGURATION,
+        ]);
+      } else {
+        core.chrome.setBreadcrumbs([
+          BREADCRUMBS.ANOMALY_DETECTOR,
+          BREADCRUMBS.DETECTORS,
+          BREADCRUMBS.CREATE_DETECTOR,
+        ]);
+      }
     }
   }, [detector]);
 
   useEffect(() => {
     if (hasError) {
-      props.history.push(
-        constructHrefWithDataSourceId('/detectors', dataSourceId, false)
-      );
+      if(dataSourceEnabled) {
+        props.history.push(
+          constructHrefWithDataSourceId('/detectors', dataSourceId, false)
+        );
+      }
+      else {
+        props.history.push('/detectors');
+      }
     }
   }, [hasError]);
 

public/pages/ConfigureModel/containers/__tests__/ConfigureModel.test.tsx

@@ -25,6 +25,14 @@ import { CoreServicesContext } from '../../../../components/CoreServices/CoreSer
 import { INITIAL_DETECTOR_DEFINITION_VALUES } from '../../../DefineDetector/utils/constants';
 import { INITIAL_MODEL_CONFIGURATION_VALUES } from '../../utils/constants';
 
+jest.mock('../../../../services', () => ({
+  ...jest.requireActual('../../../../services'),
+
+  getDataSourceEnabled: () => ({
+    enabled: false  
+  })
+}));
+
 const renderWithRouter = (isEdit: boolean = false) => ({
   ...render(
     <Provider store={configureStore(httpClientMock)}>
@@ -34,6 +42,7 @@ const renderWithRouter = (isEdit: boolean = false) => ({
             render={(props: RouteComponentProps) => (
               <CoreServicesContext.Provider value={coreServicesMock}>
                 <ConfigureModel
+                  setActionMenu={jest.fn()}
                   isEdit={isEdit}
                   detectorDefinitionValues={INITIAL_DETECTOR_DEFINITION_VALUES}
                   initialValues={INITIAL_MODEL_CONFIGURATION_VALUES}

public/pages/Dashboard/Components/EmptyDashboard/__tests__/EmptyDashboard.test.tsx

@@ -12,11 +12,26 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 import { EmptyDashboard } from '../EmptyDashboard';
+import { createMemoryHistory } from 'history';
+import { Router } from 'react-router-dom';
+
+jest.mock('../../../../../services', () => ({
+  ...jest.requireActual('../../../../../services'),
+
+  getDataSourceEnabled: () => ({
+    enabled: false  
+  })
+}));
+
+const history = createMemoryHistory(); 
 
 describe('<EmptyDetector /> spec', () => {
   describe('Empty results', () => {
     test('renders component with empty message', async () => {
-      const { container } = render(<EmptyDashboard />);
+      const { container } = render(
+        <Router history={history}>
+          <EmptyDashboard />
+        </Router>);
       expect(container.firstChild).toMatchSnapshot();
     });
   });

public/pages/Dashboard/Components/EmptyDashboard/__tests__/__snapshots__/EmptyDashboard.test.tsx.snap

@@ -72,7 +72,7 @@ exports[`<EmptyDetector /> spec Empty results renders component with empty messa
       <a
         class="euiButton euiButton--primary"
         data-test-subj="sampleDetectorButton"
-        href="anomaly-detection-dashboards#/overview"
+        href="anomaly-detection-dashboards#/overview?"
         rel="noreferrer"
         style="width: 200px;"
       >
@@ -93,7 +93,7 @@ exports[`<EmptyDetector /> spec Empty results renders component with empty messa
       <a
         class="euiButton euiButton--primary euiButton--fill"
         data-test-subj="createDetectorButton"
-        href="anomaly-detection-dashboards#/create-ad/"
+        href="anomaly-detection-dashboards#/create-ad/?"
         rel="noreferrer"
         style="width: 200px;"
       >