From 940b53399ecedd96845f9d249276be593e4f3e03 Mon Sep 17 00:00:00 2001
From: Anton Dosov <anton.dosov@elastic.co>
Date: Mon, 20 Jan 2020 11:40:53 +0100
Subject: [PATCH 01/12] [State Management] Remove AppState from
 edit_index_pattern page (#54104)

Replaces AppState in edit_index_pattern with state containers and state syncing utils.
In addition makes tab navigation on edit_index_pattern work with browser's undo history

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
---
 .../edit_index_pattern.html                   |   8 +-
 .../edit_index_pattern/edit_index_pattern.js  | 280 ++++++++++--------
 .../edit_index_pattern_state_container.ts     |  89 ++++++
 3 files changed, 243 insertions(+), 134 deletions(-)
 create mode 100644 src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern_state_container.ts

diff --git a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern.html b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern.html
index 4b3014fd28a51c..625227be3c2d23 100644
--- a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern.html
+++ b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern.html
@@ -83,8 +83,8 @@
         <button
           class="kuiTab"
           ng-repeat="editSection in editSections"
-          ng-class="{ 'kuiTab-isSelected': state.tab === editSection.index }"
-          ng-click="changeTab(editSection)"
+          ng-class="{ 'kuiTab-isSelected': getCurrentTab() === editSection.index }"
+          ng-click="setCurrentTab(editSection.index)"
           data-test-subj="tab-{{ editSection.index }}"
         >
           {{ editSection.title }}
@@ -120,7 +120,7 @@
 
         <div
           class="kuiFieldGroupSection"
-          ng-if="state.tab == 'indexedFields' && indexedFieldTypes.length > 0"
+          ng-if="getCurrentTab() == 'indexedFields' && indexedFieldTypes.length > 0"
         >
           <select
             data-test-subj="indexedFieldTypeFilterDropdown"
@@ -137,7 +137,7 @@
 
         <div
           class="kuiFieldGroupSection"
-          ng-if="state.tab == 'scriptedFields' && scriptedFieldLanguages.length > 0"
+          ng-if="getCurrentTab() == 'scriptedFields' && scriptedFieldLanguages.length > 0"
         >
           <select
             data-test-subj="scriptedFieldLanguageFilterDropdown"
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern.js b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern.js
index ffc9aed9a27a3b..eb7358c66e2268 100644
--- a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern.js
+++ b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern.js
@@ -37,44 +37,46 @@ import { ScriptedFieldsTable } from './scripted_fields_table';
 import { i18n } from '@kbn/i18n';
 import { I18nContext } from 'ui/i18n';
 import { npStart } from 'ui/new_platform';
+import { subscribeWithScope } from 'ui/utils/subscribe_with_scope';
 
 import { getEditBreadcrumbs } from '../breadcrumbs';
+import { createEditIndexPatternPageStateContainer } from './edit_index_pattern_state_container';
 
 const REACT_SOURCE_FILTERS_DOM_ELEMENT_ID = 'reactSourceFiltersTable';
 const REACT_INDEXED_FIELDS_DOM_ELEMENT_ID = 'reactIndexedFieldsTable';
 const REACT_SCRIPTED_FIELDS_DOM_ELEMENT_ID = 'reactScriptedFieldsTable';
 
-function updateSourceFiltersTable($scope, $state) {
-  if ($state.tab === 'sourceFilters') {
-    $scope.$$postDigest(() => {
-      const node = document.getElementById(REACT_SOURCE_FILTERS_DOM_ELEMENT_ID);
-      if (!node) {
-        return;
-      }
-
-      render(
-        <I18nContext>
-          <SourceFiltersTable
-            indexPattern={$scope.indexPattern}
-            filterFilter={$scope.fieldFilter}
-            fieldWildcardMatcher={$scope.fieldWildcardMatcher}
-            onAddOrRemoveFilter={() => {
-              $scope.editSections = $scope.editSectionsProvider(
-                $scope.indexPattern,
-                $scope.fieldFilter,
-                $scope.indexPatternListProvider
-              );
-              $scope.refreshFilters();
-              $scope.$apply();
-            }}
-          />
-        </I18nContext>,
-        node
-      );
-    });
-  } else {
-    destroySourceFiltersTable();
-  }
+const TAB_INDEXED_FIELDS = 'indexedFields';
+const TAB_SCRIPTED_FIELDS = 'scriptedFields';
+const TAB_SOURCE_FILTERS = 'sourceFilters';
+
+function updateSourceFiltersTable($scope) {
+  $scope.$$postDigest(() => {
+    const node = document.getElementById(REACT_SOURCE_FILTERS_DOM_ELEMENT_ID);
+    if (!node) {
+      return;
+    }
+
+    render(
+      <I18nContext>
+        <SourceFiltersTable
+          indexPattern={$scope.indexPattern}
+          filterFilter={$scope.fieldFilter}
+          fieldWildcardMatcher={$scope.fieldWildcardMatcher}
+          onAddOrRemoveFilter={() => {
+            $scope.editSections = $scope.editSectionsProvider(
+              $scope.indexPattern,
+              $scope.fieldFilter,
+              $scope.indexPatternListProvider
+            );
+            $scope.refreshFilters();
+            $scope.$apply();
+          }}
+        />
+      </I18nContext>,
+      node
+    );
+  });
 }
 
 function destroySourceFiltersTable() {
@@ -82,44 +84,40 @@ function destroySourceFiltersTable() {
   node && unmountComponentAtNode(node);
 }
 
-function updateScriptedFieldsTable($scope, $state) {
-  if ($state.tab === 'scriptedFields') {
-    $scope.$$postDigest(() => {
-      const node = document.getElementById(REACT_SCRIPTED_FIELDS_DOM_ELEMENT_ID);
-      if (!node) {
-        return;
-      }
-
-      render(
-        <I18nContext>
-          <ScriptedFieldsTable
-            indexPattern={$scope.indexPattern}
-            fieldFilter={$scope.fieldFilter}
-            scriptedFieldLanguageFilter={$scope.scriptedFieldLanguageFilter}
-            helpers={{
-              redirectToRoute: (obj, route) => {
-                $scope.kbnUrl.redirectToRoute(obj, route);
-                $scope.$apply();
-              },
-              getRouteHref: (obj, route) => $scope.kbnUrl.getRouteHref(obj, route),
-            }}
-            onRemoveField={() => {
-              $scope.editSections = $scope.editSectionsProvider(
-                $scope.indexPattern,
-                $scope.fieldFilter,
-                $scope.indexPatternListProvider
-              );
-              $scope.refreshFilters();
+function updateScriptedFieldsTable($scope) {
+  $scope.$$postDigest(() => {
+    const node = document.getElementById(REACT_SCRIPTED_FIELDS_DOM_ELEMENT_ID);
+    if (!node) {
+      return;
+    }
+
+    render(
+      <I18nContext>
+        <ScriptedFieldsTable
+          indexPattern={$scope.indexPattern}
+          fieldFilter={$scope.fieldFilter}
+          scriptedFieldLanguageFilter={$scope.scriptedFieldLanguageFilter}
+          helpers={{
+            redirectToRoute: (obj, route) => {
+              $scope.kbnUrl.changeToRoute(obj, route);
               $scope.$apply();
-            }}
-          />
-        </I18nContext>,
-        node
-      );
-    });
-  } else {
-    destroyScriptedFieldsTable();
-  }
+            },
+            getRouteHref: (obj, route) => $scope.kbnUrl.getRouteHref(obj, route),
+          }}
+          onRemoveField={() => {
+            $scope.editSections = $scope.editSectionsProvider(
+              $scope.indexPattern,
+              $scope.fieldFilter,
+              $scope.indexPatternListProvider
+            );
+            $scope.refreshFilters();
+            $scope.$apply();
+          }}
+        />
+      </I18nContext>,
+      node
+    );
+  });
 }
 
 function destroyScriptedFieldsTable() {
@@ -127,37 +125,33 @@ function destroyScriptedFieldsTable() {
   node && unmountComponentAtNode(node);
 }
 
-function updateIndexedFieldsTable($scope, $state) {
-  if ($state.tab === 'indexedFields') {
-    $scope.$$postDigest(() => {
-      const node = document.getElementById(REACT_INDEXED_FIELDS_DOM_ELEMENT_ID);
-      if (!node) {
-        return;
-      }
-
-      render(
-        <I18nContext>
-          <IndexedFieldsTable
-            fields={$scope.fields}
-            indexPattern={$scope.indexPattern}
-            fieldFilter={$scope.fieldFilter}
-            fieldWildcardMatcher={$scope.fieldWildcardMatcher}
-            indexedFieldTypeFilter={$scope.indexedFieldTypeFilter}
-            helpers={{
-              redirectToRoute: (obj, route) => {
-                $scope.kbnUrl.redirectToRoute(obj, route);
-                $scope.$apply();
-              },
-              getFieldInfo: $scope.getFieldInfo,
-            }}
-          />
-        </I18nContext>,
-        node
-      );
-    });
-  } else {
-    destroyIndexedFieldsTable();
-  }
+function updateIndexedFieldsTable($scope) {
+  $scope.$$postDigest(() => {
+    const node = document.getElementById(REACT_INDEXED_FIELDS_DOM_ELEMENT_ID);
+    if (!node) {
+      return;
+    }
+
+    render(
+      <I18nContext>
+        <IndexedFieldsTable
+          fields={$scope.fields}
+          indexPattern={$scope.indexPattern}
+          fieldFilter={$scope.fieldFilter}
+          fieldWildcardMatcher={$scope.fieldWildcardMatcher}
+          indexedFieldTypeFilter={$scope.indexedFieldTypeFilter}
+          helpers={{
+            redirectToRoute: (obj, route) => {
+              $scope.kbnUrl.changeToRoute(obj, route);
+              $scope.$apply();
+            },
+            getFieldInfo: $scope.getFieldInfo,
+          }}
+        />
+      </I18nContext>,
+      node
+    );
+  });
 }
 
 function destroyIndexedFieldsTable() {
@@ -165,6 +159,24 @@ function destroyIndexedFieldsTable() {
   node && unmountComponentAtNode(node);
 }
 
+function handleTabChange($scope, newTab) {
+  destroyIndexedFieldsTable();
+  destroySourceFiltersTable();
+  destroyScriptedFieldsTable();
+  updateTables($scope, newTab);
+}
+
+function updateTables($scope, currentTab) {
+  switch (currentTab) {
+    case TAB_SCRIPTED_FIELDS:
+      return updateScriptedFieldsTable($scope);
+    case TAB_INDEXED_FIELDS:
+      return updateIndexedFieldsTable($scope);
+    case TAB_SOURCE_FILTERS:
+      return updateSourceFiltersTable($scope);
+  }
+}
+
 uiRoutes.when('/management/kibana/index_patterns/:indexPatternId', {
   template,
   k7Breadcrumbs: getEditBreadcrumbs,
@@ -187,10 +199,36 @@ uiModules
     Promise,
     config,
     Private,
-    AppState,
     confirmModal
   ) {
-    const $state = ($scope.state = new AppState());
+    const {
+      startSyncingState,
+      stopSyncingState,
+      setCurrentTab,
+      getCurrentTab,
+      state$,
+    } = createEditIndexPatternPageStateContainer({
+      useHashedUrl: config.get('state:storeInSessionStorage'),
+      defaultTab: TAB_INDEXED_FIELDS,
+    });
+
+    $scope.getCurrentTab = getCurrentTab;
+    $scope.setCurrentTab = setCurrentTab;
+
+    const stateChangedSub = subscribeWithScope($scope, state$, {
+      next: ({ tab }) => {
+        handleTabChange($scope, tab);
+      },
+    });
+
+    handleTabChange($scope, getCurrentTab()); // setup initial tab depending on initial tab state
+
+    startSyncingState(); // starts syncing state between state container and url
+
+    const destroyState = () => {
+      stateChangedSub.unsubscribe();
+      stopSyncingState();
+    };
 
     $scope.fieldWildcardMatcher = (...args) =>
       fieldWildcardMatcher(...args, config.get('metaFields'));
@@ -219,8 +257,6 @@ uiModules
       );
       $scope.refreshFilters();
       $scope.fields = $scope.indexPattern.getNonScriptedFields();
-      updateIndexedFieldsTable($scope, $state);
-      updateScriptedFieldsTable($scope, $state);
     });
 
     $scope.refreshFilters = function() {
@@ -242,18 +278,6 @@ uiModules
       $scope[filter] = val || ''; // null causes filter to check for null explicitly
     };
 
-    $scope.changeTab = function(obj) {
-      $state.tab = obj.index;
-      updateIndexedFieldsTable($scope, $state);
-      updateScriptedFieldsTable($scope, $state);
-      updateSourceFiltersTable($scope, $state);
-      $state.save();
-    };
-
-    $scope.$watch('state.tab', function(tab) {
-      if (!tab) $scope.changeTab($scope.editSections[0]);
-    });
-
     $scope.$watchCollection('indexPattern.fields', function() {
       $scope.conflictFields = $scope.indexPattern.fields.filter(field => field.type === 'conflict');
     });
@@ -329,37 +353,33 @@ uiModules
         $scope.fieldFilter,
         managementSetup.indexPattern.list
       );
+
       if ($scope.fieldFilter === undefined) {
         return;
       }
 
-      switch ($state.tab) {
-        case 'indexedFields':
-          updateIndexedFieldsTable($scope, $state);
-        case 'scriptedFields':
-          updateScriptedFieldsTable($scope, $state);
-        case 'sourceFilters':
-          updateSourceFiltersTable($scope, $state);
-      }
+      updateTables($scope, getCurrentTab());
     });
 
     $scope.$watch('indexedFieldTypeFilter', () => {
-      if ($scope.indexedFieldTypeFilter !== undefined && $state.tab === 'indexedFields') {
-        updateIndexedFieldsTable($scope, $state);
+      if ($scope.indexedFieldTypeFilter !== undefined && getCurrentTab() === TAB_INDEXED_FIELDS) {
+        updateIndexedFieldsTable($scope);
       }
     });
 
     $scope.$watch('scriptedFieldLanguageFilter', () => {
-      if ($scope.scriptedFieldLanguageFilter !== undefined && $state.tab === 'scriptedFields') {
-        updateScriptedFieldsTable($scope, $state);
+      if (
+        $scope.scriptedFieldLanguageFilter !== undefined &&
+        getCurrentTab() === TAB_SCRIPTED_FIELDS
+      ) {
+        updateScriptedFieldsTable($scope);
       }
     });
 
     $scope.$on('$destroy', () => {
       destroyIndexedFieldsTable();
       destroyScriptedFieldsTable();
+      destroySourceFiltersTable();
+      destroyState();
     });
-
-    updateScriptedFieldsTable($scope, $state);
-    updateSourceFiltersTable($scope, $state);
   });
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern_state_container.ts b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern_state_container.ts
new file mode 100644
index 00000000000000..473417a7aabd61
--- /dev/null
+++ b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/edit_index_pattern_state_container.ts
@@ -0,0 +1,89 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { createHashHistory } from 'history';
+import {
+  createStateContainer,
+  syncState,
+  createKbnUrlStateStorage,
+} from '../../../../../../../../plugins/kibana_utils/public';
+
+interface IEditIndexPatternState {
+  tab: string; // TODO: type those 3 tabs with enum, when edit_index_pattern.js migrated to ts
+}
+
+/**
+ * Create state container with sync config for tab navigation specific for edit_index_pattern page
+ */
+export function createEditIndexPatternPageStateContainer({
+  defaultTab,
+  useHashedUrl,
+}: {
+  defaultTab: string;
+  useHashedUrl: boolean;
+}) {
+  // until angular is used as shell - use hash history
+  const history = createHashHistory();
+  // query param to store app state at
+  const stateStorageKey = '_a';
+  // default app state, when there is no initial state in the url
+  const defaultState = {
+    tab: defaultTab,
+  };
+  const kbnUrlStateStorage = createKbnUrlStateStorage({
+    useHash: useHashedUrl,
+    history,
+  });
+  // extract starting app state from URL and use it as starting app state in state container
+  const initialStateFromUrl = kbnUrlStateStorage.get<IEditIndexPatternState>(stateStorageKey);
+  const stateContainer = createStateContainer(
+    {
+      ...defaultState,
+      ...initialStateFromUrl,
+    },
+    {
+      setTab: (state: IEditIndexPatternState) => (tab: string) => ({ ...state, tab }),
+    },
+    {
+      tab: (state: IEditIndexPatternState) => () => state.tab,
+    }
+  );
+
+  const { start, stop } = syncState({
+    storageKey: stateStorageKey,
+    stateContainer: {
+      ...stateContainer,
+      // state syncing utility requires state containers to handle "null"
+      set: state => state && stateContainer.set(state),
+    },
+    stateStorage: kbnUrlStateStorage,
+  });
+
+  // makes sure initial url is the same as initial state (this is not really required)
+  kbnUrlStateStorage.set(stateStorageKey, stateContainer.getState(), { replace: true });
+
+  // expose api needed for Controller
+  return {
+    startSyncingState: start,
+    stopSyncingState: stop,
+    setCurrentTab: (newTab: string) => stateContainer.transitions.setTab(newTab),
+    getCurrentTab: () => stateContainer.selectors.tab(),
+    state$: stateContainer.state$,
+  };
+}

From 641fe3da44248795431461657db722eaf71a689e Mon Sep 17 00:00:00 2001
From: Marcin Tojek <mtojek@users.noreply.github.com>
Date: Mon, 20 Jan 2020 12:04:02 +0100
Subject: [PATCH 02/12] Fix: invalid translation referenced (#54901)

---
 .../kibana/server/tutorials/activemq_metrics/index.js           | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/legacy/core_plugins/kibana/server/tutorials/activemq_metrics/index.js b/src/legacy/core_plugins/kibana/server/tutorials/activemq_metrics/index.js
index 683a58c85e5525..7ed2d370debd15 100644
--- a/src/legacy/core_plugins/kibana/server/tutorials/activemq_metrics/index.js
+++ b/src/legacy/core_plugins/kibana/server/tutorials/activemq_metrics/index.js
@@ -48,7 +48,7 @@ export function activemqMetricsSpecProvider(context) {
     isBeta: true,
     artifacts: {
       application: {
-        label: i18n.translate('kbn.server.tutorials.corednsMetrics.artifacts.application.label', {
+        label: i18n.translate('kbn.server.tutorials.activemqMetrics.artifacts.application.label', {
           defaultMessage: 'Discover',
         }),
         path: '/app/kibana#/discover',

From 4328265c5d71ac63ad6d94129e610d15aaabacb2 Mon Sep 17 00:00:00 2001
From: patrykkopycinski <patryk.kopycinski@elastic.co>
Date: Mon, 20 Jan 2020 12:06:17 +0100
Subject: [PATCH 03/12] [SIEM] Use proper icons on Detections view (#55215)

---
 .../public/components/events_viewer/events_viewer.tsx     | 8 ++++++--
 .../components/signals/default_config.tsx                 | 8 ++++----
 .../signals/signals_utility_bar/batch_actions.tsx         | 2 +-
 .../components/signals/signals_utility_bar/index.tsx      | 4 ++--
 4 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/x-pack/legacy/plugins/siem/public/components/events_viewer/events_viewer.tsx b/x-pack/legacy/plugins/siem/public/components/events_viewer/events_viewer.tsx
index 77d51f68c18ca4..05a33eeba14349 100644
--- a/x-pack/legacy/plugins/siem/public/components/events_viewer/events_viewer.tsx
+++ b/x-pack/legacy/plugins/siem/public/components/events_viewer/events_viewer.tsx
@@ -42,6 +42,10 @@ const WrappedByAutoSizer = styled.div`
 `; // required by AutoSizer
 WrappedByAutoSizer.displayName = 'WrappedByAutoSizer';
 
+const StyledEuiPanel = styled(EuiPanel)`
+  max-width: 100%;
+`;
+
 interface Props {
   browserFields: BrowserFields;
   columns: ColumnHeader[];
@@ -113,7 +117,7 @@ const EventsViewerComponent: React.FC<Props> = ({
   );
 
   return (
-    <EuiPanel data-test-subj="events-viewer-panel">
+    <StyledEuiPanel data-test-subj="events-viewer-panel">
       <AutoSizer detectAnyWindowResize={true} content>
         {({ measureRef, content: { width = 0 } }) => (
           <>
@@ -225,7 +229,7 @@ const EventsViewerComponent: React.FC<Props> = ({
           </>
         )}
       </AutoSizer>
-    </EuiPanel>
+    </StyledEuiPanel>
   );
 };
 
diff --git a/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/default_config.tsx b/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/default_config.tsx
index 5c4795a8192753..e00dfa5b844739 100644
--- a/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/default_config.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/default_config.tsx
@@ -188,13 +188,13 @@ export const getSignalsActions = ({
   updateTimelineIsLoading: ({ id, isLoading }: { id: string; isLoading: boolean }) => void;
 }): TimelineAction[] => [
   {
-    getAction: ({ eventId, ecsData }: TimelineActionProps): JSX.Element => (
+    getAction: ({ ecsData }: TimelineActionProps): JSX.Element => (
       <EuiToolTip
         data-test-subj="send-signal-to-timeline-tool-tip"
         content={i18n.ACTION_VIEW_IN_TIMELINE}
       >
         <EuiButtonIcon
-          data-test-subj={'send-signal-to-timeline-button'}
+          data-test-subj="send-signal-to-timeline-button"
           onClick={() =>
             sendSignalToTimelineAction({
               apolloClient,
@@ -203,7 +203,7 @@ export const getSignalsActions = ({
               updateTimelineIsLoading,
             })
           }
-          iconType="tableDensityNormal"
+          iconType="timeline"
           aria-label="Next"
         />
       </EuiToolTip>
@@ -228,7 +228,7 @@ export const getSignalsActions = ({
             })
           }
           isDisabled={!canUserCRUD || !hasIndexWrite}
-          iconType={status === FILTER_OPEN ? 'indexOpen' : 'indexClose'}
+          iconType={status === FILTER_OPEN ? 'securitySignalDetected' : 'securitySignalResolved'}
           aria-label="Next"
         />
       </EuiToolTip>
diff --git a/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/signals_utility_bar/batch_actions.tsx b/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/signals_utility_bar/batch_actions.tsx
index b756b2eb75a7a7..bb45ff68cb01d6 100644
--- a/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/signals_utility_bar/batch_actions.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/signals_utility_bar/batch_actions.tsx
@@ -61,7 +61,7 @@ export const getBatchItems = ({
 
     <EuiContextMenuItem
       key={filterString}
-      icon={isFilteredToOpen ? 'indexClose' : 'indexOpen'}
+      icon={isFilteredToOpen ? 'securitySignalResolved' : 'securitySignalDetected'}
       disabled={allDisabled}
       onClick={async () => {
         closePopover();
diff --git a/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/signals_utility_bar/index.tsx b/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/signals_utility_bar/index.tsx
index 0af3635d4c473b..13d77385c53d42 100644
--- a/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/signals_utility_bar/index.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/detection_engine/components/signals/signals_utility_bar/index.tsx
@@ -80,7 +80,7 @@ const SignalsUtilityBarComponent: React.FC<SignalsUtilityBarProps> = ({
 
                 <UtilityBarAction
                   disabled={areEventsLoading || isEmpty(selectedEventIds)}
-                  iconType={isFilteredToOpen ? 'indexClose' : 'indexOpen'}
+                  iconType={isFilteredToOpen ? 'securitySignalResolved' : 'securitySignalDetected'}
                   onClick={handleUpdateStatus}
                 >
                   {isFilteredToOpen
@@ -89,7 +89,7 @@ const SignalsUtilityBarComponent: React.FC<SignalsUtilityBarProps> = ({
                 </UtilityBarAction>
 
                 <UtilityBarAction
-                  iconType="listAdd"
+                  iconType={showClearSelection ? 'cross' : 'pagesSelect'}
                   onClick={() => {
                     if (!showClearSelection) {
                       selectAll();

From 6c420b7d86a613c422597dab0819ee71a91de5c5 Mon Sep 17 00:00:00 2001
From: Shahzad <shahzad.muhammad@elastic.co>
Date: Mon, 20 Jan 2020 12:19:30 +0100
Subject: [PATCH 04/12] fix commonly used ranges uptime (#54930)

---
 .../public/contexts/uptime_settings_context.tsx     | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/x-pack/legacy/plugins/uptime/public/contexts/uptime_settings_context.tsx b/x-pack/legacy/plugins/uptime/public/contexts/uptime_settings_context.tsx
index b529d5346e88ea..4b3abb46ac1e4a 100644
--- a/x-pack/legacy/plugins/uptime/public/contexts/uptime_settings_context.tsx
+++ b/x-pack/legacy/plugins/uptime/public/contexts/uptime_settings_context.tsx
@@ -37,7 +37,7 @@ const defaultContext: UptimeSettingsContextValues = {
 export const UptimeSettingsContext = createContext(defaultContext);
 
 export const UptimeSettingsContextProvider: React.FC<UptimeAppProps> = ({ children, ...props }) => {
-  const { basePath, isApmAvailable, isInfraAvailable, isLogsAvailable } = props;
+  const { basePath, isApmAvailable, isInfraAvailable, isLogsAvailable, commonlyUsedRanges } = props;
 
   const { dateRangeStart, dateRangeEnd } = useParams();
 
@@ -47,10 +47,19 @@ export const UptimeSettingsContextProvider: React.FC<UptimeAppProps> = ({ childr
       isApmAvailable,
       isInfraAvailable,
       isLogsAvailable,
+      commonlyUsedRanges,
       dateRangeStart: dateRangeStart ?? DATE_RANGE_START,
       dateRangeEnd: dateRangeEnd ?? DATE_RANGE_END,
     };
-  }, [basePath, isApmAvailable, isInfraAvailable, isLogsAvailable, dateRangeStart, dateRangeEnd]);
+  }, [
+    basePath,
+    isApmAvailable,
+    isInfraAvailable,
+    isLogsAvailable,
+    dateRangeStart,
+    dateRangeEnd,
+    commonlyUsedRanges,
+  ]);
 
   return <UptimeSettingsContext.Provider value={value} children={children} />;
 };

From a9824f476b42a67a5e4a9dbb285fa4ffbb3f6e44 Mon Sep 17 00:00:00 2001
From: Mikhail Shustov <restrry@gmail.com>
Date: Mon, 20 Jan 2020 13:37:07 +0100
Subject: [PATCH 05/12] remove flaly assetion. a license presence tested anyway
 (#55289)

---
 x-pack/plugins/licensing/server/plugin.test.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/x-pack/plugins/licensing/server/plugin.test.ts b/x-pack/plugins/licensing/server/plugin.test.ts
index 9547a2dc529665..c9fbb61e6cc19b 100644
--- a/x-pack/plugins/licensing/server/plugin.test.ts
+++ b/x-pack/plugins/licensing/server/plugin.test.ts
@@ -261,7 +261,6 @@ describe('licensing plugin', () => {
         expect(customClient.callAsInternalUser).toHaveBeenCalledTimes(1);
 
         await flushPromises(customPollingFrequency * 1.5);
-        expect(customClient.callAsInternalUser).toHaveBeenCalledTimes(2);
 
         expect(customLicense.isAvailable).toBe(true);
         expect(customLicense.type).toBe('gold');

From 82ab1a604ff13938694d58a37028b40ada26d59f Mon Sep 17 00:00:00 2001
From: James Gowdy <jgowdy@elastic.co>
Date: Mon, 20 Jan 2020 13:24:48 +0000
Subject: [PATCH 06/12] [ML] Improving job wizards with datafeed aggregations
 (#55180)

* [ML] Improving job wizards with datafeed aggregations

* picking all agg keys for fields

* function move and rename
---
 .../ml/common/constants/field_types.ts        |  1 +
 .../job_creator/advanced_job_creator.ts       |  2 +-
 .../job_creator/categorization_job_creator.ts |  2 +-
 .../new_job/common/job_creator/job_creator.ts | 19 ++++-
 .../job_creator/multi_metric_job_creator.ts   |  2 +-
 .../job_creator/population_job_creator.ts     |  2 +-
 .../job_creator/single_metric_job_creator.ts  |  2 +-
 .../common/job_creator/util/general.ts        | 72 ++++++++++++++-----
 .../time_field/time_field_select.tsx          |  6 +-
 .../advanced_detector_modal.tsx               | 31 ++++----
 .../categorization_field_select.tsx           |  8 +--
 .../influencers/influencers_select.tsx        |  4 +-
 .../summary_count_field_select.tsx            |  6 +-
 13 files changed, 104 insertions(+), 53 deletions(-)

diff --git a/x-pack/legacy/plugins/ml/common/constants/field_types.ts b/x-pack/legacy/plugins/ml/common/constants/field_types.ts
index 6c9af703c148a9..9402e4c20e46ff 100644
--- a/x-pack/legacy/plugins/ml/common/constants/field_types.ts
+++ b/x-pack/legacy/plugins/ml/common/constants/field_types.ts
@@ -16,3 +16,4 @@ export enum ML_JOB_FIELD_TYPES {
 }
 
 export const MLCATEGORY = 'mlcategory';
+export const DOC_COUNT = 'doc_count';
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/advanced_job_creator.ts b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/advanced_job_creator.ts
index b0eb1b98cd02b8..4530c00c105355 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/advanced_job_creator.ts
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/advanced_job_creator.ts
@@ -183,7 +183,7 @@ export class AdvancedJobCreator extends JobCreator {
 
   public cloneFromExistingJob(job: Job, datafeed: Datafeed) {
     this._overrideConfigs(job, datafeed);
-    const detectors = getRichDetectors(job, datafeed, this.scriptFields, true);
+    const detectors = getRichDetectors(job, datafeed, this.additionalFields, true);
 
     // keep track of the custom rules for each detector
     const customRules = this._detectors.map(d => d.custom_rules);
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/categorization_job_creator.ts b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/categorization_job_creator.ts
index 7c070ccc6bc534..71619311c4361d 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/categorization_job_creator.ts
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/categorization_job_creator.ts
@@ -140,7 +140,7 @@ export class CategorizationJobCreator extends JobCreator {
   public cloneFromExistingJob(job: Job, datafeed: Datafeed) {
     this._overrideConfigs(job, datafeed);
     this.createdBy = CREATED_BY_LABEL.CATEGORIZATION;
-    const detectors = getRichDetectors(job, datafeed, this.scriptFields, false);
+    const detectors = getRichDetectors(job, datafeed, this.additionalFields, false);
 
     const dtr = detectors[0];
     if (detectors.length && dtr.agg !== null && dtr.field !== null) {
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/job_creator.ts b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/job_creator.ts
index 513c8239db01e0..90c189c9d61971 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/job_creator.ts
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/job_creator.ts
@@ -19,7 +19,7 @@ import {
   CREATED_BY_LABEL,
   SHARED_RESULTS_INDEX_NAME,
 } from '../../../../../../common/constants/new_job';
-import { isSparseDataJob } from './util/general';
+import { isSparseDataJob, collectAggs } from './util/general';
 import { parseInterval } from '../../../../../../common/util/parse_interval';
 import { Calendar } from '../../../../../../common/types/calendars';
 import { mlCalendarService } from '../../../../services/calendar_service';
@@ -43,6 +43,7 @@ export class JobCreator {
   protected _aggs: Aggregation[] = [];
   protected _fields: Field[] = [];
   protected _scriptFields: Field[] = [];
+  protected _aggregationFields: Field[] = [];
   protected _sparseData: boolean = false;
   private _stopAllRefreshPolls: {
     stop: boolean;
@@ -450,6 +451,14 @@ export class JobCreator {
     return this._scriptFields;
   }
 
+  public get aggregationFields(): Field[] {
+    return this._aggregationFields;
+  }
+
+  public get additionalFields(): Field[] {
+    return [...this._scriptFields, ...this._aggregationFields];
+  }
+
   public get subscribers(): ProgressSubscriber[] {
     return this._subscribers;
   }
@@ -603,6 +612,7 @@ export class JobCreator {
     }
     this._sparseData = isSparseDataJob(job, datafeed);
 
+    this._scriptFields = [];
     if (this._datafeed_config.script_fields !== undefined) {
       this._scriptFields = Object.keys(this._datafeed_config.script_fields).map(f => ({
         id: f,
@@ -610,8 +620,11 @@ export class JobCreator {
         type: ES_FIELD_TYPES.KEYWORD,
         aggregatable: true,
       }));
-    } else {
-      this._scriptFields = [];
+    }
+
+    this._aggregationFields = [];
+    if (this._datafeed_config.aggregations?.buckets !== undefined) {
+      collectAggs(this._datafeed_config.aggregations.buckets, this._aggregationFields);
     }
   }
 }
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/multi_metric_job_creator.ts b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/multi_metric_job_creator.ts
index 8a4411bf9025f7..7c5fba028d9e8f 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/multi_metric_job_creator.ts
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/multi_metric_job_creator.ts
@@ -153,7 +153,7 @@ export class MultiMetricJobCreator extends JobCreator {
   public cloneFromExistingJob(job: Job, datafeed: Datafeed) {
     this._overrideConfigs(job, datafeed);
     this.createdBy = CREATED_BY_LABEL.MULTI_METRIC;
-    const detectors = getRichDetectors(job, datafeed, this.scriptFields, false);
+    const detectors = getRichDetectors(job, datafeed, this.additionalFields, false);
 
     if (datafeed.aggregations !== undefined) {
       // if we've converting from a single metric job,
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/population_job_creator.ts b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/population_job_creator.ts
index 9300e53c578e1b..3009d68ca67caa 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/population_job_creator.ts
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/population_job_creator.ts
@@ -135,7 +135,7 @@ export class PopulationJobCreator extends JobCreator {
   public cloneFromExistingJob(job: Job, datafeed: Datafeed) {
     this._overrideConfigs(job, datafeed);
     this.createdBy = CREATED_BY_LABEL.POPULATION;
-    const detectors = getRichDetectors(job, datafeed, this.scriptFields, false);
+    const detectors = getRichDetectors(job, datafeed, this.additionalFields, false);
 
     this.removeAllDetectors();
 
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/single_metric_job_creator.ts b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/single_metric_job_creator.ts
index f98fd4dbe970a5..9f3500185c2bfa 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/single_metric_job_creator.ts
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/single_metric_job_creator.ts
@@ -190,7 +190,7 @@ export class SingleMetricJobCreator extends JobCreator {
   public cloneFromExistingJob(job: Job, datafeed: Datafeed) {
     this._overrideConfigs(job, datafeed);
     this.createdBy = CREATED_BY_LABEL.SINGLE_METRIC;
-    const detectors = getRichDetectors(job, datafeed, this.scriptFields, false);
+    const detectors = getRichDetectors(job, datafeed, this.additionalFields, false);
 
     this.removeAllDetectors();
 
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/util/general.ts b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/util/general.ts
index 6443539a9877da..e5b6212a4326e5 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/util/general.ts
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/common/job_creator/util/general.ts
@@ -11,7 +11,8 @@ import {
   ML_JOB_AGGREGATION,
   SPARSE_DATA_AGGREGATIONS,
 } from '../../../../../../../common/constants/aggregation_types';
-import { MLCATEGORY } from '../../../../../../../common/constants/field_types';
+import { MLCATEGORY, DOC_COUNT } from '../../../../../../../common/constants/field_types';
+import { ES_FIELD_TYPES } from '../../../../../../../../../../../src/plugins/data/public';
 import {
   EVENT_RATE_FIELD_ID,
   Field,
@@ -27,14 +28,14 @@ import {
 } from '../index';
 import { CREATED_BY_LABEL, JOB_TYPE } from '../../../../../../../common/constants/new_job';
 
-const getFieldByIdFactory = (scriptFields: Field[]) => (id: string) => {
+const getFieldByIdFactory = (additionalFields: Field[]) => (id: string) => {
   let field = newJobCapsService.getFieldById(id);
   // if no field could be found it may be a pretend field, like mlcategory or a script field
   if (field === null) {
     if (id === MLCATEGORY) {
       field = mlCategory;
-    } else if (scriptFields.length) {
-      field = scriptFields.find(f => f.id === id) || null;
+    } else if (additionalFields.length) {
+      field = additionalFields.find(f => f.id === id) || null;
     }
   }
   return field;
@@ -44,12 +45,12 @@ const getFieldByIdFactory = (scriptFields: Field[]) => (id: string) => {
 export function getRichDetectors(
   job: Job,
   datafeed: Datafeed,
-  scriptFields: Field[],
+  additionalFields: Field[],
   advanced: boolean = false
 ) {
   const detectors = advanced ? getDetectorsAdvanced(job, datafeed) : getDetectors(job, datafeed);
 
-  const getFieldById = getFieldByIdFactory(scriptFields);
+  const getFieldById = getFieldByIdFactory(additionalFields);
 
   return detectors.map(d => {
     let field = null;
@@ -82,19 +83,19 @@ export function getRichDetectors(
   });
 }
 
-export function createFieldOptions(fields: Field[]) {
-  return fields
-    .filter(f => f.id !== EVENT_RATE_FIELD_ID)
-    .map(f => ({
-      label: f.name,
-    }))
-    .sort((a, b) => a.label.localeCompare(b.label));
-}
-
-export function createScriptFieldOptions(scriptFields: Field[]) {
-  return scriptFields.map(f => ({
-    label: f.id,
-  }));
+export function createFieldOptions(fields: Field[], additionalFields: Field[]) {
+  return [
+    ...fields
+      .filter(f => f.id !== EVENT_RATE_FIELD_ID)
+      .map(f => ({
+        label: f.name,
+      })),
+    ...additionalFields
+      .filter(f => fields.some(f2 => f2.id === f.id) === false)
+      .map(f => ({
+        label: f.id,
+      })),
+  ].sort((a, b) => a.label.localeCompare(b.label));
 }
 
 export function createMlcategoryFieldOption(categorizationFieldName: string | null) {
@@ -108,6 +109,16 @@ export function createMlcategoryFieldOption(categorizationFieldName: string | nu
   ];
 }
 
+export function createDocCountFieldOption(usingAggregations: boolean) {
+  return usingAggregations
+    ? [
+        {
+          label: DOC_COUNT,
+        },
+      ]
+    : [];
+}
+
 function getDetectorsAdvanced(job: Job, datafeed: Datafeed) {
   return processFieldlessAggs(job.analysis_config.detectors);
 }
@@ -305,3 +316,26 @@ export function getJobCreatorTitle(jobCreator: JobCreatorType) {
       return '';
   }
 }
+
+// recurse through a datafeed aggregation object,
+// adding top level keys from each nested agg to an array
+// of fields
+export function collectAggs(o: any, aggFields: Field[]) {
+  for (const i in o) {
+    if (o[i] !== null && typeof o[i] === 'object') {
+      if (i === 'aggregations' || i === 'aggs') {
+        Object.keys(o[i]).forEach(k => {
+          if (k !== 'aggregations' && i !== 'aggs') {
+            aggFields.push({
+              id: k,
+              name: k,
+              type: ES_FIELD_TYPES.KEYWORD,
+              aggregatable: true,
+            });
+          }
+        });
+      }
+      collectAggs(o[i], aggFields);
+    }
+  }
+}
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/datafeed_step/components/time_field/time_field_select.tsx b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/datafeed_step/components/time_field/time_field_select.tsx
index f2e25168668352..9af1226d1fe6c7 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/datafeed_step/components/time_field/time_field_select.tsx
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/datafeed_step/components/time_field/time_field_select.tsx
@@ -4,9 +4,10 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React, { FC } from 'react';
+import React, { FC, useContext } from 'react';
 import { EuiComboBox, EuiComboBoxOptionProps } from '@elastic/eui';
 
+import { JobCreatorContext } from '../../../job_creator_context';
 import { Field } from '../../../../../../../../../common/types/fields';
 import { createFieldOptions } from '../../../../../common/job_creator/util/general';
 
@@ -17,7 +18,8 @@ interface Props {
 }
 
 export const TimeFieldSelect: FC<Props> = ({ fields, changeHandler, selectedField }) => {
-  const options: EuiComboBoxOptionProps[] = createFieldOptions(fields);
+  const { jobCreator } = useContext(JobCreatorContext);
+  const options: EuiComboBoxOptionProps[] = createFieldOptions(fields, jobCreator.additionalFields);
 
   const selection: EuiComboBoxOptionProps[] = [];
   if (selectedField !== null) {
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/advanced_detector_modal/advanced_detector_modal.tsx b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/advanced_detector_modal/advanced_detector_modal.tsx
index 06c8068a9c0052..753cea7adcb353 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/advanced_detector_modal/advanced_detector_modal.tsx
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/advanced_detector_modal/advanced_detector_modal.tsx
@@ -18,7 +18,6 @@ import { JobCreatorContext } from '../../../job_creator_context';
 import { AdvancedJobCreator } from '../../../../../common/job_creator';
 import {
   createFieldOptions,
-  createScriptFieldOptions,
   createMlcategoryFieldOption,
 } from '../../../../../common/job_creator/util/general';
 import {
@@ -88,7 +87,7 @@ export const AdvancedDetectorModal: FC<Props> = ({
   const [fieldOptionEnabled, setFieldOptionEnabled] = useState(true);
   const { descriptionPlaceholder, setDescriptionPlaceholder } = useDetectorPlaceholder(detector);
 
-  const usingScriptFields = jobCreator.scriptFields.length > 0;
+  const usingScriptFields = jobCreator.additionalFields.length > 0;
   // list of aggregation combobox options.
 
   const aggOptions: EuiComboBoxOptionProps[] = aggs
@@ -98,12 +97,12 @@ export const AdvancedDetectorModal: FC<Props> = ({
   // fields available for the selected agg
   const { currentFieldOptions, setCurrentFieldOptions } = useCurrentFieldOptions(
     detector.agg,
-    jobCreator.scriptFields
+    jobCreator.additionalFields,
+    fields
   );
 
   const allFieldOptions: EuiComboBoxOptionProps[] = [
-    ...createFieldOptions(fields),
-    ...createScriptFieldOptions(jobCreator.scriptFields),
+    ...createFieldOptions(fields, jobCreator.additionalFields),
   ].sort(comboBoxOptionsSort);
 
   const splitFieldOptions: EuiComboBoxOptionProps[] = [
@@ -127,7 +126,9 @@ export const AdvancedDetectorModal: FC<Props> = ({
       return mlCategory;
     }
     return (
-      fields.find(f => f.id === title) || jobCreator.scriptFields.find(f => f.id === title) || null
+      fields.find(f => f.id === title) ||
+      jobCreator.additionalFields.find(f => f.id === title) ||
+      null
     );
   }
 
@@ -365,21 +366,27 @@ function useDetectorPlaceholder(detector: RichDetector) {
 }
 
 // creates list of combobox options based on an aggregation's field list
-function createFieldOptionsFromAgg(agg: Aggregation | null) {
-  return createFieldOptions(agg !== null && agg.fields !== undefined ? agg.fields : []);
+function createFieldOptionsFromAgg(agg: Aggregation | null, additionalFields: Field[]) {
+  return createFieldOptions(
+    agg !== null && agg.fields !== undefined ? agg.fields : [],
+    additionalFields
+  );
 }
 
 // custom hook for storing combobox options based on an aggregation field list
-function useCurrentFieldOptions(aggregation: Aggregation | null, scriptFields: Field[]) {
+function useCurrentFieldOptions(
+  aggregation: Aggregation | null,
+  additionalFields: Field[],
+  fields: Field[]
+) {
   const [currentFieldOptions, setCurrentFieldOptions] = useState(
-    createFieldOptionsFromAgg(aggregation)
+    createFieldOptionsFromAgg(aggregation, additionalFields)
   );
-  const scriptFieldOptions = createScriptFieldOptions(scriptFields);
 
   return {
     currentFieldOptions,
     setCurrentFieldOptions: (agg: Aggregation | null) =>
-      setCurrentFieldOptions([...createFieldOptionsFromAgg(agg), ...scriptFieldOptions]),
+      setCurrentFieldOptions(createFieldOptionsFromAgg(agg, additionalFields)),
   };
 }
 
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/categorization_field/categorization_field_select.tsx b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/categorization_field/categorization_field_select.tsx
index d995d40284abae..6451c2785eae0b 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/categorization_field/categorization_field_select.tsx
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/categorization_field/categorization_field_select.tsx
@@ -9,10 +9,7 @@ import { EuiComboBox, EuiComboBoxOptionProps } from '@elastic/eui';
 
 import { JobCreatorContext } from '../../../job_creator_context';
 import { Field } from '../../../../../../../../../common/types/fields';
-import {
-  createFieldOptions,
-  createScriptFieldOptions,
-} from '../../../../../common/job_creator/util/general';
+import { createFieldOptions } from '../../../../../common/job_creator/util/general';
 
 interface Props {
   fields: Field[];
@@ -23,8 +20,7 @@ interface Props {
 export const CategorizationFieldSelect: FC<Props> = ({ fields, changeHandler, selectedField }) => {
   const { jobCreator } = useContext(JobCreatorContext);
   const options: EuiComboBoxOptionProps[] = [
-    ...createFieldOptions(fields),
-    ...createScriptFieldOptions(jobCreator.scriptFields),
+    ...createFieldOptions(fields, jobCreator.additionalFields),
   ];
 
   const selection: EuiComboBoxOptionProps[] = [];
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/influencers/influencers_select.tsx b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/influencers/influencers_select.tsx
index 639bdb9ec76bfd..d4ac470f4ea4fa 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/influencers/influencers_select.tsx
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/influencers/influencers_select.tsx
@@ -11,7 +11,6 @@ import { JobCreatorContext } from '../../../job_creator_context';
 import { Field } from '../../../../../../../../../common/types/fields';
 import {
   createFieldOptions,
-  createScriptFieldOptions,
   createMlcategoryFieldOption,
 } from '../../../../../common/job_creator/util/general';
 
@@ -24,8 +23,7 @@ interface Props {
 export const InfluencersSelect: FC<Props> = ({ fields, changeHandler, selectedInfluencers }) => {
   const { jobCreator } = useContext(JobCreatorContext);
   const options: EuiComboBoxOptionProps[] = [
-    ...createFieldOptions(fields),
-    ...createScriptFieldOptions(jobCreator.scriptFields),
+    ...createFieldOptions(fields, jobCreator.additionalFields),
     ...createMlcategoryFieldOption(jobCreator.categorizationFieldName),
   ];
 
diff --git a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/summary_count_field/summary_count_field_select.tsx b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/summary_count_field/summary_count_field_select.tsx
index efe32e3173cade..6fe3aaf0a86526 100644
--- a/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/summary_count_field/summary_count_field_select.tsx
+++ b/x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/pick_fields_step/components/summary_count_field/summary_count_field_select.tsx
@@ -11,7 +11,7 @@ import { JobCreatorContext } from '../../../job_creator_context';
 import { Field } from '../../../../../../../../../common/types/fields';
 import {
   createFieldOptions,
-  createScriptFieldOptions,
+  createDocCountFieldOption,
 } from '../../../../../common/job_creator/util/general';
 
 interface Props {
@@ -23,8 +23,8 @@ interface Props {
 export const SummaryCountFieldSelect: FC<Props> = ({ fields, changeHandler, selectedField }) => {
   const { jobCreator } = useContext(JobCreatorContext);
   const options: EuiComboBoxOptionProps[] = [
-    ...createFieldOptions(fields),
-    ...createScriptFieldOptions(jobCreator.scriptFields),
+    ...createFieldOptions(fields, jobCreator.additionalFields),
+    ...createDocCountFieldOption(jobCreator.aggregationFields.length > 0),
   ];
 
   const selection: EuiComboBoxOptionProps[] = [];

From de7a22d52392ba947199b194ab525fa923e74235 Mon Sep 17 00:00:00 2001
From: Pierre Gayvallet <pierre.gayvallet@elastic.co>
Date: Mon, 20 Jan 2020 15:00:11 +0100
Subject: [PATCH 07/12] Show error page when accessing unavailable app (#54656)

* display not found page instead of throwing an error when accessible unavailable app

* move types to public folder

* fix types import

* remove updater from start app

* remove unnecessary await
---
 .../application_service.test.ts.snap          |  84 ++++++++++++++
 .../application/application_service.test.ts   |  12 +-
 .../application/application_service.tsx       |  13 ++-
 .../integration_tests/router.test.tsx         |  33 ++++++
 .../public/application/ui/app_container.tsx   |   9 +-
 .../application/ui/app_not_found_screen.tsx   |   2 +-
 src/core/public/application/ui/app_router.tsx | 103 ++++++++++--------
 .../core_app_status/public/application.tsx    |  14 +--
 .../plugins/core_app_status/public/index.ts   |   4 +-
 .../plugins/core_app_status/public/plugin.tsx |  31 ++++--
 .../plugins/core_app_status/public/types.ts   |  26 +++++
 .../core_plugins/application_status.ts        |  73 +++++++------
 12 files changed, 292 insertions(+), 112 deletions(-)
 create mode 100644 src/core/public/application/__snapshots__/application_service.test.ts.snap
 create mode 100644 test/plugin_functional/plugins/core_app_status/public/types.ts

diff --git a/src/core/public/application/__snapshots__/application_service.test.ts.snap b/src/core/public/application/__snapshots__/application_service.test.ts.snap
new file mode 100644
index 00000000000000..376b320b64ea9a
--- /dev/null
+++ b/src/core/public/application/__snapshots__/application_service.test.ts.snap
@@ -0,0 +1,84 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`#start() getComponent returns renderable JSX tree 1`] = `
+<AppRouter
+  appStatuses$={
+    AnonymousSubject {
+      "_isScalar": false,
+      "closed": false,
+      "destination": AnonymousSubject {
+        "_isScalar": false,
+        "closed": false,
+        "destination": BehaviorSubject {
+          "_isScalar": false,
+          "_value": Map {},
+          "closed": false,
+          "hasError": false,
+          "isStopped": false,
+          "observers": Array [],
+          "thrownError": null,
+        },
+        "hasError": false,
+        "isStopped": false,
+        "observers": Array [],
+        "operator": MapOperator {
+          "project": [Function],
+          "thisArg": undefined,
+        },
+        "source": BehaviorSubject {
+          "_isScalar": false,
+          "_value": Map {},
+          "closed": false,
+          "hasError": false,
+          "isStopped": false,
+          "observers": Array [],
+          "thrownError": null,
+        },
+        "thrownError": null,
+      },
+      "hasError": false,
+      "isStopped": false,
+      "observers": Array [],
+      "operator": [Function],
+      "source": AnonymousSubject {
+        "_isScalar": false,
+        "closed": false,
+        "destination": BehaviorSubject {
+          "_isScalar": false,
+          "_value": Map {},
+          "closed": false,
+          "hasError": false,
+          "isStopped": false,
+          "observers": Array [],
+          "thrownError": null,
+        },
+        "hasError": false,
+        "isStopped": false,
+        "observers": Array [],
+        "operator": MapOperator {
+          "project": [Function],
+          "thisArg": undefined,
+        },
+        "source": BehaviorSubject {
+          "_isScalar": false,
+          "_value": Map {},
+          "closed": false,
+          "hasError": false,
+          "isStopped": false,
+          "observers": Array [],
+          "thrownError": null,
+        },
+        "thrownError": null,
+      },
+      "thrownError": null,
+    }
+  }
+  history={
+    Object {
+      "push": [MockFunction],
+    }
+  }
+  mounters={Map {}}
+  setAppLeaveHandler={[Function]}
+/>
+`;
diff --git a/src/core/public/application/application_service.test.ts b/src/core/public/application/application_service.test.ts
index 4672a42c9eb060..54489fbd182b47 100644
--- a/src/core/public/application/application_service.test.ts
+++ b/src/core/public/application/application_service.test.ts
@@ -525,17 +525,7 @@ describe('#start()', () => {
       const { getComponent } = await service.start(startDeps);
 
       expect(() => shallow(createElement(getComponent))).not.toThrow();
-      expect(getComponent()).toMatchInlineSnapshot(`
-        <AppRouter
-          history={
-            Object {
-              "push": [MockFunction],
-            }
-          }
-          mounters={Map {}}
-          setAppLeaveHandler={[Function]}
-        />
-      `);
+      expect(getComponent()).toMatchSnapshot();
     });
 
     it('renders null when in legacy mode', async () => {
diff --git a/src/core/public/application/application_service.tsx b/src/core/public/application/application_service.tsx
index c69b96274aa95e..4d714c8f9dad2d 100644
--- a/src/core/public/application/application_service.tsx
+++ b/src/core/public/application/application_service.tsx
@@ -19,7 +19,7 @@
 
 import React from 'react';
 import { BehaviorSubject, Observable, Subject, Subscription } from 'rxjs';
-import { map, takeUntil } from 'rxjs/operators';
+import { map, shareReplay, takeUntil } from 'rxjs/operators';
 import { createBrowserHistory, History } from 'history';
 
 import { InjectedMetadataSetup } from '../injected_metadata';
@@ -256,6 +256,11 @@ export class ApplicationService {
       )
       .subscribe(apps => applications$.next(apps));
 
+    const applicationStatuses$ = applications$.pipe(
+      map(apps => new Map([...apps.entries()].map(([id, app]) => [id, app.status!]))),
+      shareReplay(1)
+    );
+
     return {
       applications$,
       capabilities,
@@ -264,11 +269,6 @@ export class ApplicationService {
       getUrlForApp: (appId, { path }: { path?: string } = {}) =>
         getAppUrl(availableMounters, appId, path),
       navigateToApp: async (appId, { path, state }: { path?: string; state?: any } = {}) => {
-        const app = applications$.value.get(appId);
-        if (app && app.status !== AppStatus.accessible) {
-          // should probably redirect to the error page instead
-          throw new Error(`Trying to navigate to an inaccessible application: ${appId}`);
-        }
         if (await this.shouldNavigate(overlays)) {
           this.appLeaveHandlers.delete(this.currentAppId$.value!);
           this.navigate!(getAppUrl(availableMounters, appId, path), state);
@@ -283,6 +283,7 @@ export class ApplicationService {
           <AppRouter
             history={this.history}
             mounters={availableMounters}
+            appStatuses$={applicationStatuses$}
             setAppLeaveHandler={this.setAppLeaveHandler}
           />
         );
diff --git a/src/core/public/application/integration_tests/router.test.tsx b/src/core/public/application/integration_tests/router.test.tsx
index cc71cf8722df4d..4d83ab67810afa 100644
--- a/src/core/public/application/integration_tests/router.test.tsx
+++ b/src/core/public/application/integration_tests/router.test.tsx
@@ -18,15 +18,18 @@
  */
 
 import React from 'react';
+import { BehaviorSubject } from 'rxjs';
 import { createMemoryHistory, History, createHashHistory } from 'history';
 
 import { AppRouter, AppNotFound } from '../ui';
 import { EitherApp, MockedMounterMap, MockedMounterTuple } from '../test_types';
 import { createRenderer, createAppMounter, createLegacyAppMounter } from './utils';
+import { AppStatus } from '../types';
 
 describe('AppContainer', () => {
   let mounters: MockedMounterMap<EitherApp>;
   let history: History;
+  let appStatuses$: BehaviorSubject<Map<string, AppStatus>>;
   let update: ReturnType<typeof createRenderer>;
 
   const navigate = (path: string) => {
@@ -38,6 +41,17 @@ describe('AppContainer', () => {
     new Map([...mounters].map(([appId, { mounter }]) => [appId, mounter]));
   const setAppLeaveHandlerMock = () => undefined;
 
+  const mountersToAppStatus$ = () => {
+    return new BehaviorSubject(
+      new Map(
+        [...mounters.keys()].map(id => [
+          id,
+          id.startsWith('disabled') ? AppStatus.inaccessible : AppStatus.accessible,
+        ])
+      )
+    );
+  };
+
   beforeEach(() => {
     mounters = new Map([
       createAppMounter('app1', '<span>App 1</span>'),
@@ -45,12 +59,16 @@ describe('AppContainer', () => {
       createAppMounter('app2', '<div>App 2</div>'),
       createLegacyAppMounter('baseApp:legacyApp2', jest.fn()),
       createAppMounter('app3', '<div>App 3</div>', '/custom/path'),
+      createAppMounter('disabledApp', '<div>Disabled app</div>'),
+      createLegacyAppMounter('disabledLegacyApp', jest.fn()),
     ] as Array<MockedMounterTuple<EitherApp>>);
     history = createMemoryHistory();
+    appStatuses$ = mountersToAppStatus$();
     update = createRenderer(
       <AppRouter
         history={history}
         mounters={mockMountersToMounters()}
+        appStatuses$={appStatuses$}
         setAppLeaveHandler={setAppLeaveHandlerMock}
       />
     );
@@ -89,6 +107,7 @@ describe('AppContainer', () => {
       <AppRouter
         history={history}
         mounters={mockMountersToMounters()}
+        appStatuses$={mountersToAppStatus$()}
         setAppLeaveHandler={setAppLeaveHandlerMock}
       />
     );
@@ -107,6 +126,7 @@ describe('AppContainer', () => {
       <AppRouter
         history={history}
         mounters={mockMountersToMounters()}
+        appStatuses$={mountersToAppStatus$()}
         setAppLeaveHandler={setAppLeaveHandlerMock}
       />
     );
@@ -147,6 +167,7 @@ describe('AppContainer', () => {
       <AppRouter
         history={history}
         mounters={mockMountersToMounters()}
+        appStatuses$={mountersToAppStatus$()}
         setAppLeaveHandler={setAppLeaveHandlerMock}
       />
     );
@@ -202,4 +223,16 @@ describe('AppContainer', () => {
 
     expect(dom?.exists(AppNotFound)).toBe(true);
   });
+
+  it('displays error page if app is inaccessible', async () => {
+    const dom = await navigate('/app/disabledApp');
+
+    expect(dom?.exists(AppNotFound)).toBe(true);
+  });
+
+  it('displays error page if legacy app is inaccessible', async () => {
+    const dom = await navigate('/app/disabledLegacyApp');
+
+    expect(dom?.exists(AppNotFound)).toBe(true);
+  });
 });
diff --git a/src/core/public/application/ui/app_container.tsx b/src/core/public/application/ui/app_container.tsx
index 8afd4d0ca05514..6a630608b2c205 100644
--- a/src/core/public/application/ui/app_container.tsx
+++ b/src/core/public/application/ui/app_container.tsx
@@ -26,12 +26,13 @@ import React, {
   MutableRefObject,
 } from 'react';
 
-import { AppUnmount, Mounter, AppLeaveHandler } from '../types';
+import { AppLeaveHandler, AppStatus, AppUnmount, Mounter } from '../types';
 import { AppNotFound } from './app_not_found_screen';
 
 interface Props {
   appId: string;
   mounter?: Mounter;
+  appStatus: AppStatus;
   setAppLeaveHandler: (appId: string, handler: AppLeaveHandler) => void;
 }
 
@@ -39,10 +40,12 @@ export const AppContainer: FunctionComponent<Props> = ({
   mounter,
   appId,
   setAppLeaveHandler,
+  appStatus,
 }: Props) => {
   const [appNotFound, setAppNotFound] = useState(false);
   const elementRef = useRef<HTMLDivElement>(null);
   const unmountRef: MutableRefObject<AppUnmount | null> = useRef<AppUnmount>(null);
+  // const appStatus = useObservable(appStatus$);
 
   useLayoutEffect(() => {
     const unmount = () => {
@@ -52,7 +55,7 @@ export const AppContainer: FunctionComponent<Props> = ({
       }
     };
     const mount = async () => {
-      if (!mounter) {
+      if (!mounter || appStatus !== AppStatus.accessible) {
         return setAppNotFound(true);
       }
 
@@ -71,7 +74,7 @@ export const AppContainer: FunctionComponent<Props> = ({
 
     mount();
     return unmount;
-  }, [appId, mounter, setAppLeaveHandler]);
+  }, [appId, appStatus, mounter, setAppLeaveHandler]);
 
   return (
     <Fragment>
diff --git a/src/core/public/application/ui/app_not_found_screen.tsx b/src/core/public/application/ui/app_not_found_screen.tsx
index 73a999c5dbf162..0d651ee0480960 100644
--- a/src/core/public/application/ui/app_not_found_screen.tsx
+++ b/src/core/public/application/ui/app_not_found_screen.tsx
@@ -22,7 +22,7 @@ import React from 'react';
 import { FormattedMessage } from '@kbn/i18n/react';
 
 export const AppNotFound = () => (
-  <EuiPage style={{ minHeight: '100%' }}>
+  <EuiPage style={{ minHeight: '100%' }} data-test-subj="appNotFoundPageContent">
     <EuiPageBody>
       <EuiPageContent verticalPosition="center" horizontalPosition="center">
         <EuiEmptyPrompt
diff --git a/src/core/public/application/ui/app_router.tsx b/src/core/public/application/ui/app_router.tsx
index 2ee90c3bf5e29e..50e5f5ee1bd62d 100644
--- a/src/core/public/application/ui/app_router.tsx
+++ b/src/core/public/application/ui/app_router.tsx
@@ -18,15 +18,18 @@
  */
 
 import React, { FunctionComponent } from 'react';
+import { Route, RouteComponentProps, Router, Switch } from 'react-router-dom';
 import { History } from 'history';
-import { Router, Route, RouteComponentProps, Switch } from 'react-router-dom';
+import { Observable } from 'rxjs';
+import { useObservable } from 'react-use';
 
-import { Mounter, AppLeaveHandler } from '../types';
+import { AppLeaveHandler, AppStatus, Mounter } from '../types';
 import { AppContainer } from './app_container';
 
 interface Props {
   mounters: Map<string, Mounter>;
   history: History;
+  appStatuses$: Observable<Map<string, AppStatus>>;
   setAppLeaveHandler: (appId: string, handler: AppLeaveHandler) => void;
 }
 
@@ -34,45 +37,59 @@ interface Params {
   appId: string;
 }
 
-export const AppRouter: FunctionComponent<Props> = ({ history, mounters, setAppLeaveHandler }) => (
-  <Router history={history}>
-    <Switch>
-      {[...mounters].flatMap(([appId, mounter]) =>
-        // Remove /app paths from the routes as they will be handled by the
-        // "named" route parameter `:appId` below
-        mounter.appBasePath.startsWith('/app')
-          ? []
-          : [
-              <Route
-                key={mounter.appRoute}
-                path={mounter.appRoute}
-                render={() => (
-                  <AppContainer
-                    mounter={mounter}
-                    appId={appId}
-                    setAppLeaveHandler={setAppLeaveHandler}
-                  />
-                )}
-              />,
-            ]
-      )}
-      <Route
-        path="/app/:appId"
-        render={({
-          match: {
-            params: { appId },
-          },
-        }: RouteComponentProps<Params>) => {
-          // Find the mounter including legacy mounters with subapps:
-          const [id, mounter] = mounters.has(appId)
-            ? [appId, mounters.get(appId)]
-            : [...mounters].filter(([key]) => key.split(':')[0] === appId)[0] ?? [];
+export const AppRouter: FunctionComponent<Props> = ({
+  history,
+  mounters,
+  setAppLeaveHandler,
+  appStatuses$,
+}) => {
+  const appStatuses = useObservable(appStatuses$, new Map());
+  return (
+    <Router history={history}>
+      <Switch>
+        {[...mounters].flatMap(([appId, mounter]) =>
+          // Remove /app paths from the routes as they will be handled by the
+          // "named" route parameter `:appId` below
+          mounter.appBasePath.startsWith('/app')
+            ? []
+            : [
+                <Route
+                  key={mounter.appRoute}
+                  path={mounter.appRoute}
+                  render={() => (
+                    <AppContainer
+                      mounter={mounter}
+                      appId={appId}
+                      appStatus={appStatuses.get(appId) ?? AppStatus.inaccessible}
+                      setAppLeaveHandler={setAppLeaveHandler}
+                    />
+                  )}
+                />,
+              ]
+        )}
+        <Route
+          path="/app/:appId"
+          render={({
+            match: {
+              params: { appId },
+            },
+          }: RouteComponentProps<Params>) => {
+            // Find the mounter including legacy mounters with subapps:
+            const [id, mounter] = mounters.has(appId)
+              ? [appId, mounters.get(appId)]
+              : [...mounters].filter(([key]) => key.split(':')[0] === appId)[0] ?? [];
 
-          return (
-            <AppContainer mounter={mounter} appId={id} setAppLeaveHandler={setAppLeaveHandler} />
-          );
-        }}
-      />
-    </Switch>
-  </Router>
-);
+            return (
+              <AppContainer
+                mounter={mounter}
+                appId={id}
+                appStatus={appStatuses.get(id) ?? AppStatus.inaccessible}
+                setAppLeaveHandler={setAppLeaveHandler}
+              />
+            );
+          }}
+        />
+      </Switch>
+    </Router>
+  );
+};
diff --git a/test/plugin_functional/plugins/core_app_status/public/application.tsx b/test/plugin_functional/plugins/core_app_status/public/application.tsx
index 323774392a6d73..b9ebd8d3692f1f 100644
--- a/test/plugin_functional/plugins/core_app_status/public/application.tsx
+++ b/test/plugin_functional/plugins/core_app_status/public/application.tsx
@@ -31,15 +31,15 @@ import {
   EuiTitle,
 } from '@elastic/eui';
 
-import { AppMountContext, AppMountParameters } from 'kibana/public';
+import { AppMountParameters } from 'kibana/public';
 
-const AppStatusApp = () => (
+const AppStatusApp = ({ appId }: { appId: string }) => (
   <EuiPage>
     <EuiPageBody data-test-subj="appStatusApp">
       <EuiPageHeader>
         <EuiPageHeaderSection>
           <EuiTitle size="l">
-            <h1>Welcome to App Status Test App!</h1>
+            <h1>Welcome to {appId} Test App!</h1>
           </EuiTitle>
         </EuiPageHeaderSection>
       </EuiPageHeader>
@@ -47,18 +47,18 @@ const AppStatusApp = () => (
         <EuiPageContentHeader>
           <EuiPageContentHeaderSection>
             <EuiTitle>
-              <h2>App Status Test App home page section title</h2>
+              <h2>{appId} Test App home page section title</h2>
             </EuiTitle>
           </EuiPageContentHeaderSection>
         </EuiPageContentHeader>
-        <EuiPageContentBody>App Status Test App content</EuiPageContentBody>
+        <EuiPageContentBody>{appId} Test App content</EuiPageContentBody>
       </EuiPageContent>
     </EuiPageBody>
   </EuiPage>
 );
 
-export const renderApp = (context: AppMountContext, { element }: AppMountParameters) => {
-  render(<AppStatusApp />, element);
+export const renderApp = (appId: string, { element }: AppMountParameters) => {
+  render(<AppStatusApp appId={appId} />, element);
 
   return () => unmountComponentAtNode(element);
 };
diff --git a/test/plugin_functional/plugins/core_app_status/public/index.ts b/test/plugin_functional/plugins/core_app_status/public/index.ts
index e0ad7c25a54b81..f52b7ff5fea440 100644
--- a/test/plugin_functional/plugins/core_app_status/public/index.ts
+++ b/test/plugin_functional/plugins/core_app_status/public/index.ts
@@ -18,7 +18,7 @@
  */
 
 import { PluginInitializer } from 'kibana/public';
-import { CoreAppStatusPlugin, CoreAppStatusPluginSetup, CoreAppStatusPluginStart } from './plugin';
+import { CoreAppStatusPlugin, CoreAppStatusPluginStart } from './plugin';
 
-export const plugin: PluginInitializer<CoreAppStatusPluginSetup, CoreAppStatusPluginStart> = () =>
+export const plugin: PluginInitializer<{}, CoreAppStatusPluginStart> = () =>
   new CoreAppStatusPlugin();
diff --git a/test/plugin_functional/plugins/core_app_status/public/plugin.tsx b/test/plugin_functional/plugins/core_app_status/public/plugin.tsx
index 85caaaf5f9090f..af23bfbe1f8f5f 100644
--- a/test/plugin_functional/plugins/core_app_status/public/plugin.tsx
+++ b/test/plugin_functional/plugins/core_app_status/public/plugin.tsx
@@ -17,22 +17,38 @@
  * under the License.
  */
 
-import { Plugin, CoreSetup, AppUpdater, AppUpdatableFields, CoreStart } from 'kibana/public';
 import { BehaviorSubject } from 'rxjs';
+import {
+  Plugin,
+  CoreSetup,
+  AppUpdater,
+  AppUpdatableFields,
+  CoreStart,
+  AppMountParameters,
+} from 'kibana/public';
+import './types';
 
-export class CoreAppStatusPlugin
-  implements Plugin<CoreAppStatusPluginSetup, CoreAppStatusPluginStart> {
+export class CoreAppStatusPlugin implements Plugin<{}, CoreAppStatusPluginStart> {
   private appUpdater = new BehaviorSubject<AppUpdater>(() => ({}));
 
   public setup(core: CoreSetup, deps: {}) {
+    core.application.register({
+      id: 'app_status_start',
+      title: 'App Status Start Page',
+      async mount(params: AppMountParameters) {
+        const { renderApp } = await import('./application');
+        return renderApp('app_status_start', params);
+      },
+    });
+
     core.application.register({
       id: 'app_status',
       title: 'App Status',
       euiIconType: 'snowflake',
       updater$: this.appUpdater,
-      async mount(context, params) {
+      async mount(params: AppMountParameters) {
         const { renderApp } = await import('./application');
-        return renderApp(context, params);
+        return renderApp('app_status', params);
       },
     });
 
@@ -40,7 +56,7 @@ export class CoreAppStatusPlugin
   }
 
   public start(core: CoreStart) {
-    return {
+    const startContract = {
       setAppStatus: (status: Partial<AppUpdatableFields>) => {
         this.appUpdater.next(() => status);
       },
@@ -48,9 +64,10 @@ export class CoreAppStatusPlugin
         return core.application.navigateToApp(appId);
       },
     };
+    window.__coreAppStatus = startContract;
+    return startContract;
   }
   public stop() {}
 }
 
-export type CoreAppStatusPluginSetup = ReturnType<CoreAppStatusPlugin['setup']>;
 export type CoreAppStatusPluginStart = ReturnType<CoreAppStatusPlugin['start']>;
diff --git a/test/plugin_functional/plugins/core_app_status/public/types.ts b/test/plugin_functional/plugins/core_app_status/public/types.ts
new file mode 100644
index 00000000000000..7c708e6c26d91f
--- /dev/null
+++ b/test/plugin_functional/plugins/core_app_status/public/types.ts
@@ -0,0 +1,26 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { CoreAppStatusPluginStart } from './plugin';
+
+declare global {
+  interface Window {
+    __coreAppStatus: CoreAppStatusPluginStart;
+  }
+}
diff --git a/test/plugin_functional/test_suites/core_plugins/application_status.ts b/test/plugin_functional/test_suites/core_plugins/application_status.ts
index 703ae30533bae0..b6d13a5604011f 100644
--- a/test/plugin_functional/test_suites/core_plugins/application_status.ts
+++ b/test/plugin_functional/test_suites/core_plugins/application_status.ts
@@ -24,50 +24,32 @@ import {
   AppUpdatableFields,
 } from '../../../../src/core/public/application/types';
 import { PluginFunctionalProviderContext } from '../../services';
-import { CoreAppStatusPluginStart } from '../../plugins/core_app_status/public/plugin';
-import '../../plugins/core_provider_plugin/types';
+import '../../plugins/core_app_status/public/types';
 
 // eslint-disable-next-line import/no-default-export
 export default function({ getService, getPageObjects }: PluginFunctionalProviderContext) {
   const PageObjects = getPageObjects(['common']);
   const browser = getService('browser');
   const appsMenu = getService('appsMenu');
+  const testSubjects = getService('testSubjects');
 
   const setAppStatus = async (s: Partial<AppUpdatableFields>) => {
-    await browser.executeAsync(async (status: Partial<AppUpdatableFields>, cb: Function) => {
-      const plugin = window.__coreProvider.start.plugins
-        .core_app_status as CoreAppStatusPluginStart;
-      plugin.setAppStatus(status);
+    return browser.executeAsync(async (status: Partial<AppUpdatableFields>, cb: Function) => {
+      window.__coreAppStatus.setAppStatus(status);
       cb();
     }, s);
   };
 
-  const navigateToApp = async (i: string): Promise<{ error?: string }> => {
+  const navigateToApp = async (i: string) => {
     return (await browser.executeAsync(async (appId, cb: Function) => {
-      // navigating in legacy mode performs a page refresh
-      // and webdriver seems to re-execute the script after the reload
-      // as it considers it didn't end on the previous session.
-      // however when testing navigation to NP app, __coreProvider is not accessible
-      // so we need to check for existence.
-      if (!window.__coreProvider) {
-        cb({});
-      }
-      const plugin = window.__coreProvider.start.plugins
-        .core_app_status as CoreAppStatusPluginStart;
-      try {
-        await plugin.navigateToApp(appId);
-        cb({});
-      } catch (e) {
-        cb({
-          error: e.message,
-        });
-      }
+      await window.__coreAppStatus.navigateToApp(appId);
+      cb();
     }, i)) as any;
   };
 
   describe('application status management', () => {
     beforeEach(async () => {
-      await PageObjects.common.navigateToApp('settings');
+      await PageObjects.common.navigateToApp('app_status_start');
     });
 
     it('can change the navLink status at runtime', async () => {
@@ -98,10 +80,10 @@ export default function({ getService, getPageObjects }: PluginFunctionalProvider
         status: AppStatus.inaccessible,
       });
 
-      const result = await navigateToApp('app_status');
-      expect(result.error).to.contain(
-        'Trying to navigate to an inaccessible application: app_status'
-      );
+      await navigateToApp('app_status');
+
+      expect(await testSubjects.exists('appNotFoundPageContent')).to.eql(true);
+      expect(await testSubjects.exists('appStatusApp')).to.eql(false);
     });
 
     it('allows to navigate to an accessible app', async () => {
@@ -109,8 +91,35 @@ export default function({ getService, getPageObjects }: PluginFunctionalProvider
         status: AppStatus.accessible,
       });
 
-      const result = await navigateToApp('app_status');
-      expect(result.error).to.eql(undefined);
+      await navigateToApp('app_status');
+
+      expect(await testSubjects.exists('appNotFoundPageContent')).to.eql(false);
+      expect(await testSubjects.exists('appStatusApp')).to.eql(true);
+    });
+
+    it('can change the state of the currently mounted app', async () => {
+      await setAppStatus({
+        status: AppStatus.accessible,
+      });
+
+      await navigateToApp('app_status');
+
+      expect(await testSubjects.exists('appNotFoundPageContent')).to.eql(false);
+      expect(await testSubjects.exists('appStatusApp')).to.eql(true);
+
+      await setAppStatus({
+        status: AppStatus.inaccessible,
+      });
+
+      expect(await testSubjects.exists('appNotFoundPageContent')).to.eql(true);
+      expect(await testSubjects.exists('appStatusApp')).to.eql(false);
+
+      await setAppStatus({
+        status: AppStatus.accessible,
+      });
+
+      expect(await testSubjects.exists('appNotFoundPageContent')).to.eql(false);
+      expect(await testSubjects.exists('appStatusApp')).to.eql(true);
     });
   });
 }

From bd7f7ab48a1538fd6651e527b3cbe3216ec41995 Mon Sep 17 00:00:00 2001
From: Walter Rafelsberger <walter@elastic.co>
Date: Mon, 20 Jan 2020 15:37:41 +0100
Subject: [PATCH 08/12] [ML] Single Metric Viewer: Fix job check. (#55191)

Fixes switching via navigation to Single Metric Viewer from Anomaly Explorer for a job which isn't supported in the Single Metric Viewer.
---
 .../routing/routes/timeseriesexplorer.tsx     |  33 ++-
 .../{index.js => index.ts}                    |   0
 ...s => timeseriesexplorer_no_jobs_found.tsx} |   0
 .../timeseriesexplorer.d.ts                   |   7 +-
 .../timeseriesexplorer/timeseriesexplorer.js  | 243 +++---------------
 .../timeseriesexplorer_page.tsx               |  54 ++++
 .../timeseriesexplorer_utils/index.ts         |   1 +
 .../validate_job_selection.ts                 |  87 +++++++
 8 files changed, 206 insertions(+), 219 deletions(-)
 rename x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/components/timeseriesexplorer_no_jobs_found/{index.js => index.ts} (100%)
 rename x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/components/timeseriesexplorer_no_jobs_found/{timeseriesexplorer_no_jobs_found.js => timeseriesexplorer_no_jobs_found.tsx} (100%)
 create mode 100644 x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_page.tsx
 create mode 100644 x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/validate_job_selection.ts

diff --git a/x-pack/legacy/plugins/ml/public/application/routing/routes/timeseriesexplorer.tsx b/x-pack/legacy/plugins/ml/public/application/routing/routes/timeseriesexplorer.tsx
index c3c644d43fa593..f824faf7845c64 100644
--- a/x-pack/legacy/plugins/ml/public/application/routing/routes/timeseriesexplorer.tsx
+++ b/x-pack/legacy/plugins/ml/public/application/routing/routes/timeseriesexplorer.tsx
@@ -26,7 +26,10 @@ import { APP_STATE_ACTION } from '../../timeseriesexplorer/timeseriesexplorer_co
 import {
   createTimeSeriesJobData,
   getAutoZoomDuration,
+  validateJobSelection,
 } from '../../timeseriesexplorer/timeseriesexplorer_utils';
+import { TimeSeriesExplorerPage } from '../../timeseriesexplorer/timeseriesexplorer_page';
+import { TimeseriesexplorerNoJobsFound } from '../../timeseriesexplorer/components/timeseriesexplorer_no_jobs_found';
 import { useUrlState } from '../../util/url_state';
 import { useTableInterval } from '../../components/controls/select_interval';
 import { useTableSeverity } from '../../components/controls/select_severity';
@@ -81,6 +84,7 @@ export const TimeSeriesExplorerUrlStateManager: FC<TimeSeriesExplorerUrlStateMan
   const [appState, setAppState] = useUrlState('_a');
   const [globalState, setGlobalState] = useUrlState('_g');
   const [lastRefresh, setLastRefresh] = useState(0);
+  const [selectedJobId, setSelectedJobId] = useState<string>();
 
   const refresh = useRefresh();
   useEffect(() => {
@@ -141,6 +145,10 @@ export const TimeSeriesExplorerUrlStateManager: FC<TimeSeriesExplorerUrlStateMan
       setLastRefresh(Date.now());
       appStateHandler(APP_STATE_ACTION.CLEAR);
     }
+    const validatedJobId = validateJobSelection(jobsWithTimeRange, selectedJobIds, setGlobalState);
+    if (typeof validatedJobId === 'string') {
+      setSelectedJobId(validatedJobId);
+    }
   }, [JSON.stringify(selectedJobIds)]);
 
   // Next we get globalState and appState information to pass it on as props later.
@@ -156,14 +164,12 @@ export const TimeSeriesExplorerUrlStateManager: FC<TimeSeriesExplorerUrlStateMan
     to: string;
   } = isJobChange ? undefined : appState?.mlTimeSeriesExplorer?.zoom;
 
-  const selectedJob = selectedJobIds && mlJobService.getJob(selectedJobIds[0]);
+  const selectedJob = selectedJobId !== undefined ? mlJobService.getJob(selectedJobId) : undefined;
+  const timeSeriesJobs = createTimeSeriesJobData(mlJobService.jobs);
 
   let autoZoomDuration: number | undefined;
-  if (selectedJobIds !== undefined && selectedJobIds.length === 1 && selectedJob !== undefined) {
-    autoZoomDuration = getAutoZoomDuration(
-      createTimeSeriesJobData(mlJobService.jobs),
-      mlJobService.getJob(selectedJobIds[0])
-    );
+  if (selectedJobId !== undefined && selectedJob !== undefined) {
+    autoZoomDuration = getAutoZoomDuration(timeSeriesJobs, selectedJob);
   }
 
   const appStateHandler = useCallback(
@@ -264,6 +270,18 @@ export const TimeSeriesExplorerUrlStateManager: FC<TimeSeriesExplorerUrlStateMan
   const tzConfig = config.get('dateFormat:tz');
   const dateFormatTz = tzConfig !== 'Browser' ? tzConfig : moment.tz.guess();
 
+  if (timeSeriesJobs.length === 0) {
+    return (
+      <TimeSeriesExplorerPage dateFormatTz={dateFormatTz}>
+        <TimeseriesexplorerNoJobsFound />
+      </TimeSeriesExplorerPage>
+    );
+  }
+
+  if (selectedJobId === undefined || autoZoomDuration === undefined || bounds === undefined) {
+    return null;
+  }
+
   return (
     <TimeSeriesExplorer
       {...{
@@ -271,9 +289,8 @@ export const TimeSeriesExplorerUrlStateManager: FC<TimeSeriesExplorerUrlStateMan
         autoZoomDuration,
         bounds,
         dateFormatTz,
-        jobsWithTimeRange,
         lastRefresh,
-        selectedJobIds,
+        selectedJobId,
         selectedDetectorIndex,
         selectedEntities,
         selectedForecastId,
diff --git a/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/components/timeseriesexplorer_no_jobs_found/index.js b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/components/timeseriesexplorer_no_jobs_found/index.ts
similarity index 100%
rename from x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/components/timeseriesexplorer_no_jobs_found/index.js
rename to x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/components/timeseriesexplorer_no_jobs_found/index.ts
diff --git a/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/components/timeseriesexplorer_no_jobs_found/timeseriesexplorer_no_jobs_found.js b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/components/timeseriesexplorer_no_jobs_found/timeseriesexplorer_no_jobs_found.tsx
similarity index 100%
rename from x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/components/timeseriesexplorer_no_jobs_found/timeseriesexplorer_no_jobs_found.js
rename to x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/components/timeseriesexplorer_no_jobs_found/timeseriesexplorer_no_jobs_found.tsx
diff --git a/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.d.ts b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.d.ts
index 651c6090042365..6c1bb01137c917 100644
--- a/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.d.ts
+++ b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.d.ts
@@ -12,12 +12,11 @@ import { getDateFormatTz, TimeRangeBounds } from '../explorer/explorer_utils';
 
 declare const TimeSeriesExplorer: FC<{
   appStateHandler: (action: string, payload: any) => void;
-  autoZoomDuration?: number;
-  bounds?: TimeRangeBounds;
+  autoZoomDuration: number;
+  bounds: TimeRangeBounds;
   dateFormatTz: string;
-  jobsWithTimeRange: any[];
   lastRefresh: number;
-  selectedJobIds: string[];
+  selectedJobId: string;
   selectedDetectorIndex: number;
   selectedEntities: any[];
   selectedForecastId: string;
diff --git a/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.js b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.js
index 1862ead0457431..f3d8692bfb3e97 100644
--- a/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.js
+++ b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.js
@@ -8,7 +8,7 @@
  * React component for rendering Single Metric Viewer.
  */
 
-import { debounce, difference, each, find, get, has, isEqual, without } from 'lodash';
+import { debounce, each, find, get, has, isEqual } from 'lodash';
 import moment from 'moment-timezone';
 import { Subject, Subscription, forkJoin } from 'rxjs';
 import { map, debounceTime, switchMap, tap, withLatestFrom } from 'rxjs/operators';
@@ -24,7 +24,6 @@ import {
   EuiFlexGroup,
   EuiFlexItem,
   EuiFormRow,
-  EuiProgress,
   EuiSelect,
   EuiSpacer,
   EuiText,
@@ -49,15 +48,12 @@ import { AnomaliesTable } from '../components/anomalies_table/anomalies_table';
 import { ChartTooltip } from '../components/chart_tooltip';
 import { EntityControl } from './components/entity_control';
 import { ForecastingModal } from './components/forecasting_modal/forecasting_modal';
-import { JobSelector } from '../components/job_selector';
-import { getTimeRangeFromSelection } from '../components/job_selector/job_select_service_utils';
 import { LoadingIndicator } from '../components/loading_indicator/loading_indicator';
-import { NavigationMenu } from '../components/navigation_menu';
 import { SelectInterval } from '../components/controls/select_interval/select_interval';
 import { SelectSeverity } from '../components/controls/select_severity/select_severity';
 import { TimeseriesChart } from './components/timeseries_chart/timeseries_chart';
-import { TimeseriesexplorerNoJobsFound } from './components/timeseriesexplorer_no_jobs_found';
 import { TimeseriesexplorerNoChartData } from './components/timeseriesexplorer_no_chart_data';
+import { TimeSeriesExplorerPage } from './timeseriesexplorer_page';
 
 import { ml } from '../services/ml_api_service';
 import { mlFieldFormatService } from '../services/field_format_service';
@@ -154,44 +150,16 @@ function getTimeseriesexplorerDefaultState() {
   };
 }
 
-const TimeSeriesExplorerPage = ({ children, jobSelectorProps, loading, resizeRef }) => (
-  <Fragment>
-    <NavigationMenu tabId="timeseriesexplorer" />
-    {/* Show animated progress bar while loading */}
-    {loading && <EuiProgress className="mlTimeSeriesExplorerProgress" color="primary" size="xs" />}
-    {/* Show a progress bar with progress 0% when not loading.
-        If we'd just show no progress bar when not loading it would result in a flickering height effect. */}
-    {!loading && (
-      <EuiProgress
-        className="mlTimeSeriesExplorerProgress"
-        value={0}
-        max={100}
-        color="primary"
-        size="xs"
-      />
-    )}
-    <JobSelector {...jobSelectorProps} />
-    <div
-      className="ml-time-series-explorer"
-      ref={resizeRef}
-      data-test-subj="mlPageSingleMetricViewer"
-    >
-      {children}
-    </div>
-  </Fragment>
-);
-
 const containerPadding = 24;
 
 export class TimeSeriesExplorer extends React.Component {
   static propTypes = {
     appStateHandler: PropTypes.func.isRequired,
-    autoZoomDuration: PropTypes.number,
-    bounds: PropTypes.object,
+    autoZoomDuration: PropTypes.number.isRequired,
+    bounds: PropTypes.object.isRequired,
     dateFormatTz: PropTypes.string.isRequired,
-    jobsWithTimeRange: PropTypes.array.isRequired,
     lastRefresh: PropTypes.number.isRequired,
-    selectedJobIds: PropTypes.arrayOf(PropTypes.string),
+    selectedJobId: PropTypes.string.isRequired,
     selectedDetectorIndex: PropTypes.number,
     selectedEntities: PropTypes.object,
     selectedForecastId: PropTypes.string,
@@ -285,9 +253,9 @@ export class TimeSeriesExplorer extends React.Component {
   contextChartSelectedInitCallDone = false;
 
   getFocusAggregationInterval(selection) {
-    const { selectedJobIds } = this.props;
+    const { selectedJobId } = this.props;
     const jobs = createTimeSeriesJobData(mlJobService.jobs);
-    const selectedJob = mlJobService.getJob(selectedJobIds[0]);
+    const selectedJob = mlJobService.getJob(selectedJobId);
 
     // Calculate the aggregation interval for the focus chart.
     const bounds = { min: moment(selection.from), max: moment(selection.to) };
@@ -299,9 +267,9 @@ export class TimeSeriesExplorer extends React.Component {
    * Gets focus data for the current component state/
    */
   getFocusData(selection) {
-    const { selectedJobIds, selectedForecastId, selectedDetectorIndex } = this.props;
+    const { selectedJobId, selectedForecastId, selectedDetectorIndex } = this.props;
     const { modelPlotEnabled } = this.state;
-    const selectedJob = mlJobService.getJob(selectedJobIds[0]);
+    const selectedJob = mlJobService.getJob(selectedJobId);
     const entityControls = this.getControlsForDetector();
 
     // Calculate the aggregation interval for the focus chart.
@@ -356,11 +324,11 @@ export class TimeSeriesExplorer extends React.Component {
     const {
       dateFormatTz,
       selectedDetectorIndex,
-      selectedJobIds,
+      selectedJobId,
       tableInterval,
       tableSeverity,
     } = this.props;
-    const selectedJob = mlJobService.getJob(selectedJobIds[0]);
+    const selectedJob = mlJobService.getJob(selectedJobId);
     const entityControls = this.getControlsForDetector();
 
     return ml.results
@@ -424,8 +392,8 @@ export class TimeSeriesExplorer extends React.Component {
   loadEntityValues = async (entities, searchTerm = {}) => {
     this.setState({ entitiesLoading: true });
 
-    const { bounds, selectedJobIds, selectedDetectorIndex } = this.props;
-    const selectedJob = mlJobService.getJob(selectedJobIds[0]);
+    const { bounds, selectedJobId, selectedDetectorIndex } = this.props;
+    const selectedJob = mlJobService.getJob(selectedJobId);
 
     // Populate the entity input datalists with the values from the top records by score
     // for the selected detector across the full time range. No need to pass through finish().
@@ -479,17 +447,13 @@ export class TimeSeriesExplorer extends React.Component {
       bounds,
       selectedDetectorIndex,
       selectedForecastId,
-      selectedJobIds,
+      selectedJobId,
       zoom,
     } = this.props;
 
-    if (selectedJobIds === undefined || bounds === undefined) {
-      return;
-    }
-
     const { loadCounter: currentLoadCounter } = this.state;
 
-    const currentSelectedJob = mlJobService.getJob(selectedJobIds[0]);
+    const currentSelectedJob = mlJobService.getJob(selectedJobId);
 
     if (currentSelectedJob === undefined) {
       return;
@@ -526,7 +490,7 @@ export class TimeSeriesExplorer extends React.Component {
         const { loadCounter, modelPlotEnabled } = this.state;
 
         const jobs = createTimeSeriesJobData(mlJobService.jobs);
-        const selectedJob = mlJobService.getJob(selectedJobIds[0]);
+        const selectedJob = mlJobService.getJob(selectedJobId);
         const detectorIndex = selectedDetectorIndex;
 
         let awaitingCount = 3;
@@ -717,8 +681,8 @@ export class TimeSeriesExplorer extends React.Component {
    * @param callback to invoke after a state update.
    */
   getControlsForDetector = () => {
-    const { selectedDetectorIndex, selectedEntities, selectedJobIds } = this.props;
-    const selectedJob = mlJobService.getJob(selectedJobIds[0]);
+    const { selectedDetectorIndex, selectedEntities, selectedJobId } = this.props;
+    const selectedJob = mlJobService.getJob(selectedJobId);
 
     const entities = [];
 
@@ -871,9 +835,9 @@ export class TimeSeriesExplorer extends React.Component {
             }
           }),
           switchMap(selection => {
-            const { selectedJobIds } = this.props;
+            const { selectedJobId } = this.props;
             const jobs = createTimeSeriesJobData(mlJobService.jobs);
-            const selectedJob = mlJobService.getJob(selectedJobIds[0]);
+            const selectedJob = mlJobService.getJob(selectedJobId);
 
             // Calculate the aggregation interval for the focus chart.
             const bounds = { min: moment(selection.from), max: moment(selection.to) };
@@ -927,133 +891,19 @@ export class TimeSeriesExplorer extends React.Component {
     this.componentDidUpdate();
   }
 
-  /**
-   * returns true/false if setGlobalState has been triggered
-   * or returns the job id which should be loaded.
-   */
-  checkJobSelection() {
-    const { jobsWithTimeRange, selectedJobIds, setGlobalState } = this.props;
-
-    const jobs = createTimeSeriesJobData(mlJobService.jobs);
-    const timeSeriesJobIds = jobs.map(j => j.id);
-
-    // Check if any of the jobs set in the URL are not time series jobs
-    // (e.g. if switching to this view straight from the Anomaly Explorer).
-    const invalidIds = difference(selectedJobIds, timeSeriesJobIds);
-    const validSelectedJobIds = without(selectedJobIds, ...invalidIds);
-    if (invalidIds.length > 0) {
-      let warningText = i18n.translate(
-        'xpack.ml.timeSeriesExplorer.canNotViewRequestedJobsWarningMessage',
-        {
-          defaultMessage: `You can't view requested {invalidIdsCount, plural, one {job} other {jobs}} {invalidIds} in this dashboard`,
-          values: {
-            invalidIdsCount: invalidIds.length,
-            invalidIds,
-          },
-        }
-      );
-      if (validSelectedJobIds.length === 0 && timeSeriesJobIds.length > 0) {
-        warningText += i18n.translate('xpack.ml.timeSeriesExplorer.autoSelectingFirstJobText', {
-          defaultMessage: ', auto selecting first job',
-        });
-      }
-      toastNotifications.addWarning(warningText);
-    }
-
-    if (validSelectedJobIds.length > 1) {
-      // if more than one job or a group has been loaded from the URL
-      if (validSelectedJobIds.length > 1) {
-        // if more than one job, select the first job from the selection.
-        toastNotifications.addWarning(
-          i18n.translate('xpack.ml.timeSeriesExplorer.youCanViewOneJobAtTimeWarningMessage', {
-            defaultMessage: 'You can only view one job at a time in this dashboard',
-          })
-        );
-        setGlobalState('ml', { jobIds: [validSelectedJobIds[0]] });
-        return true;
-      } else {
-        // if a group has been loaded
-        if (selectedJobIds.length > 0) {
-          // if the group contains valid jobs, select the first
-          toastNotifications.addWarning(
-            i18n.translate('xpack.ml.timeSeriesExplorer.youCanViewOneJobAtTimeWarningMessage', {
-              defaultMessage: 'You can only view one job at a time in this dashboard',
-            })
-          );
-          setGlobalState('ml', { jobIds: [validSelectedJobIds[0]] });
-          return true;
-        } else if (jobs.length > 0) {
-          // if there are no valid jobs in the group but there are valid jobs
-          // in the list of all jobs, select the first
-          const jobIds = [jobs[0].id];
-          const time = getTimeRangeFromSelection(jobsWithTimeRange, jobIds);
-          setGlobalState({
-            ...{ ml: { jobIds } },
-            ...(time !== undefined ? { time } : {}),
-          });
-          return true;
-        } else {
-          // if there are no valid jobs left.
-          return false;
-        }
-      }
-    } else if (invalidIds.length > 0 && validSelectedJobIds.length > 0) {
-      // if some ids have been filtered out because they were invalid.
-      // refresh the URL with the first valid id
-      setGlobalState('ml', { jobIds: [validSelectedJobIds[0]] });
-      return true;
-    } else if (validSelectedJobIds.length > 0) {
-      // normal behavior. a job ID has been loaded from the URL
-      // Clear the detectorIndex, entities and forecast info.
-      return validSelectedJobIds[0];
-    } else {
-      if (validSelectedJobIds.length === 0 && jobs.length > 0) {
-        // no jobs were loaded from the URL, so add the first job
-        // from the full jobs list.
-        const jobIds = [jobs[0].id];
-        const time = getTimeRangeFromSelection(jobsWithTimeRange, jobIds);
-        setGlobalState({
-          ...{ ml: { jobIds } },
-          ...(time !== undefined ? { time } : {}),
-        });
-        return true;
-      } else {
-        // Jobs exist, but no time series jobs.
-        return false;
-      }
-    }
-  }
-
   componentDidUpdate(previousProps) {
-    if (
-      previousProps === undefined ||
-      !isEqual(previousProps.selectedJobIds, this.props.selectedJobIds)
-    ) {
-      const update = this.checkJobSelection();
-      // - true means a setGlobalState got triggered and
-      //   we'll just wait for the next React render.
-      // - false means there are either no jobs or no time based jobs present.
-      // - if we get back a string it means we got back a job id we can load.
-      if (update === true) {
-        return;
-      } else if (update === false) {
-        this.setState({ loading: false });
-        return;
-      } else if (typeof update === 'string') {
-        this.contextChartSelectedInitCallDone = false;
-        this.setState({ fullRefresh: false, loading: true }, () => {
-          this.loadForJobId(update);
-        });
-      }
+    if (previousProps === undefined || previousProps.selectedJobId !== this.props.selectedJobId) {
+      this.contextChartSelectedInitCallDone = false;
+      this.setState({ fullRefresh: false, loading: true }, () => {
+        this.loadForJobId(this.props.selectedJobId);
+      });
     }
 
     if (
-      this.props.bounds !== undefined &&
-      this.props.selectedJobIds !== undefined &&
-      (previousProps === undefined ||
-        !isEqual(previousProps.selectedJobIds, this.props.selectedJobIds) ||
-        previousProps.selectedDetectorIndex !== this.props.selectedDetectorIndex ||
-        !isEqual(previousProps.selectedEntities, this.props.selectedEntities))
+      previousProps === undefined ||
+      previousProps.selectedJobId !== this.props.selectedJobId ||
+      previousProps.selectedDetectorIndex !== this.props.selectedDetectorIndex ||
+      !isEqual(previousProps.selectedEntities, this.props.selectedEntities)
     ) {
       const entityControls = this.getControlsForDetector();
       this.loadEntityValues(entityControls);
@@ -1076,7 +926,7 @@ export class TimeSeriesExplorer extends React.Component {
       !isEqual(previousProps.selectedDetectorIndex, this.props.selectedDetectorIndex) ||
       !isEqual(previousProps.selectedEntities, this.props.selectedEntities) ||
       !isEqual(previousProps.selectedForecastId, this.props.selectedForecastId) ||
-      !isEqual(previousProps.selectedJobIds, this.props.selectedJobIds) ||
+      previousProps.selectedJobId !== this.props.selectedJobId ||
       !isEqual(previousProps.zoom, this.props.zoom)
     ) {
       const fullRefresh =
@@ -1086,7 +936,7 @@ export class TimeSeriesExplorer extends React.Component {
         !isEqual(previousProps.selectedDetectorIndex, this.props.selectedDetectorIndex) ||
         !isEqual(previousProps.selectedEntities, this.props.selectedEntities) ||
         !isEqual(previousProps.selectedForecastId, this.props.selectedForecastId) ||
-        !isEqual(previousProps.selectedJobIds, this.props.selectedJobIds);
+        previousProps.selectedJobId !== this.props.selectedJobId;
       this.loadSingleMetricData(fullRefresh);
     }
 
@@ -1159,7 +1009,7 @@ export class TimeSeriesExplorer extends React.Component {
       dateFormatTz,
       lastRefresh,
       selectedDetectorIndex,
-      selectedJobIds,
+      selectedJobId,
     } = this.props;
 
     const {
@@ -1211,34 +1061,13 @@ export class TimeSeriesExplorer extends React.Component {
       autoZoomDuration,
     };
 
-    const jobSelectorProps = {
-      dateFormatTz,
-      singleSelection: true,
-      timeseriesOnly: true,
-    };
-
     const jobs = createTimeSeriesJobData(mlJobService.jobs);
 
-    if (jobs.length === 0) {
-      return (
-        <TimeSeriesExplorerPage jobSelectorProps={jobSelectorProps} resizeRef={this.resizeRef}>
-          <TimeseriesexplorerNoJobsFound />
-        </TimeSeriesExplorerPage>
-      );
-    }
-
-    if (
-      selectedJobIds === undefined ||
-      selectedJobIds.length > 1 ||
-      selectedDetectorIndex === undefined ||
-      mlJobService.getJob(selectedJobIds[0]) === undefined
-    ) {
-      return (
-        <TimeSeriesExplorerPage jobSelectorProps={jobSelectorProps} resizeRef={this.resizeRef} />
-      );
+    if (selectedDetectorIndex === undefined || mlJobService.getJob(selectedJobId) === undefined) {
+      return <TimeSeriesExplorerPage dateFormatTz={dateFormatTz} resizeRef={this.resizeRef} />;
     }
 
-    const selectedJob = mlJobService.getJob(selectedJobIds[0]);
+    const selectedJob = mlJobService.getJob(selectedJobId);
     const entityControls = this.getControlsForDetector();
 
     const fieldNamesWithEmptyValues = entityControls
@@ -1280,7 +1109,7 @@ export class TimeSeriesExplorer extends React.Component {
 
     return (
       <TimeSeriesExplorerPage
-        jobSelectorProps={jobSelectorProps}
+        dateFormatTz={dateFormatTz}
         loading={loading}
         resizeRef={this.resizeRef}
       >
diff --git a/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_page.tsx b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_page.tsx
new file mode 100644
index 00000000000000..9da1a79232fce5
--- /dev/null
+++ b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_page.tsx
@@ -0,0 +1,54 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { FC } from 'react';
+
+import { EuiProgress } from '@elastic/eui';
+
+import { JobSelector } from '../components/job_selector';
+import { NavigationMenu } from '../components/navigation_menu';
+
+interface TimeSeriesExplorerPageProps {
+  dateFormatTz: string;
+  loading?: boolean;
+  resizeRef?: any;
+}
+
+export const TimeSeriesExplorerPage: FC<TimeSeriesExplorerPageProps> = ({
+  children,
+  dateFormatTz,
+  loading,
+  resizeRef,
+}) => {
+  return (
+    <>
+      <NavigationMenu tabId="timeseriesexplorer" />
+      {/* Show animated progress bar while loading */}
+      {loading === true && (
+        <EuiProgress className="mlTimeSeriesExplorerProgress" color="primary" size="xs" />
+      )}
+      {/* Show a progress bar with progress 0% when not loading.
+        If we'd just show no progress bar when not loading it would result in a flickering height effect. */}
+      {loading === false && (
+        <EuiProgress
+          className="mlTimeSeriesExplorerProgress"
+          value={0}
+          max={100}
+          color="primary"
+          size="xs"
+        />
+      )}
+      <JobSelector dateFormatTz={dateFormatTz} singleSelection={true} timeseriesOnly={true} />
+      <div
+        className="ml-time-series-explorer"
+        ref={resizeRef}
+        data-test-subj="mlPageSingleMetricViewer"
+      >
+        {children}
+      </div>
+    </>
+  );
+};
diff --git a/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/index.ts b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/index.ts
index 578dbdf1277a05..dcfbe94c97cc6e 100644
--- a/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/index.ts
+++ b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/index.ts
@@ -6,3 +6,4 @@
 
 export { getFocusData } from './get_focus_data';
 export * from './timeseriesexplorer_utils';
+export { validateJobSelection } from './validate_job_selection';
diff --git a/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/validate_job_selection.ts b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/validate_job_selection.ts
new file mode 100644
index 00000000000000..f1cdaf3ba8c1bc
--- /dev/null
+++ b/x-pack/legacy/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer_utils/validate_job_selection.ts
@@ -0,0 +1,87 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { difference, without } from 'lodash';
+
+import { i18n } from '@kbn/i18n';
+
+import { toastNotifications } from 'ui/notify';
+
+import { MlJobWithTimeRange } from '../../../../common/types/jobs';
+
+import { getTimeRangeFromSelection } from '../../components/job_selector/job_select_service_utils';
+import { mlJobService } from '../../services/job_service';
+
+import { createTimeSeriesJobData } from './timeseriesexplorer_utils';
+
+/**
+ * returns true/false if setGlobalState has been triggered
+ * or returns the job id which should be loaded.
+ */
+export function validateJobSelection(
+  jobsWithTimeRange: MlJobWithTimeRange[],
+  selectedJobIds: string[],
+  setGlobalState: (...args: any) => void
+) {
+  const jobs = createTimeSeriesJobData(mlJobService.jobs);
+  const timeSeriesJobIds: string[] = jobs.map((j: any) => j.id);
+
+  // Check if any of the jobs set in the URL are not time series jobs
+  // (e.g. if switching to this view straight from the Anomaly Explorer).
+  const invalidIds: string[] = difference(selectedJobIds, timeSeriesJobIds);
+  const validSelectedJobIds = without(selectedJobIds, ...invalidIds);
+  if (invalidIds.length > 0) {
+    let warningText = i18n.translate(
+      'xpack.ml.timeSeriesExplorer.canNotViewRequestedJobsWarningMessage',
+      {
+        defaultMessage: `You can't view requested {invalidIdsCount, plural, one {job} other {jobs}} {invalidIds} in this dashboard`,
+        values: {
+          invalidIdsCount: invalidIds.length,
+          invalidIds: invalidIds.join(', '),
+        },
+      }
+    );
+    if (validSelectedJobIds.length === 0 && timeSeriesJobIds.length > 0) {
+      warningText += i18n.translate('xpack.ml.timeSeriesExplorer.autoSelectingFirstJobText', {
+        defaultMessage: ', auto selecting first job',
+      });
+    }
+    toastNotifications.addWarning(warningText);
+  }
+
+  if (validSelectedJobIds.length > 1) {
+    // if more than one job, select the first job from the selection.
+    toastNotifications.addWarning(
+      i18n.translate('xpack.ml.timeSeriesExplorer.youCanViewOneJobAtTimeWarningMessage', {
+        defaultMessage: 'You can only view one job at a time in this dashboard',
+      })
+    );
+    setGlobalState('ml', { jobIds: [validSelectedJobIds[0]] });
+    return true;
+  } else if (invalidIds.length > 0 && validSelectedJobIds.length > 0) {
+    // if some ids have been filtered out because they were invalid.
+    // refresh the URL with the first valid id
+    setGlobalState('ml', { jobIds: [validSelectedJobIds[0]] });
+    return true;
+  } else if (validSelectedJobIds.length === 1) {
+    // normal behavior. a job ID has been loaded from the URL
+    // Clear the detectorIndex, entities and forecast info.
+    return validSelectedJobIds[0];
+  } else if (validSelectedJobIds.length === 0 && jobs.length > 0) {
+    // no jobs were loaded from the URL, so add the first job
+    // from the full jobs list.
+    const jobIds = [jobs[0].id];
+    const time = getTimeRangeFromSelection(jobsWithTimeRange, jobIds);
+    setGlobalState({
+      ...{ ml: { jobIds } },
+      ...(time !== undefined ? { time } : {}),
+    });
+    return true;
+  } else {
+    // Jobs exist, but no time series jobs.
+    return false;
+  }
+}

From 3e567b5cf217f3ca5292f386587085f06898147e Mon Sep 17 00:00:00 2001
From: Walter Rafelsberger <walter@elastic.co>
Date: Mon, 20 Jan 2020 15:43:22 +0100
Subject: [PATCH 09/12] [ML] Correctly pass on severity value to anomaly
 explorer charts. (#55207)

- Fixes passing on the severity value correctly to anomaly explorer charts. The wrong value of undefined being passed down caused anomaly markers not showing up.
- This bug surfaced that the severity value was never applied to filter multi-bucket anomalies which is now also fixed by this PR.
- Adds a check if topInfluencers is an array.
---
 .../ml/public/application/explorer/explorer.d.ts     |  1 +
 .../ml/public/application/explorer/explorer.js       |  4 ++--
 .../explorer_charts/explorer_chart_single_metric.js  | 11 ++++++-----
 .../ml/public/application/explorer/explorer_utils.js | 12 +++++++-----
 .../public/application/routing/routes/explorer.tsx   |  1 +
 5 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/x-pack/legacy/plugins/ml/public/application/explorer/explorer.d.ts b/x-pack/legacy/plugins/ml/public/application/explorer/explorer.d.ts
index b8df021990f584..a85674986c7f7f 100644
--- a/x-pack/legacy/plugins/ml/public/application/explorer/explorer.d.ts
+++ b/x-pack/legacy/plugins/ml/public/application/explorer/explorer.d.ts
@@ -15,6 +15,7 @@ import { AppStateSelectedCells } from '../explorer/explorer_utils';
 
 declare interface ExplorerProps {
   explorerState: ExplorerState;
+  severity: number;
   showCharts: boolean;
   setSelectedCells: (swimlaneSelectedCells: AppStateSelectedCells) => void;
 }
diff --git a/x-pack/legacy/plugins/ml/public/application/explorer/explorer.js b/x-pack/legacy/plugins/ml/public/application/explorer/explorer.js
index 79071319965781..6a1c5339de1f56 100644
--- a/x-pack/legacy/plugins/ml/public/application/explorer/explorer.js
+++ b/x-pack/legacy/plugins/ml/public/application/explorer/explorer.js
@@ -96,6 +96,7 @@ export class Explorer extends React.Component {
   static propTypes = {
     explorerState: PropTypes.object.isRequired,
     setSelectedCells: PropTypes.func.isRequired,
+    severity: PropTypes.number.isRequired,
     showCharts: PropTypes.bool.isRequired,
   };
 
@@ -260,7 +261,7 @@ export class Explorer extends React.Component {
   };
 
   render() {
-    const { showCharts } = this.props;
+    const { showCharts, severity } = this.props;
 
     const {
       annotationsData,
@@ -276,7 +277,6 @@ export class Explorer extends React.Component {
       queryString,
       selectedCells,
       selectedJobs,
-      severity,
       swimlaneContainerWidth,
       tableData,
       tableQueryString,
diff --git a/x-pack/legacy/plugins/ml/public/application/explorer/explorer_charts/explorer_chart_single_metric.js b/x-pack/legacy/plugins/ml/public/application/explorer/explorer_charts/explorer_chart_single_metric.js
index 583375c87007e4..a255b6b0434e4e 100644
--- a/x-pack/legacy/plugins/ml/public/application/explorer/explorer_charts/explorer_chart_single_metric.js
+++ b/x-pack/legacy/plugins/ml/public/application/explorer/explorer_charts/explorer_chart_single_metric.js
@@ -53,7 +53,7 @@ export const ExplorerChartSingleMetric = injectI18n(
     static propTypes = {
       tooManyBuckets: PropTypes.bool,
       seriesConfig: PropTypes.object,
-      severity: PropTypes.number,
+      severity: PropTypes.number.isRequired,
     };
 
     componentDidMount() {
@@ -312,13 +312,16 @@ export const ExplorerChartSingleMetric = injectI18n(
           })
           .on('mouseout', () => mlChartTooltipService.hide());
 
+        const isAnomalyVisible = d =>
+          _.has(d, 'anomalyScore') && Number(d.anomalyScore) >= severity;
+
         // Update all dots to new positions.
         dots
           .attr('cx', d => lineChartXScale(d.date))
           .attr('cy', d => lineChartYScale(d.value))
           .attr('class', d => {
             let markerClass = 'metric-value';
-            if (_.has(d, 'anomalyScore') && Number(d.anomalyScore) >= severity) {
+            if (isAnomalyVisible(d)) {
               markerClass += ` anomaly-marker ${getSeverityWithLow(d.anomalyScore).id}`;
             }
             return markerClass;
@@ -328,9 +331,7 @@ export const ExplorerChartSingleMetric = injectI18n(
         const multiBucketMarkers = lineChartGroup
           .select('.chart-markers')
           .selectAll('.multi-bucket')
-          .data(
-            data.filter(d => d.anomalyScore !== null && showMultiBucketAnomalyMarker(d) === true)
-          );
+          .data(data.filter(d => isAnomalyVisible(d) && showMultiBucketAnomalyMarker(d) === true));
 
         // Remove multi-bucket markers that are no longer needed
         multiBucketMarkers.exit().remove();
diff --git a/x-pack/legacy/plugins/ml/public/application/explorer/explorer_utils.js b/x-pack/legacy/plugins/ml/public/application/explorer/explorer_utils.js
index 4fb4e7d4df94f2..14d356c0d1c81c 100644
--- a/x-pack/legacy/plugins/ml/public/application/explorer/explorer_utils.js
+++ b/x-pack/legacy/plugins/ml/public/application/explorer/explorer_utils.js
@@ -280,11 +280,13 @@ export function loadViewByTopFieldValuesForSelectedTime(
 
           const topFieldValues = [];
           const topInfluencers = resp.influencers[viewBySwimlaneFieldName];
-          topInfluencers.forEach(influencerData => {
-            if (influencerData.maxAnomalyScore > 0) {
-              topFieldValues.push(influencerData.influencerFieldValue);
-            }
-          });
+          if (Array.isArray(topInfluencers)) {
+            topInfluencers.forEach(influencerData => {
+              if (influencerData.maxAnomalyScore > 0) {
+                topFieldValues.push(influencerData.influencerFieldValue);
+              }
+            });
+          }
           resolve(topFieldValues);
         });
     } else {
diff --git a/x-pack/legacy/plugins/ml/public/application/routing/routes/explorer.tsx b/x-pack/legacy/plugins/ml/public/application/routing/routes/explorer.tsx
index 6aaad5294369b7..633efc2856dac1 100644
--- a/x-pack/legacy/plugins/ml/public/application/routing/routes/explorer.tsx
+++ b/x-pack/legacy/plugins/ml/public/application/routing/routes/explorer.tsx
@@ -184,6 +184,7 @@ const ExplorerUrlStateManager: FC<ExplorerUrlStateManagerProps> = ({ jobsWithTim
           explorerState,
           setSelectedCells,
           showCharts,
+          severity: tableSeverity.val,
         }}
       />
     </div>

From bf0bcfe7035f71d321f75abbd83b8ca0e4625d79 Mon Sep 17 00:00:00 2001
From: James Gowdy <jgowdy@elastic.co>
Date: Mon, 20 Jan 2020 16:12:25 +0000
Subject: [PATCH 10/12] [ML] Fixing missing job_type in job messages search
 (#55330)

---
 .../services/job_messages_service.js          | 193 ------------------
 .../job_audit_messages/job_audit_messages.js  |  31 ++-
 2 files changed, 26 insertions(+), 198 deletions(-)
 delete mode 100644 x-pack/legacy/plugins/ml/public/application/services/job_messages_service.js

diff --git a/x-pack/legacy/plugins/ml/public/application/services/job_messages_service.js b/x-pack/legacy/plugins/ml/public/application/services/job_messages_service.js
deleted file mode 100644
index 1b0151897d1a6a..00000000000000
--- a/x-pack/legacy/plugins/ml/public/application/services/job_messages_service.js
+++ /dev/null
@@ -1,193 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License;
- * you may not use this file except in compliance with the Elastic License.
- */
-
-// Service for carrying out Elasticsearch queries to obtain data for the
-// Ml Results dashboards.
-import { ML_NOTIFICATION_INDEX_PATTERN } from '../../../common/constants/index_patterns';
-import { ml } from '../services/ml_api_service';
-
-// filter to match job_type: 'anomaly_detector' or no job_type field at all
-// if no job_type field exist, we can assume the message is for an anomaly detector job
-const anomalyDetectorTypeFilter = {
-  bool: {
-    should: [
-      {
-        term: {
-          job_type: 'anomaly_detector',
-        },
-      },
-      {
-        bool: {
-          must_not: {
-            exists: {
-              field: 'job_type',
-            },
-          },
-        },
-      },
-    ],
-    minimum_should_match: 1,
-  },
-};
-
-// search for audit messages, jobId is optional.
-// without it, all jobs will be listed.
-// fromRange should be a string formatted in ES time units. e.g. 12h, 1d, 7d
-function getJobAuditMessages(fromRange, jobId) {
-  return new Promise((resolve, reject) => {
-    let jobFilter = {};
-    // if no jobId specified, load all of the messages
-    if (jobId !== undefined) {
-      jobFilter = {
-        bool: {
-          should: [
-            {
-              term: {
-                job_id: '', // catch system messages
-              },
-            },
-            {
-              term: {
-                job_id: jobId, // messages for specified jobId
-              },
-            },
-          ],
-        },
-      };
-    }
-
-    let timeFilter = {};
-    if (fromRange !== undefined && fromRange !== '') {
-      timeFilter = {
-        range: {
-          timestamp: {
-            gte: `now-${fromRange}`,
-            lte: 'now',
-          },
-        },
-      };
-    }
-
-    ml.esSearch({
-      index: ML_NOTIFICATION_INDEX_PATTERN,
-      ignore_unavailable: true,
-      rest_total_hits_as_int: true,
-      size: 1000,
-      body: {
-        sort: [{ timestamp: { order: 'asc' } }, { job_id: { order: 'asc' } }],
-        query: {
-          bool: {
-            filter: [
-              {
-                bool: {
-                  must_not: {
-                    term: {
-                      level: 'activity',
-                    },
-                  },
-                },
-              },
-              anomalyDetectorTypeFilter,
-              jobFilter,
-              timeFilter,
-            ],
-          },
-        },
-      },
-    })
-      .then(resp => {
-        let messages = [];
-        if (resp.hits.total !== 0) {
-          messages = resp.hits.hits.map(hit => hit._source);
-        }
-        resolve({ messages });
-      })
-      .catch(resp => {
-        reject(resp);
-      });
-  });
-}
-
-// search highest, most recent audit messages for all jobs for the last 24hrs.
-function getAuditMessagesSummary() {
-  return new Promise((resolve, reject) => {
-    ml.esSearch({
-      index: ML_NOTIFICATION_INDEX_PATTERN,
-      ignore_unavailable: true,
-      rest_total_hits_as_int: true,
-      size: 0,
-      body: {
-        query: {
-          bool: {
-            filter: [
-              {
-                range: {
-                  timestamp: {
-                    gte: 'now-1d',
-                  },
-                },
-              },
-              anomalyDetectorTypeFilter,
-            ],
-          },
-        },
-        aggs: {
-          levelsPerJob: {
-            terms: {
-              field: 'job_id',
-            },
-            aggs: {
-              levels: {
-                terms: {
-                  field: 'level',
-                },
-                aggs: {
-                  latestMessage: {
-                    terms: {
-                      field: 'message.raw',
-                      size: 1,
-                      order: {
-                        latestMessage: 'desc',
-                      },
-                    },
-                    aggs: {
-                      latestMessage: {
-                        max: {
-                          field: 'timestamp',
-                        },
-                      },
-                    },
-                  },
-                },
-              },
-            },
-          },
-        },
-      },
-    })
-      .then(resp => {
-        let messagesPerJob = [];
-        if (
-          resp.hits.total !== 0 &&
-          resp.aggregations &&
-          resp.aggregations.levelsPerJob &&
-          resp.aggregations.levelsPerJob.buckets &&
-          resp.aggregations.levelsPerJob.buckets.length
-        ) {
-          messagesPerJob = resp.aggregations.levelsPerJob.buckets;
-        }
-        resolve({ messagesPerJob });
-      })
-      .catch(resp => {
-        reject(resp);
-      });
-  });
-}
-
-export const jobMessagesService = {
-  getJobAuditMessages,
-  getAuditMessagesSummary,
-};
diff --git a/x-pack/legacy/plugins/ml/server/models/job_audit_messages/job_audit_messages.js b/x-pack/legacy/plugins/ml/server/models/job_audit_messages/job_audit_messages.js
index c9cc8a3da574ad..52495b3b732d0a 100644
--- a/x-pack/legacy/plugins/ml/server/models/job_audit_messages/job_audit_messages.js
+++ b/x-pack/legacy/plugins/ml/server/models/job_audit_messages/job_audit_messages.js
@@ -10,6 +10,30 @@ import moment from 'moment';
 const SIZE = 1000;
 const LEVEL = { system_info: -1, info: 0, warning: 1, error: 2 };
 
+// filter to match job_type: 'anomaly_detector' or no job_type field at all
+// if no job_type field exist, we can assume the message is for an anomaly detector job
+const anomalyDetectorTypeFilter = {
+  bool: {
+    should: [
+      {
+        term: {
+          job_type: 'anomaly_detector',
+        },
+      },
+      {
+        bool: {
+          must_not: {
+            exists: {
+              field: 'job_type',
+            },
+          },
+        },
+      },
+    ],
+    minimum_should_match: 1,
+  },
+};
+
 export function jobAuditMessagesProvider(callWithRequest) {
   // search for audit messages,
   // jobId is optional. without it, all jobs will be listed.
@@ -47,13 +71,9 @@ export function jobAuditMessagesProvider(callWithRequest) {
                   level: 'activity',
                 },
               },
-              must: {
-                term: {
-                  job_type: 'anomaly_detector',
-                },
-              },
             },
           },
+          anomalyDetectorTypeFilter,
           timeFilter,
         ],
       },
@@ -119,6 +139,7 @@ export function jobAuditMessagesProvider(callWithRequest) {
                 },
               },
             },
+            anomalyDetectorTypeFilter,
           ],
         },
       };

From 638792a5571d79ee26744b91a047eb4857e203b0 Mon Sep 17 00:00:00 2001
From: Gidi Meir Morris <github@gidi.io>
Date: Mon, 20 Jan 2020 17:24:17 +0000
Subject: [PATCH 11/12] removes CTA from Task Manager info message (#55334)

removes CTA from Task Manager info message
---
 x-pack/plugins/task_manager/server/task_manager.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/x-pack/plugins/task_manager/server/task_manager.ts b/x-pack/plugins/task_manager/server/task_manager.ts
index 93e98f33a30b04..da9640fa3e0718 100644
--- a/x-pack/plugins/task_manager/server/task_manager.ts
+++ b/x-pack/plugins/task_manager/server/task_manager.ts
@@ -401,7 +401,7 @@ export async function claimAvailableTasks(
   } else {
     performance.mark('claimAvailableTasks.noAvailableWorkers');
     logger.info(
-      `[Task Ownership]: Task Manager has skipped Claiming Ownership of available tasks at it has ran out Available Workers. If this happens often, consider adjusting the "xpack.task_manager.max_workers" configuration.`
+      `[Task Ownership]: Task Manager has skipped Claiming Ownership of available tasks at it has ran out Available Workers.`
     );
   }
   return [];

From cdb0021ac6bdcc162232a5453feebd1c3693c6d6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alejandro=20Fern=C3=A1ndez?=
 <alejandro.fernandez@elastic.co>
Date: Mon, 20 Jan 2020 18:28:55 +0100
Subject: [PATCH 12/12] [Logs UI] Fix z-index of logs page toolbar (#54469)

* Fix z-index of logs page toolbar

* Extract `FixedDatePicker` from log setup page, and use it in the stream page

* Clean unused import

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
---
 .../public/components/fixed_datepicker.tsx    | 25 +++++++++++++++++++
 .../analysis_setup_timerange_form.tsx         | 20 +--------------
 .../components/logging/log_time_controls.tsx  |  3 ++-
 3 files changed, 28 insertions(+), 20 deletions(-)
 create mode 100644 x-pack/legacy/plugins/infra/public/components/fixed_datepicker.tsx

diff --git a/x-pack/legacy/plugins/infra/public/components/fixed_datepicker.tsx b/x-pack/legacy/plugins/infra/public/components/fixed_datepicker.tsx
new file mode 100644
index 00000000000000..aab1bcd1da8730
--- /dev/null
+++ b/x-pack/legacy/plugins/infra/public/components/fixed_datepicker.tsx
@@ -0,0 +1,25 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React from 'react';
+
+import { EuiDatePicker, EuiDatePickerProps } from '@elastic/eui';
+import euiStyled from '../../../../common/eui_styled_components';
+
+export const FixedDatePicker = euiStyled(
+  ({
+    className,
+    inputClassName,
+    ...datePickerProps
+  }: {
+    className?: string;
+    inputClassName?: string;
+  } & EuiDatePickerProps) => (
+    <EuiDatePicker {...datePickerProps} className={inputClassName} popperClassName={className} />
+  )
+)`
+  z-index: 3 !important;
+`;
diff --git a/x-pack/legacy/plugins/infra/public/components/logging/log_analysis_setup/initial_configuration_step/analysis_setup_timerange_form.tsx b/x-pack/legacy/plugins/infra/public/components/logging/log_analysis_setup/initial_configuration_step/analysis_setup_timerange_form.tsx
index 4319f844b1dcc8..02119fd1c09dd2 100644
--- a/x-pack/legacy/plugins/infra/public/components/logging/log_analysis_setup/initial_configuration_step/analysis_setup_timerange_form.tsx
+++ b/x-pack/legacy/plugins/infra/public/components/logging/log_analysis_setup/initial_configuration_step/analysis_setup_timerange_form.tsx
@@ -5,8 +5,6 @@
  */
 
 import {
-  EuiDatePicker,
-  EuiDatePickerProps,
   EuiDescribedFormGroup,
   EuiFlexGroup,
   EuiFormControlLayout,
@@ -16,8 +14,7 @@ import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n/react';
 import moment, { Moment } from 'moment';
 import React, { useMemo } from 'react';
-
-import { euiStyled } from '../../../../../../../common/eui_styled_components';
+import { FixedDatePicker } from '../../../fixed_datepicker';
 
 const startTimeLabel = i18n.translate('xpack.infra.analysisSetup.startTimeLabel', {
   defaultMessage: 'Start time',
@@ -138,18 +135,3 @@ export const AnalysisSetupTimerangeForm: React.FunctionComponent<{
     </EuiDescribedFormGroup>
   );
 };
-
-const FixedDatePicker = euiStyled(
-  ({
-    className,
-    inputClassName,
-    ...datePickerProps
-  }: {
-    className?: string;
-    inputClassName?: string;
-  } & EuiDatePickerProps) => (
-    <EuiDatePicker {...datePickerProps} className={inputClassName} popperClassName={className} />
-  )
-)`
-  z-index: 3 !important;
-`;
diff --git a/x-pack/legacy/plugins/infra/public/components/logging/log_time_controls.tsx b/x-pack/legacy/plugins/infra/public/components/logging/log_time_controls.tsx
index 8f5705a9b9c563..5095edd4c715c5 100644
--- a/x-pack/legacy/plugins/infra/public/components/logging/log_time_controls.tsx
+++ b/x-pack/legacy/plugins/infra/public/components/logging/log_time_controls.tsx
@@ -9,6 +9,7 @@ import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n/react';
 import moment, { Moment } from 'moment';
 import React from 'react';
+import { FixedDatePicker } from '../fixed_datepicker';
 
 const noop = () => undefined;
 
@@ -56,7 +57,7 @@ export class LogTimeControls extends React.PureComponent<LogTimeControlsProps> {
       return (
         <EuiFlexGroup gutterSize="s">
           <EuiFlexItem>
-            <EuiDatePicker
+            <FixedDatePicker
               dateFormat="L LTS"
               onChange={this.handleChangeDate}
               popperPlacement="top-end"