Add 'No data' state for historical detectors

public/pages/DetectorsList/utils/helpers.ts

@@ -53,14 +53,18 @@ export const getURLQueryParams = (location: {
   };
 };
 
-// For realtime detectors: cannot have 'Completed' state
+// For realtime detectors: cannot have 'Completed' nor 'No data' states
 export const getDetectorStateOptions = () => {
   return Object.values(DETECTOR_STATE)
     .map((detectorState) => ({
       label: detectorState,
       text: detectorState,
     }))
-    .filter((option) => option.label !== DETECTOR_STATE.FINISHED);
+    .filter(
+      (option) =>
+        option.label !== DETECTOR_STATE.FINISHED &&
+        option.label !== DETECTOR_STATE.NO_DATA
+    );
 };
 
 export const getDetectorsForAction = (

public/pages/HistoricalDetectorDetail/containers/HistoricalDetectorDetail/HistoricalDetectorDetail.tsx

@@ -88,7 +88,6 @@ export const HistoricalDetectorDetail = (
     isOpen: false,
     action: undefined,
   });
-  const callout = getCallout(detector, isStoppingDetector);
 
   useEffect(() => {
     if (
@@ -299,6 +298,8 @@ export const HistoricalDetectorDetail = (
     backgroundColor: '#FFF',
   };
 
+  const callout = getCallout(detector, isStoppingDetector, handleEditAction);
+
   return (
     <React.Fragment>
       {!isEmpty(detector) ? getHistoricalDetectorDetailModal() : null}

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

@@ -35,6 +35,8 @@ const ACTIONS_BUTTON_TEXT = 'Actions';
 const STOPPED_CALLOUT_TEXT = 'The historical detector is stopped';
 const INIT_CALLOUT_TEXT = 'Initializing the historical detector';
 const RUNNING_CALLOUT_TEXT = 'Running the historical detector';
+const NO_DATA_CALLOUT_TEXT =
+  'No data available in the selected detection date range.';
 const START_DETECTOR_BUTTON_TEXT = 'Start historical detector';
 const STOP_DETECTOR_BUTTON_TEXT = 'Stop historical detector';
 
@@ -167,4 +169,17 @@ describe('<HistoricalDetectorDetail /> spec', () => {
     getByText('Finished');
     getByText(START_DETECTOR_BUTTON_TEXT);
   });
+  test('shows correct callout when detector has no data', async () => {
+    httpClientMock.get = jest.fn().mockResolvedValue({
+      ok: true,
+      response: {
+        ...TEST_DETECTOR,
+        curState: DETECTOR_STATE.NO_DATA,
+      },
+    });
+    const { getByText } = renderWithRouter();
+    await wait();
+    getByText(NO_DATA_CALLOUT_TEXT);
+    getByText(START_DETECTOR_BUTTON_TEXT);
+  });
 });

public/pages/HistoricalDetectorDetail/utils/helpers.tsx

@@ -23,14 +23,19 @@ import {
   EuiText,
   EuiFlexItem,
   EuiProgress,
+  EuiButton,
 } from '@elastic/eui';
 import { Detector } from '../../../models/interfaces';
 import { DETECTOR_STATE } from '../../../../server/utils/constants';
 
 export const waitForMs = (ms: number) =>
   new Promise((res) => setTimeout(res, ms));
 
-export const getCallout = (detector: Detector, isStoppingDetector: boolean) => {
+export const getCallout = (
+  detector: Detector,
+  isStoppingDetector: boolean,
+  onEdit: () => any
+) => {
   if (!detector || !detector.curState) {
     return null;
   }
@@ -120,6 +125,22 @@ export const getCallout = (detector: Detector, isStoppingDetector: boolean) => {
           color="primary"
         />
       );
+    case DETECTOR_STATE.NO_DATA:
+      return (
+        <EuiCallOut
+          title={
+            <EuiText>
+              <p>No data available in the selected detection date range.</p>
+            </EuiText>
+          }
+          iconType="alert"
+          color="danger"
+        >
+          <EuiButton color="danger" onClick={() => onEdit()}>
+            Edit historical detector
+          </EuiButton>
+        </EuiCallOut>
+      );
     default:
       return null;
   }

public/pages/utils/constants.ts

@@ -29,6 +29,7 @@ export enum DETECTOR_STATE_COLOR {
   FEATURE_REQUIRED = '#98A2B3',
   INIT_FAILURE = '#F66',
   UNEXPECTED_FAILURE = '#F66',
+  NO_DATA = '#F66',
 }
 
 export const stateToColorMap = new Map<DETECTOR_STATE, DETECTOR_STATE_COLOR>()
@@ -41,7 +42,8 @@ export const stateToColorMap = new Map<DETECTOR_STATE, DETECTOR_STATE_COLOR>()
   .set(
     DETECTOR_STATE.UNEXPECTED_FAILURE,
     DETECTOR_STATE_COLOR.UNEXPECTED_FAILURE
-  );
+  )
+  .set(DETECTOR_STATE.NO_DATA, DETECTOR_STATE_COLOR.NO_DATA);
 
 export const ALL_DETECTOR_STATES = [];
 export const ALL_INDICES = [];

server/routes/utils/adHelpers.ts

@@ -17,7 +17,7 @@ import { get, omit, cloneDeep, isEmpty } from 'lodash';
 import { AnomalyResults } from '../../models/interfaces';
 import { GetDetectorsQueryParams, Detector } from '../../models/types';
 import { mapKeysDeep, toCamel, toSnake } from '../../utils/helpers';
-import { DETECTOR_STATE } from '../../utils/constants';
+import { DETECTOR_STATE, NO_DATA_ERROR_MSG } from '../../utils/constants';
 import { InitProgress } from '../../models/interfaces';
 
 export const convertDetectorKeysToSnakeCase = (payload: any) => {
@@ -325,15 +325,18 @@ export const appendTaskInfo = (
   return detectorMapWithTaskInfo;
 };
 
-// Four checks/transformations need to be made here:
+// Five checks/transformations need to be made here:
 // (1) set to DISABLED if there is no existing task for this detector
-// (2) set to UNEXPECTED_FAILURE if the task is in a FAILED state to stay consistent
-// (3) set to INIT if the task is in a CREATED state
-// (4) set to DISABLED if the task is in a STOPPED state
+// (2) set to NO_DATA if the task failed with NO_DATA_ERROR_MSG
+// (3) set to UNEXPECTED_FAILURE if the task is in a FAILED state to stay consistent
+// (4) set to INIT if the task is in a CREATED state
+// (5) set to DISABLED if the task is in a STOPPED state
 export const getHistoricalDetectorState = (task: any) => {
   const state = get(task, 'state', 'DISABLED');
   const updatedState =
-    state === 'FAILED'
+    state === 'FAILED' && task.error === NO_DATA_ERROR_MSG
+      ? 'NO_DATA'
+      : state === 'FAILED'
       ? 'UNEXPECTED_FAILURE'
       : state === 'CREATED'
       ? 'INIT'

server/utils/constants.ts

@@ -69,6 +69,7 @@ export enum DETECTOR_STATE {
   FEATURE_REQUIRED = 'Feature required',
   INIT_FAILURE = 'Initialization failure',
   UNEXPECTED_FAILURE = 'Unexpected failure',
+  NO_DATA = 'No data',
 }
 
 export enum SAMPLE_TYPE {
@@ -83,3 +84,5 @@ export const ENTITY_NAME_PATH_FIELD = 'entity.name';
 
 export const DOC_COUNT_FIELD = 'doc_count';
 export const KEY_FIELD = 'key';
+
+export const NO_DATA_ERROR_MSG = 'There is no data in the detection date range';