From fd1aad0711cf7430a835f583f8a9204016826a25 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alejandro=20Fern=C3=A1ndez=20Haro?=
 <alejandro.haro@elastic.co>
Date: Wed, 16 Sep 2020 20:08:06 +0100
Subject: [PATCH 01/19] [Application Usage] Daily rollups to overcome the find
 >10k SO limitation (#77610)

Co-authored-by: Christiane (Tina) Heiligers <christiane.heiligers@elastic.co>
---
 .../collectors/application_usage/README.md    |  10 +-
 .../application_usage/index.test.ts           | 151 ---------
 .../application_usage/rollups.test.ts         | 299 ++++++++++++++++++
 .../collectors/application_usage/rollups.ts   | 202 ++++++++++++
 .../application_usage/saved_objects_types.ts  |  32 +-
 ...emetry_application_usage_collector.test.ts | 213 +++++++++++++
 .../telemetry_application_usage_collector.ts  | 203 +++++-------
 .../server/collectors/find_all.test.ts        |  55 ----
 .../server/collectors/find_all.ts             |  41 ---
 .../telemetry_ui_metric_collector.ts          |   4 +-
 .../kibana_usage_collection/server/plugin.ts  |  10 +-
 .../apis/telemetry/telemetry_local.js         | 108 +++++++
 12 files changed, 955 insertions(+), 373 deletions(-)
 delete mode 100644 src/plugins/kibana_usage_collection/server/collectors/application_usage/index.test.ts
 create mode 100644 src/plugins/kibana_usage_collection/server/collectors/application_usage/rollups.test.ts
 create mode 100644 src/plugins/kibana_usage_collection/server/collectors/application_usage/rollups.ts
 create mode 100644 src/plugins/kibana_usage_collection/server/collectors/application_usage/telemetry_application_usage_collector.test.ts
 delete mode 100644 src/plugins/kibana_usage_collection/server/collectors/find_all.test.ts
 delete mode 100644 src/plugins/kibana_usage_collection/server/collectors/find_all.ts

diff --git a/src/plugins/kibana_usage_collection/server/collectors/application_usage/README.md b/src/plugins/kibana_usage_collection/server/collectors/application_usage/README.md
index 1ffd01fc6fde7..cb80538fd1718 100644
--- a/src/plugins/kibana_usage_collection/server/collectors/application_usage/README.md
+++ b/src/plugins/kibana_usage_collection/server/collectors/application_usage/README.md
@@ -28,10 +28,10 @@ This collection occurs by default for every application registered via the menti
 
 ## Developer notes
 
-In order to keep the count of the events, this collector uses 2 Saved Objects:
+In order to keep the count of the events, this collector uses 3 Saved Objects:
 
-1. `application_usage_transactional`: It stores each individually reported event (up to 90 days old). Grouped by `timestamp` and `appId`.
-2. `application_usage_totals`: It stores the sum of all the events older than 90 days old per `appId`.
+1. `application_usage_transactional`: It stores each individually reported event. Grouped by `timestamp` and `appId`. The reason for having these documents instead of editing `application_usage_daily` documents on very report is to provide faster response to the requests to `/api/ui_metric/report` (creating new documents instead of finding and editing existing ones) and to avoid conflicts when multiple users reach to the API concurrently.
+2. `application_usage_daily`: Periodically, documents from `application_usage_transactional` are aggregated to daily summaries and deleted. Also grouped by `timestamp` and `appId`.
+3. `application_usage_totals`: It stores the sum of all the events older than 90 days old, grouped by `appId`.
 
-Both of them use the shared fields `appId: 'keyword'`, `numberOfClicks: 'long'` and `minutesOnScreen: 'float'`. `application_usage_transactional` also stores `timestamp: { type: 'date' }`.
-but they are currently not added in the mappings because we don't use them for search purposes, and we need to be thoughtful with the number of mapped fields in the SavedObjects index ([#43673](https://github.com/elastic/kibana/issues/43673)).
+All the types use the shared fields `appId: 'keyword'`, `numberOfClicks: 'long'` and `minutesOnScreen: 'float'`, but they are currently not added in the mappings because we don't use them for search purposes, and we need to be thoughtful with the number of mapped fields in the SavedObjects index ([#43673](https://github.com/elastic/kibana/issues/43673)). `application_usage_transactional` and `application_usage_daily` also store `timestamp: { type: 'date' }`.
diff --git a/src/plugins/kibana_usage_collection/server/collectors/application_usage/index.test.ts b/src/plugins/kibana_usage_collection/server/collectors/application_usage/index.test.ts
deleted file mode 100644
index 5658b38120596..0000000000000
--- a/src/plugins/kibana_usage_collection/server/collectors/application_usage/index.test.ts
+++ /dev/null
@@ -1,151 +0,0 @@
-/*
- * 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 { savedObjectsRepositoryMock } from '../../../../../core/server/mocks';
-import {
-  CollectorOptions,
-  createUsageCollectionSetupMock,
-} from '../../../../usage_collection/server/usage_collection.mock';
-
-import { registerApplicationUsageCollector } from './';
-import {
-  ROLL_INDICES_INTERVAL,
-  SAVED_OBJECTS_TOTAL_TYPE,
-  SAVED_OBJECTS_TRANSACTIONAL_TYPE,
-} from './telemetry_application_usage_collector';
-
-describe('telemetry_application_usage', () => {
-  jest.useFakeTimers();
-
-  let collector: CollectorOptions;
-
-  const usageCollectionMock = createUsageCollectionSetupMock();
-  usageCollectionMock.makeUsageCollector.mockImplementation((config) => {
-    collector = config;
-    return createUsageCollectionSetupMock().makeUsageCollector(config);
-  });
-
-  const getUsageCollector = jest.fn();
-  const registerType = jest.fn();
-  const callCluster = jest.fn();
-
-  beforeAll(() =>
-    registerApplicationUsageCollector(usageCollectionMock, registerType, getUsageCollector)
-  );
-  afterAll(() => jest.clearAllTimers());
-
-  test('registered collector is set', () => {
-    expect(collector).not.toBeUndefined();
-  });
-
-  test('if no savedObjectClient initialised, return undefined', async () => {
-    expect(await collector.fetch(callCluster)).toBeUndefined();
-    jest.runTimersToTime(ROLL_INDICES_INTERVAL);
-  });
-
-  test('when savedObjectClient is initialised, return something', async () => {
-    const savedObjectClient = savedObjectsRepositoryMock.create();
-    savedObjectClient.find.mockImplementation(
-      async () =>
-        ({
-          saved_objects: [],
-          total: 0,
-        } as any)
-    );
-    getUsageCollector.mockImplementation(() => savedObjectClient);
-
-    jest.runTimersToTime(ROLL_INDICES_INTERVAL); // Force rollTotals to run
-
-    expect(await collector.fetch(callCluster)).toStrictEqual({});
-    expect(savedObjectClient.bulkCreate).not.toHaveBeenCalled();
-  });
-
-  test('paging in findAll works', async () => {
-    const savedObjectClient = savedObjectsRepositoryMock.create();
-    let total = 201;
-    savedObjectClient.find.mockImplementation(async (opts) => {
-      if (opts.type === SAVED_OBJECTS_TOTAL_TYPE) {
-        return {
-          saved_objects: [
-            {
-              id: 'appId',
-              attributes: {
-                appId: 'appId',
-                minutesOnScreen: 10,
-                numberOfClicks: 10,
-              },
-            },
-          ],
-          total: 1,
-        } as any;
-      }
-      if ((opts.page || 1) > 2) {
-        return { saved_objects: [], total };
-      }
-      const doc = {
-        id: 'test-id',
-        attributes: {
-          appId: 'appId',
-          timestamp: new Date().toISOString(),
-          minutesOnScreen: 1,
-          numberOfClicks: 1,
-        },
-      };
-      const savedObjects = new Array(opts.perPage).fill(doc);
-      total = savedObjects.length * 2 + 1;
-      return { saved_objects: savedObjects, total };
-    });
-
-    getUsageCollector.mockImplementation(() => savedObjectClient);
-
-    jest.runTimersToTime(ROLL_INDICES_INTERVAL); // Force rollTotals to run
-
-    expect(await collector.fetch(callCluster)).toStrictEqual({
-      appId: {
-        clicks_total: total - 1 + 10,
-        clicks_7_days: total - 1,
-        clicks_30_days: total - 1,
-        clicks_90_days: total - 1,
-        minutes_on_screen_total: total - 1 + 10,
-        minutes_on_screen_7_days: total - 1,
-        minutes_on_screen_30_days: total - 1,
-        minutes_on_screen_90_days: total - 1,
-      },
-    });
-    expect(savedObjectClient.bulkCreate).toHaveBeenCalledWith(
-      [
-        {
-          id: 'appId',
-          type: SAVED_OBJECTS_TOTAL_TYPE,
-          attributes: {
-            appId: 'appId',
-            minutesOnScreen: total - 1 + 10,
-            numberOfClicks: total - 1 + 10,
-          },
-        },
-      ],
-      { overwrite: true }
-    );
-    expect(savedObjectClient.delete).toHaveBeenCalledTimes(total - 1);
-    expect(savedObjectClient.delete).toHaveBeenCalledWith(
-      SAVED_OBJECTS_TRANSACTIONAL_TYPE,
-      'test-id'
-    );
-  });
-});
diff --git a/src/plugins/kibana_usage_collection/server/collectors/application_usage/rollups.test.ts b/src/plugins/kibana_usage_collection/server/collectors/application_usage/rollups.test.ts
new file mode 100644
index 0000000000000..f8bc17fc40df0
--- /dev/null
+++ b/src/plugins/kibana_usage_collection/server/collectors/application_usage/rollups.test.ts
@@ -0,0 +1,299 @@
+/*
+ * 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 { rollDailyData, rollTotals } from './rollups';
+import { savedObjectsRepositoryMock, loggingSystemMock } from '../../../../../core/server/mocks';
+import { SavedObjectsErrorHelpers } from '../../../../../core/server';
+import {
+  SAVED_OBJECTS_DAILY_TYPE,
+  SAVED_OBJECTS_TOTAL_TYPE,
+  SAVED_OBJECTS_TRANSACTIONAL_TYPE,
+} from './saved_objects_types';
+
+describe('rollDailyData', () => {
+  const logger = loggingSystemMock.createLogger();
+
+  test('returns undefined if no savedObjectsClient initialised yet', async () => {
+    await expect(rollDailyData(logger, undefined)).resolves.toBe(undefined);
+  });
+
+  test('handle empty results', async () => {
+    const savedObjectClient = savedObjectsRepositoryMock.create();
+    savedObjectClient.find.mockImplementation(async ({ type, page = 1, perPage = 10 }) => {
+      switch (type) {
+        case SAVED_OBJECTS_TRANSACTIONAL_TYPE:
+          return { saved_objects: [], total: 0, page, per_page: perPage };
+        default:
+          throw new Error(`Unexpected type [${type}]`);
+      }
+    });
+    await expect(rollDailyData(logger, savedObjectClient)).resolves.toBe(undefined);
+    expect(savedObjectClient.get).not.toBeCalled();
+    expect(savedObjectClient.bulkCreate).not.toBeCalled();
+    expect(savedObjectClient.delete).not.toBeCalled();
+  });
+
+  test('migrate some docs', async () => {
+    const savedObjectClient = savedObjectsRepositoryMock.create();
+    let timesCalled = 0;
+    savedObjectClient.find.mockImplementation(async ({ type, page = 1, perPage = 10 }) => {
+      switch (type) {
+        case SAVED_OBJECTS_TRANSACTIONAL_TYPE:
+          if (timesCalled++ > 0) {
+            return { saved_objects: [], total: 0, page, per_page: perPage };
+          }
+          return {
+            saved_objects: [
+              {
+                id: 'test-id-1',
+                type,
+                score: 0,
+                references: [],
+                attributes: {
+                  appId: 'appId',
+                  timestamp: '2020-01-01T10:31:00.000Z',
+                  minutesOnScreen: 0.5,
+                  numberOfClicks: 1,
+                },
+              },
+              {
+                id: 'test-id-2',
+                type,
+                score: 0,
+                references: [],
+                attributes: {
+                  appId: 'appId',
+                  timestamp: '2020-01-01T11:31:00.000Z',
+                  minutesOnScreen: 1.5,
+                  numberOfClicks: 2,
+                },
+              },
+            ],
+            total: 2,
+            page,
+            per_page: perPage,
+          };
+        default:
+          throw new Error(`Unexpected type [${type}]`);
+      }
+    });
+
+    savedObjectClient.get.mockImplementation(async (type, id) => {
+      throw SavedObjectsErrorHelpers.createGenericNotFoundError(type, id);
+    });
+
+    await expect(rollDailyData(logger, savedObjectClient)).resolves.toBe(undefined);
+    expect(savedObjectClient.get).toHaveBeenCalledTimes(1);
+    expect(savedObjectClient.get).toHaveBeenCalledWith(
+      SAVED_OBJECTS_DAILY_TYPE,
+      'appId:2020-01-01'
+    );
+    expect(savedObjectClient.bulkCreate).toHaveBeenCalledTimes(1);
+    expect(savedObjectClient.bulkCreate).toHaveBeenCalledWith(
+      [
+        {
+          type: SAVED_OBJECTS_DAILY_TYPE,
+          id: 'appId:2020-01-01',
+          attributes: {
+            appId: 'appId',
+            timestamp: '2020-01-01T00:00:00.000Z',
+            minutesOnScreen: 2.0,
+            numberOfClicks: 3,
+          },
+        },
+      ],
+      { overwrite: true }
+    );
+    expect(savedObjectClient.delete).toHaveBeenCalledTimes(2);
+    expect(savedObjectClient.delete).toHaveBeenCalledWith(
+      SAVED_OBJECTS_TRANSACTIONAL_TYPE,
+      'test-id-1'
+    );
+    expect(savedObjectClient.delete).toHaveBeenCalledWith(
+      SAVED_OBJECTS_TRANSACTIONAL_TYPE,
+      'test-id-2'
+    );
+  });
+
+  test('error getting the daily document', async () => {
+    const savedObjectClient = savedObjectsRepositoryMock.create();
+    let timesCalled = 0;
+    savedObjectClient.find.mockImplementation(async ({ type, page = 1, perPage = 10 }) => {
+      switch (type) {
+        case SAVED_OBJECTS_TRANSACTIONAL_TYPE:
+          if (timesCalled++ > 0) {
+            return { saved_objects: [], total: 0, page, per_page: perPage };
+          }
+          return {
+            saved_objects: [
+              {
+                id: 'test-id-1',
+                type,
+                score: 0,
+                references: [],
+                attributes: {
+                  appId: 'appId',
+                  timestamp: '2020-01-01T10:31:00.000Z',
+                  minutesOnScreen: 0.5,
+                  numberOfClicks: 1,
+                },
+              },
+            ],
+            total: 1,
+            page,
+            per_page: perPage,
+          };
+        default:
+          throw new Error(`Unexpected type [${type}]`);
+      }
+    });
+
+    savedObjectClient.get.mockImplementation(async (type, id) => {
+      throw new Error('Something went terribly wrong');
+    });
+
+    await expect(rollDailyData(logger, savedObjectClient)).resolves.toBe(undefined);
+    expect(savedObjectClient.get).toHaveBeenCalledTimes(1);
+    expect(savedObjectClient.get).toHaveBeenCalledWith(
+      SAVED_OBJECTS_DAILY_TYPE,
+      'appId:2020-01-01'
+    );
+    expect(savedObjectClient.bulkCreate).toHaveBeenCalledTimes(0);
+    expect(savedObjectClient.delete).toHaveBeenCalledTimes(0);
+  });
+});
+
+describe('rollTotals', () => {
+  const logger = loggingSystemMock.createLogger();
+
+  test('returns undefined if no savedObjectsClient initialised yet', async () => {
+    await expect(rollTotals(logger, undefined)).resolves.toBe(undefined);
+  });
+
+  test('handle empty results', async () => {
+    const savedObjectClient = savedObjectsRepositoryMock.create();
+    savedObjectClient.find.mockImplementation(async ({ type, page = 1, perPage = 10 }) => {
+      switch (type) {
+        case SAVED_OBJECTS_DAILY_TYPE:
+        case SAVED_OBJECTS_TOTAL_TYPE:
+          return { saved_objects: [], total: 0, page, per_page: perPage };
+        default:
+          throw new Error(`Unexpected type [${type}]`);
+      }
+    });
+    await expect(rollTotals(logger, savedObjectClient)).resolves.toBe(undefined);
+    expect(savedObjectClient.bulkCreate).toHaveBeenCalledTimes(0);
+    expect(savedObjectClient.delete).toHaveBeenCalledTimes(0);
+  });
+
+  test('migrate some documents', async () => {
+    const savedObjectClient = savedObjectsRepositoryMock.create();
+    savedObjectClient.find.mockImplementation(async ({ type, page = 1, perPage = 10 }) => {
+      switch (type) {
+        case SAVED_OBJECTS_DAILY_TYPE:
+          return {
+            saved_objects: [
+              {
+                id: 'appId-2:2020-01-01',
+                type,
+                score: 0,
+                references: [],
+                attributes: {
+                  appId: 'appId-2',
+                  timestamp: '2020-01-01T10:31:00.000Z',
+                  minutesOnScreen: 0.5,
+                  numberOfClicks: 1,
+                },
+              },
+              {
+                id: 'appId-1:2020-01-01',
+                type,
+                score: 0,
+                references: [],
+                attributes: {
+                  appId: 'appId-1',
+                  timestamp: '2020-01-01T11:31:00.000Z',
+                  minutesOnScreen: 1.5,
+                  numberOfClicks: 2,
+                },
+              },
+            ],
+            total: 2,
+            page,
+            per_page: perPage,
+          };
+        case SAVED_OBJECTS_TOTAL_TYPE:
+          return {
+            saved_objects: [
+              {
+                id: 'appId-1',
+                type,
+                score: 0,
+                references: [],
+                attributes: {
+                  appId: 'appId-1',
+                  minutesOnScreen: 0.5,
+                  numberOfClicks: 1,
+                },
+              },
+            ],
+            total: 1,
+            page,
+            per_page: perPage,
+          };
+        default:
+          throw new Error(`Unexpected type [${type}]`);
+      }
+    });
+    await expect(rollTotals(logger, savedObjectClient)).resolves.toBe(undefined);
+    expect(savedObjectClient.bulkCreate).toHaveBeenCalledTimes(1);
+    expect(savedObjectClient.bulkCreate).toHaveBeenCalledWith(
+      [
+        {
+          type: SAVED_OBJECTS_TOTAL_TYPE,
+          id: 'appId-1',
+          attributes: {
+            appId: 'appId-1',
+            minutesOnScreen: 2.0,
+            numberOfClicks: 3,
+          },
+        },
+        {
+          type: SAVED_OBJECTS_TOTAL_TYPE,
+          id: 'appId-2',
+          attributes: {
+            appId: 'appId-2',
+            minutesOnScreen: 0.5,
+            numberOfClicks: 1,
+          },
+        },
+      ],
+      { overwrite: true }
+    );
+    expect(savedObjectClient.delete).toHaveBeenCalledTimes(2);
+    expect(savedObjectClient.delete).toHaveBeenCalledWith(
+      SAVED_OBJECTS_DAILY_TYPE,
+      'appId-2:2020-01-01'
+    );
+    expect(savedObjectClient.delete).toHaveBeenCalledWith(
+      SAVED_OBJECTS_DAILY_TYPE,
+      'appId-1:2020-01-01'
+    );
+  });
+});
diff --git a/src/plugins/kibana_usage_collection/server/collectors/application_usage/rollups.ts b/src/plugins/kibana_usage_collection/server/collectors/application_usage/rollups.ts
new file mode 100644
index 0000000000000..3020147e95d98
--- /dev/null
+++ b/src/plugins/kibana_usage_collection/server/collectors/application_usage/rollups.ts
@@ -0,0 +1,202 @@
+/*
+ * 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 { ISavedObjectsRepository, SavedObject, Logger } from 'kibana/server';
+import moment from 'moment';
+import {
+  ApplicationUsageDaily,
+  ApplicationUsageTotal,
+  ApplicationUsageTransactional,
+  SAVED_OBJECTS_DAILY_TYPE,
+  SAVED_OBJECTS_TOTAL_TYPE,
+  SAVED_OBJECTS_TRANSACTIONAL_TYPE,
+} from './saved_objects_types';
+import { SavedObjectsErrorHelpers } from '../../../../../../src/core/server';
+
+/**
+ * For Rolling the daily data, we only care about the stored attributes and the version (to avoid overwriting via concurrent requests)
+ */
+type ApplicationUsageDailyWithVersion = Pick<
+  SavedObject<ApplicationUsageDaily>,
+  'version' | 'attributes'
+>;
+
+/**
+ * Aggregates all the transactional events into daily aggregates
+ * @param logger
+ * @param savedObjectsClient
+ */
+export async function rollDailyData(logger: Logger, savedObjectsClient?: ISavedObjectsRepository) {
+  if (!savedObjectsClient) {
+    return;
+  }
+
+  try {
+    let toCreate: Map<string, ApplicationUsageDailyWithVersion>;
+    do {
+      toCreate = new Map();
+      const { saved_objects: rawApplicationUsageTransactional } = await savedObjectsClient.find<
+        ApplicationUsageTransactional
+      >({
+        type: SAVED_OBJECTS_TRANSACTIONAL_TYPE,
+        perPage: 1000, // Process 1000 at a time as a compromise of speed and overload
+      });
+
+      for (const doc of rawApplicationUsageTransactional) {
+        const {
+          attributes: { appId, minutesOnScreen, numberOfClicks, timestamp },
+        } = doc;
+        const dayId = moment(timestamp).format('YYYY-MM-DD');
+        const dailyId = `${appId}:${dayId}`;
+        const existingDoc =
+          toCreate.get(dailyId) || (await getDailyDoc(savedObjectsClient, dailyId, appId, dayId));
+        toCreate.set(dailyId, {
+          ...existingDoc,
+          attributes: {
+            ...existingDoc.attributes,
+            minutesOnScreen: existingDoc.attributes.minutesOnScreen + minutesOnScreen,
+            numberOfClicks: existingDoc.attributes.numberOfClicks + numberOfClicks,
+          },
+        });
+      }
+      if (toCreate.size > 0) {
+        await savedObjectsClient.bulkCreate(
+          [...toCreate.entries()].map(([id, { attributes, version }]) => ({
+            type: SAVED_OBJECTS_DAILY_TYPE,
+            id,
+            attributes,
+            version, // Providing version to ensure via conflict matching that only 1 Kibana instance (or interval) is taking care of the updates
+          })),
+          { overwrite: true }
+        );
+        await Promise.all(
+          rawApplicationUsageTransactional.map(
+            ({ id }) => savedObjectsClient.delete(SAVED_OBJECTS_TRANSACTIONAL_TYPE, id) // There is no bulkDelete :(
+          )
+        );
+      }
+    } while (toCreate.size > 0);
+  } catch (err) {
+    logger.warn(`Failed to rollup transactional to daily entries`);
+    logger.warn(err);
+  }
+}
+
+/**
+ * Gets daily doc from the SavedObjects repository. Creates a new one if not found
+ * @param savedObjectsClient
+ * @param id The ID of the document to retrieve (typically, `${appId}:${dayId}`)
+ * @param appId The application ID
+ * @param dayId The date of the document in the format YYYY-MM-DD
+ */
+async function getDailyDoc(
+  savedObjectsClient: ISavedObjectsRepository,
+  id: string,
+  appId: string,
+  dayId: string
+): Promise<ApplicationUsageDailyWithVersion> {
+  try {
+    return await savedObjectsClient.get<ApplicationUsageDaily>(SAVED_OBJECTS_DAILY_TYPE, id);
+  } catch (err) {
+    if (SavedObjectsErrorHelpers.isNotFoundError(err)) {
+      return {
+        attributes: {
+          appId,
+          // Concatenating the day in YYYY-MM-DD form to T00:00:00Z to reduce the TZ effects
+          timestamp: moment(`${moment(dayId).format('YYYY-MM-DD')}T00:00:00Z`).toISOString(),
+          minutesOnScreen: 0,
+          numberOfClicks: 0,
+        },
+      };
+    }
+    throw err;
+  }
+}
+
+/**
+ * Moves all the daily documents into aggregated "total" documents as we don't care about any granularity after 90 days
+ * @param logger
+ * @param savedObjectsClient
+ */
+export async function rollTotals(logger: Logger, savedObjectsClient?: ISavedObjectsRepository) {
+  if (!savedObjectsClient) {
+    return;
+  }
+
+  try {
+    const [
+      { saved_objects: rawApplicationUsageTotals },
+      { saved_objects: rawApplicationUsageDaily },
+    ] = await Promise.all([
+      savedObjectsClient.find<ApplicationUsageTotal>({
+        perPage: 10000,
+        type: SAVED_OBJECTS_TOTAL_TYPE,
+      }),
+      savedObjectsClient.find<ApplicationUsageDaily>({
+        perPage: 10000,
+        type: SAVED_OBJECTS_DAILY_TYPE,
+        filter: `${SAVED_OBJECTS_DAILY_TYPE}.attributes.timestamp < now-90d`,
+      }),
+    ]);
+
+    const existingTotals = rawApplicationUsageTotals.reduce(
+      (acc, { attributes: { appId, numberOfClicks, minutesOnScreen } }) => {
+        return {
+          ...acc,
+          // No need to sum because there should be 1 document per appId only
+          [appId]: { appId, numberOfClicks, minutesOnScreen },
+        };
+      },
+      {} as Record<string, { appId: string; minutesOnScreen: number; numberOfClicks: number }>
+    );
+
+    const totals = rawApplicationUsageDaily.reduce((acc, { attributes }) => {
+      const { appId, numberOfClicks, minutesOnScreen } = attributes;
+
+      const existing = acc[appId] || { minutesOnScreen: 0, numberOfClicks: 0 };
+
+      return {
+        ...acc,
+        [appId]: {
+          appId,
+          numberOfClicks: numberOfClicks + existing.numberOfClicks,
+          minutesOnScreen: minutesOnScreen + existing.minutesOnScreen,
+        },
+      };
+    }, existingTotals);
+
+    await Promise.all([
+      Object.entries(totals).length &&
+        savedObjectsClient.bulkCreate<ApplicationUsageTotal>(
+          Object.entries(totals).map(([id, entry]) => ({
+            type: SAVED_OBJECTS_TOTAL_TYPE,
+            id,
+            attributes: entry,
+          })),
+          { overwrite: true }
+        ),
+      ...rawApplicationUsageDaily.map(
+        ({ id }) => savedObjectsClient.delete(SAVED_OBJECTS_DAILY_TYPE, id) // There is no bulkDelete :(
+      ),
+    ]);
+  } catch (err) {
+    logger.warn(`Failed to rollup daily entries to totals`);
+    logger.warn(err);
+  }
+}
diff --git a/src/plugins/kibana_usage_collection/server/collectors/application_usage/saved_objects_types.ts b/src/plugins/kibana_usage_collection/server/collectors/application_usage/saved_objects_types.ts
index 551c6e230972e..861dc98c0c465 100644
--- a/src/plugins/kibana_usage_collection/server/collectors/application_usage/saved_objects_types.ts
+++ b/src/plugins/kibana_usage_collection/server/collectors/application_usage/saved_objects_types.ts
@@ -19,19 +19,34 @@
 
 import { SavedObjectAttributes, SavedObjectsServiceSetup } from 'kibana/server';
 
+/**
+ * Used for accumulating the totals of all the stats older than 90d
+ */
 export interface ApplicationUsageTotal extends SavedObjectAttributes {
   appId: string;
   minutesOnScreen: number;
   numberOfClicks: number;
 }
+export const SAVED_OBJECTS_TOTAL_TYPE = 'application_usage_totals';
 
+/**
+ * Used for storing each of the reports received from the users' browsers
+ */
 export interface ApplicationUsageTransactional extends ApplicationUsageTotal {
   timestamp: string;
 }
+export const SAVED_OBJECTS_TRANSACTIONAL_TYPE = 'application_usage_transactional';
+
+/**
+ * Used to aggregate the transactional events into daily summaries so we can purge the granular events
+ */
+export type ApplicationUsageDaily = ApplicationUsageTransactional;
+export const SAVED_OBJECTS_DAILY_TYPE = 'application_usage_daily';
 
 export function registerMappings(registerType: SavedObjectsServiceSetup['registerType']) {
+  // Type for storing ApplicationUsageTotal
   registerType({
-    name: 'application_usage_totals',
+    name: SAVED_OBJECTS_TOTAL_TYPE,
     hidden: false,
     namespaceType: 'agnostic',
     mappings: {
@@ -42,15 +57,28 @@ export function registerMappings(registerType: SavedObjectsServiceSetup['registe
     },
   });
 
+  // Type for storing ApplicationUsageDaily
   registerType({
-    name: 'application_usage_transactional',
+    name: SAVED_OBJECTS_DAILY_TYPE,
     hidden: false,
     namespaceType: 'agnostic',
     mappings: {
       dynamic: false,
       properties: {
+        // This type requires `timestamp` to be indexed so we can use it when rolling up totals (timestamp < now-90d)
         timestamp: { type: 'date' },
       },
     },
   });
+
+  // Type for storing ApplicationUsageTransactional (declaring empty mappings because we don't use the internal fields for query/aggregations)
+  registerType({
+    name: SAVED_OBJECTS_TRANSACTIONAL_TYPE,
+    hidden: false,
+    namespaceType: 'agnostic',
+    mappings: {
+      dynamic: false,
+      properties: {},
+    },
+  });
 }
diff --git a/src/plugins/kibana_usage_collection/server/collectors/application_usage/telemetry_application_usage_collector.test.ts b/src/plugins/kibana_usage_collection/server/collectors/application_usage/telemetry_application_usage_collector.test.ts
new file mode 100644
index 0000000000000..709736a37d802
--- /dev/null
+++ b/src/plugins/kibana_usage_collection/server/collectors/application_usage/telemetry_application_usage_collector.test.ts
@@ -0,0 +1,213 @@
+/*
+ * 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 { savedObjectsRepositoryMock, loggingSystemMock } from '../../../../../core/server/mocks';
+import {
+  CollectorOptions,
+  createUsageCollectionSetupMock,
+} from '../../../../usage_collection/server/usage_collection.mock';
+
+import {
+  ROLL_INDICES_START,
+  ROLL_TOTAL_INDICES_INTERVAL,
+  registerApplicationUsageCollector,
+} from './telemetry_application_usage_collector';
+import {
+  SAVED_OBJECTS_DAILY_TYPE,
+  SAVED_OBJECTS_TOTAL_TYPE,
+  SAVED_OBJECTS_TRANSACTIONAL_TYPE,
+} from './saved_objects_types';
+
+describe('telemetry_application_usage', () => {
+  jest.useFakeTimers();
+
+  const logger = loggingSystemMock.createLogger();
+
+  let collector: CollectorOptions;
+
+  const usageCollectionMock = createUsageCollectionSetupMock();
+  usageCollectionMock.makeUsageCollector.mockImplementation((config) => {
+    collector = config;
+    return createUsageCollectionSetupMock().makeUsageCollector(config);
+  });
+
+  const getUsageCollector = jest.fn();
+  const registerType = jest.fn();
+  const callCluster = jest.fn();
+
+  beforeAll(() =>
+    registerApplicationUsageCollector(logger, usageCollectionMock, registerType, getUsageCollector)
+  );
+  afterAll(() => jest.clearAllTimers());
+
+  test('registered collector is set', () => {
+    expect(collector).not.toBeUndefined();
+  });
+
+  test('if no savedObjectClient initialised, return undefined', async () => {
+    expect(collector.isReady()).toBe(false);
+    expect(await collector.fetch(callCluster)).toBeUndefined();
+    jest.runTimersToTime(ROLL_INDICES_START);
+  });
+
+  test('when savedObjectClient is initialised, return something', async () => {
+    const savedObjectClient = savedObjectsRepositoryMock.create();
+    savedObjectClient.find.mockImplementation(
+      async () =>
+        ({
+          saved_objects: [],
+          total: 0,
+        } as any)
+    );
+    getUsageCollector.mockImplementation(() => savedObjectClient);
+
+    jest.runTimersToTime(ROLL_TOTAL_INDICES_INTERVAL); // Force rollTotals to run
+
+    expect(collector.isReady()).toBe(true);
+    expect(await collector.fetch(callCluster)).toStrictEqual({});
+    expect(savedObjectClient.bulkCreate).not.toHaveBeenCalled();
+  });
+
+  test('it only gets 10k even when there are more documents (ES limitation)', async () => {
+    const savedObjectClient = savedObjectsRepositoryMock.create();
+    const total = 10000;
+    savedObjectClient.find.mockImplementation(async (opts) => {
+      switch (opts.type) {
+        case SAVED_OBJECTS_TOTAL_TYPE:
+          return {
+            saved_objects: [
+              {
+                id: 'appId',
+                attributes: {
+                  appId: 'appId',
+                  minutesOnScreen: 10,
+                  numberOfClicks: 10,
+                },
+              },
+            ],
+            total: 1,
+          } as any;
+        case SAVED_OBJECTS_TRANSACTIONAL_TYPE:
+          const doc = {
+            id: 'test-id',
+            attributes: {
+              appId: 'appId',
+              timestamp: new Date().toISOString(),
+              minutesOnScreen: 0.5,
+              numberOfClicks: 1,
+            },
+          };
+          const savedObjects = new Array(total).fill(doc);
+          return { saved_objects: savedObjects, total: total + 1 };
+        case SAVED_OBJECTS_DAILY_TYPE:
+          return {
+            saved_objects: [
+              {
+                id: 'appId:YYYY-MM-DD',
+                attributes: {
+                  appId: 'appId',
+                  timestamp: new Date().toISOString(),
+                  minutesOnScreen: 0.5,
+                  numberOfClicks: 1,
+                },
+              },
+            ],
+            total: 1,
+          };
+      }
+    });
+
+    getUsageCollector.mockImplementation(() => savedObjectClient);
+
+    jest.runTimersToTime(ROLL_TOTAL_INDICES_INTERVAL); // Force rollTotals to run
+
+    expect(await collector.fetch(callCluster)).toStrictEqual({
+      appId: {
+        clicks_total: total + 1 + 10,
+        clicks_7_days: total + 1,
+        clicks_30_days: total + 1,
+        clicks_90_days: total + 1,
+        minutes_on_screen_total: (total + 1) * 0.5 + 10,
+        minutes_on_screen_7_days: (total + 1) * 0.5,
+        minutes_on_screen_30_days: (total + 1) * 0.5,
+        minutes_on_screen_90_days: (total + 1) * 0.5,
+      },
+    });
+    expect(savedObjectClient.bulkCreate).toHaveBeenCalledWith(
+      [
+        {
+          id: 'appId',
+          type: SAVED_OBJECTS_TOTAL_TYPE,
+          attributes: {
+            appId: 'appId',
+            minutesOnScreen: 10.5,
+            numberOfClicks: 11,
+          },
+        },
+      ],
+      { overwrite: true }
+    );
+    expect(savedObjectClient.delete).toHaveBeenCalledTimes(1);
+    expect(savedObjectClient.delete).toHaveBeenCalledWith(
+      SAVED_OBJECTS_DAILY_TYPE,
+      'appId:YYYY-MM-DD'
+    );
+  });
+
+  test('old transactional data not migrated yet', async () => {
+    const savedObjectClient = savedObjectsRepositoryMock.create();
+    savedObjectClient.find.mockImplementation(async (opts) => {
+      switch (opts.type) {
+        case SAVED_OBJECTS_TOTAL_TYPE:
+        case SAVED_OBJECTS_DAILY_TYPE:
+          return { saved_objects: [], total: 0 } as any;
+        case SAVED_OBJECTS_TRANSACTIONAL_TYPE:
+          return {
+            saved_objects: [
+              {
+                id: 'test-id',
+                attributes: {
+                  appId: 'appId',
+                  timestamp: new Date(0).toISOString(),
+                  minutesOnScreen: 0.5,
+                  numberOfClicks: 1,
+                },
+              },
+            ],
+            total: 1,
+          };
+      }
+    });
+
+    getUsageCollector.mockImplementation(() => savedObjectClient);
+
+    expect(await collector.fetch(callCluster)).toStrictEqual({
+      appId: {
+        clicks_total: 1,
+        clicks_7_days: 0,
+        clicks_30_days: 0,
+        clicks_90_days: 0,
+        minutes_on_screen_total: 0.5,
+        minutes_on_screen_7_days: 0,
+        minutes_on_screen_30_days: 0,
+        minutes_on_screen_90_days: 0,
+      },
+    });
+  });
+});
diff --git a/src/plugins/kibana_usage_collection/server/collectors/application_usage/telemetry_application_usage_collector.ts b/src/plugins/kibana_usage_collection/server/collectors/application_usage/telemetry_application_usage_collector.ts
index 69137681e0597..36c89d0a0b4a8 100644
--- a/src/plugins/kibana_usage_collection/server/collectors/application_usage/telemetry_application_usage_collector.ts
+++ b/src/plugins/kibana_usage_collection/server/collectors/application_usage/telemetry_application_usage_collector.ts
@@ -18,29 +18,42 @@
  */
 
 import moment from 'moment';
-import { ISavedObjectsRepository, SavedObjectsServiceSetup } from 'kibana/server';
+import { timer } from 'rxjs';
+import { ISavedObjectsRepository, Logger, SavedObjectsServiceSetup } from 'kibana/server';
 import { UsageCollectionSetup } from 'src/plugins/usage_collection/server';
-import { findAll } from '../find_all';
 import {
+  ApplicationUsageDaily,
   ApplicationUsageTotal,
   ApplicationUsageTransactional,
   registerMappings,
+  SAVED_OBJECTS_DAILY_TYPE,
+  SAVED_OBJECTS_TOTAL_TYPE,
+  SAVED_OBJECTS_TRANSACTIONAL_TYPE,
 } from './saved_objects_types';
 import { applicationUsageSchema } from './schema';
+import { rollDailyData, rollTotals } from './rollups';
 
 /**
- * Roll indices every 24h
+ * Roll total indices every 24h
  */
-export const ROLL_INDICES_INTERVAL = 24 * 60 * 60 * 1000;
+export const ROLL_TOTAL_INDICES_INTERVAL = 24 * 60 * 60 * 1000;
+
+/**
+ * Roll daily indices every 30 minutes.
+ * This means that, assuming a user can visit all the 44 apps we can possibly report
+ * in the 3 minutes interval the browser reports to the server, up to 22 users can have the same
+ * behaviour and we wouldn't need to paginate in the transactional documents (less than 10k docs).
+ *
+ * Based on a more normal expected use case, the users could visit up to 5 apps in those 3 minutes,
+ * allowing up to 200 users before reaching the limit.
+ */
+export const ROLL_DAILY_INDICES_INTERVAL = 30 * 60 * 1000;
 
 /**
  * Start rolling indices after 5 minutes up
  */
 export const ROLL_INDICES_START = 5 * 60 * 1000;
 
-export const SAVED_OBJECTS_TOTAL_TYPE = 'application_usage_totals';
-export const SAVED_OBJECTS_TRANSACTIONAL_TYPE = 'application_usage_transactional';
-
 export interface ApplicationUsageTelemetryReport {
   [appId: string]: {
     clicks_total: number;
@@ -55,6 +68,7 @@ export interface ApplicationUsageTelemetryReport {
 }
 
 export function registerApplicationUsageCollector(
+  logger: Logger,
   usageCollection: UsageCollectionSetup,
   registerType: SavedObjectsServiceSetup['registerType'],
   getSavedObjectsClient: () => ISavedObjectsRepository | undefined
@@ -71,10 +85,22 @@ export function registerApplicationUsageCollector(
         if (typeof savedObjectsClient === 'undefined') {
           return;
         }
-        const [rawApplicationUsageTotals, rawApplicationUsageTransactional] = await Promise.all([
-          findAll<ApplicationUsageTotal>(savedObjectsClient, { type: SAVED_OBJECTS_TOTAL_TYPE }),
-          findAll<ApplicationUsageTransactional>(savedObjectsClient, {
+        const [
+          { saved_objects: rawApplicationUsageTotals },
+          { saved_objects: rawApplicationUsageDaily },
+          { saved_objects: rawApplicationUsageTransactional },
+        ] = await Promise.all([
+          savedObjectsClient.find<ApplicationUsageTotal>({
+            type: SAVED_OBJECTS_TOTAL_TYPE,
+            perPage: 10000, // We only have 44 apps for now. This limit is OK.
+          }),
+          savedObjectsClient.find<ApplicationUsageDaily>({
+            type: SAVED_OBJECTS_DAILY_TYPE,
+            perPage: 10000, // We can have up to 44 apps * 91 days = 4004 docs. This limit is OK
+          }),
+          savedObjectsClient.find<ApplicationUsageTransactional>({
             type: SAVED_OBJECTS_TRANSACTIONAL_TYPE,
+            perPage: 10000, // If we have more than those, we won't report the rest (they'll be rolled up to the daily soon enough to become a problem)
           }),
         ]);
 
@@ -101,51 +127,51 @@ export function registerApplicationUsageCollector(
         const nowMinus30 = moment().subtract(30, 'days');
         const nowMinus90 = moment().subtract(90, 'days');
 
-        const applicationUsage = rawApplicationUsageTransactional.reduce(
-          (acc, { attributes: { appId, minutesOnScreen, numberOfClicks, timestamp } }) => {
-            const existing = acc[appId] || {
-              clicks_total: 0,
-              clicks_7_days: 0,
-              clicks_30_days: 0,
-              clicks_90_days: 0,
-              minutes_on_screen_total: 0,
-              minutes_on_screen_7_days: 0,
-              minutes_on_screen_30_days: 0,
-              minutes_on_screen_90_days: 0,
-            };
-
-            const timeOfEntry = moment(timestamp as string);
-            const isInLast7Days = timeOfEntry.isSameOrAfter(nowMinus7);
-            const isInLast30Days = timeOfEntry.isSameOrAfter(nowMinus30);
-            const isInLast90Days = timeOfEntry.isSameOrAfter(nowMinus90);
-
-            const last7Days = {
-              clicks_7_days: existing.clicks_7_days + numberOfClicks,
-              minutes_on_screen_7_days: existing.minutes_on_screen_7_days + minutesOnScreen,
-            };
-            const last30Days = {
-              clicks_30_days: existing.clicks_30_days + numberOfClicks,
-              minutes_on_screen_30_days: existing.minutes_on_screen_30_days + minutesOnScreen,
-            };
-            const last90Days = {
-              clicks_90_days: existing.clicks_90_days + numberOfClicks,
-              minutes_on_screen_90_days: existing.minutes_on_screen_90_days + minutesOnScreen,
-            };
-
-            return {
-              ...acc,
-              [appId]: {
-                ...existing,
-                clicks_total: existing.clicks_total + numberOfClicks,
-                minutes_on_screen_total: existing.minutes_on_screen_total + minutesOnScreen,
-                ...(isInLast7Days ? last7Days : {}),
-                ...(isInLast30Days ? last30Days : {}),
-                ...(isInLast90Days ? last90Days : {}),
-              },
-            };
-          },
-          applicationUsageFromTotals
-        );
+        const applicationUsage = [
+          ...rawApplicationUsageDaily,
+          ...rawApplicationUsageTransactional,
+        ].reduce((acc, { attributes: { appId, minutesOnScreen, numberOfClicks, timestamp } }) => {
+          const existing = acc[appId] || {
+            clicks_total: 0,
+            clicks_7_days: 0,
+            clicks_30_days: 0,
+            clicks_90_days: 0,
+            minutes_on_screen_total: 0,
+            minutes_on_screen_7_days: 0,
+            minutes_on_screen_30_days: 0,
+            minutes_on_screen_90_days: 0,
+          };
+
+          const timeOfEntry = moment(timestamp);
+          const isInLast7Days = timeOfEntry.isSameOrAfter(nowMinus7);
+          const isInLast30Days = timeOfEntry.isSameOrAfter(nowMinus30);
+          const isInLast90Days = timeOfEntry.isSameOrAfter(nowMinus90);
+
+          const last7Days = {
+            clicks_7_days: existing.clicks_7_days + numberOfClicks,
+            minutes_on_screen_7_days: existing.minutes_on_screen_7_days + minutesOnScreen,
+          };
+          const last30Days = {
+            clicks_30_days: existing.clicks_30_days + numberOfClicks,
+            minutes_on_screen_30_days: existing.minutes_on_screen_30_days + minutesOnScreen,
+          };
+          const last90Days = {
+            clicks_90_days: existing.clicks_90_days + numberOfClicks,
+            minutes_on_screen_90_days: existing.minutes_on_screen_90_days + minutesOnScreen,
+          };
+
+          return {
+            ...acc,
+            [appId]: {
+              ...existing,
+              clicks_total: existing.clicks_total + numberOfClicks,
+              minutes_on_screen_total: existing.minutes_on_screen_total + minutesOnScreen,
+              ...(isInLast7Days ? last7Days : {}),
+              ...(isInLast30Days ? last30Days : {}),
+              ...(isInLast90Days ? last90Days : {}),
+            },
+          };
+        }, applicationUsageFromTotals);
 
         return applicationUsage;
       },
@@ -154,65 +180,10 @@ export function registerApplicationUsageCollector(
 
   usageCollection.registerCollector(collector);
 
-  setInterval(() => rollTotals(getSavedObjectsClient()), ROLL_INDICES_INTERVAL);
-  setTimeout(() => rollTotals(getSavedObjectsClient()), ROLL_INDICES_START);
-}
-
-async function rollTotals(savedObjectsClient?: ISavedObjectsRepository) {
-  if (!savedObjectsClient) {
-    return;
-  }
-
-  try {
-    const [rawApplicationUsageTotals, rawApplicationUsageTransactional] = await Promise.all([
-      findAll<ApplicationUsageTotal>(savedObjectsClient, { type: SAVED_OBJECTS_TOTAL_TYPE }),
-      findAll<ApplicationUsageTransactional>(savedObjectsClient, {
-        type: SAVED_OBJECTS_TRANSACTIONAL_TYPE,
-        filter: `${SAVED_OBJECTS_TRANSACTIONAL_TYPE}.attributes.timestamp < now-90d`,
-      }),
-    ]);
-
-    const existingTotals = rawApplicationUsageTotals.reduce(
-      (acc, { attributes: { appId, numberOfClicks, minutesOnScreen } }) => {
-        return {
-          ...acc,
-          // No need to sum because there should be 1 document per appId only
-          [appId]: { appId, numberOfClicks, minutesOnScreen },
-        };
-      },
-      {} as Record<string, { appId: string; minutesOnScreen: number; numberOfClicks: number }>
-    );
-
-    const totals = rawApplicationUsageTransactional.reduce((acc, { attributes, id }) => {
-      const { appId, numberOfClicks, minutesOnScreen } = attributes;
-
-      const existing = acc[appId] || { minutesOnScreen: 0, numberOfClicks: 0 };
-
-      return {
-        ...acc,
-        [appId]: {
-          appId,
-          numberOfClicks: numberOfClicks + existing.numberOfClicks,
-          minutesOnScreen: minutesOnScreen + existing.minutesOnScreen,
-        },
-      };
-    }, existingTotals);
-
-    await Promise.all([
-      Object.entries(totals).length &&
-        savedObjectsClient.bulkCreate<ApplicationUsageTotal>(
-          Object.entries(totals).map(([id, entry]) => ({
-            type: SAVED_OBJECTS_TOTAL_TYPE,
-            id,
-            attributes: entry,
-          })),
-          { overwrite: true }
-        ),
-      ...rawApplicationUsageTransactional.map(
-        ({ id }) => savedObjectsClient.delete(SAVED_OBJECTS_TRANSACTIONAL_TYPE, id) // There is no bulkDelete :(
-      ),
-    ]);
-  } catch (err) {
-    // Silent failure
-  }
+  timer(ROLL_INDICES_START, ROLL_DAILY_INDICES_INTERVAL).subscribe(() =>
+    rollDailyData(logger, getSavedObjectsClient())
+  );
+  timer(ROLL_INDICES_START, ROLL_TOTAL_INDICES_INTERVAL).subscribe(() =>
+    rollTotals(logger, getSavedObjectsClient())
+  );
 }
diff --git a/src/plugins/kibana_usage_collection/server/collectors/find_all.test.ts b/src/plugins/kibana_usage_collection/server/collectors/find_all.test.ts
deleted file mode 100644
index d917cd2454e81..0000000000000
--- a/src/plugins/kibana_usage_collection/server/collectors/find_all.test.ts
+++ /dev/null
@@ -1,55 +0,0 @@
-/*
- * 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 { savedObjectsRepositoryMock } from '../../../../core/server/mocks';
-
-import { findAll } from './find_all';
-
-describe('telemetry_application_usage', () => {
-  test('when savedObjectClient is initialised, return something', async () => {
-    const savedObjectClient = savedObjectsRepositoryMock.create();
-    savedObjectClient.find.mockImplementation(
-      async () =>
-        ({
-          saved_objects: [],
-          total: 0,
-        } as any)
-    );
-
-    expect(await findAll(savedObjectClient, { type: 'test-type' })).toStrictEqual([]);
-  });
-
-  test('paging in findAll works', async () => {
-    const savedObjectClient = savedObjectsRepositoryMock.create();
-    let total = 201;
-    const doc = { id: 'test-id', attributes: { test: 1 } };
-    savedObjectClient.find.mockImplementation(async (opts) => {
-      if ((opts.page || 1) > 2) {
-        return { saved_objects: [], total } as any;
-      }
-      const savedObjects = new Array(opts.perPage).fill(doc);
-      total = savedObjects.length * 2 + 1;
-      return { saved_objects: savedObjects, total };
-    });
-
-    expect(await findAll(savedObjectClient, { type: 'test-type' })).toStrictEqual(
-      new Array(total - 1).fill(doc)
-    );
-  });
-});
diff --git a/src/plugins/kibana_usage_collection/server/collectors/find_all.ts b/src/plugins/kibana_usage_collection/server/collectors/find_all.ts
deleted file mode 100644
index 5bb4f20b5c5b1..0000000000000
--- a/src/plugins/kibana_usage_collection/server/collectors/find_all.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-/*
- * 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 {
-  SavedObjectAttributes,
-  ISavedObjectsRepository,
-  SavedObjectsFindOptions,
-  SavedObject,
-} from 'kibana/server';
-
-export async function findAll<T extends SavedObjectAttributes>(
-  savedObjectsClient: ISavedObjectsRepository,
-  opts: SavedObjectsFindOptions
-): Promise<Array<SavedObject<T>>> {
-  const { page = 1, perPage = 10000, ...options } = opts;
-  const { saved_objects: savedObjects, total } = await savedObjectsClient.find<T>({
-    ...options,
-    page,
-    perPage,
-  });
-  if (page * perPage >= total) {
-    return savedObjects;
-  }
-  return [...savedObjects, ...(await findAll<T>(savedObjectsClient, { ...opts, page: page + 1 }))];
-}
diff --git a/src/plugins/kibana_usage_collection/server/collectors/ui_metric/telemetry_ui_metric_collector.ts b/src/plugins/kibana_usage_collection/server/collectors/ui_metric/telemetry_ui_metric_collector.ts
index 46768813b1970..9c02a9cbf3204 100644
--- a/src/plugins/kibana_usage_collection/server/collectors/ui_metric/telemetry_ui_metric_collector.ts
+++ b/src/plugins/kibana_usage_collection/server/collectors/ui_metric/telemetry_ui_metric_collector.ts
@@ -23,7 +23,6 @@ import {
   SavedObjectsServiceSetup,
 } from 'kibana/server';
 import { UsageCollectionSetup } from 'src/plugins/usage_collection/server';
-import { findAll } from '../find_all';
 
 interface UIMetricsSavedObjects extends SavedObjectAttributes {
   count: number;
@@ -55,9 +54,10 @@ export function registerUiMetricUsageCollector(
         return;
       }
 
-      const rawUiMetrics = await findAll<UIMetricsSavedObjects>(savedObjectsClient, {
+      const { saved_objects: rawUiMetrics } = await savedObjectsClient.find<UIMetricsSavedObjects>({
         type: 'ui-metric',
         fields: ['count'],
+        perPage: 10000,
       });
 
       const uiMetricsByAppName = rawUiMetrics.reduce((accum, rawUiMetric) => {
diff --git a/src/plugins/kibana_usage_collection/server/plugin.ts b/src/plugins/kibana_usage_collection/server/plugin.ts
index d4295c770803e..260acd19ab516 100644
--- a/src/plugins/kibana_usage_collection/server/plugin.ts
+++ b/src/plugins/kibana_usage_collection/server/plugin.ts
@@ -30,6 +30,7 @@ import {
   CoreStart,
   SavedObjectsServiceSetup,
   OpsMetrics,
+  Logger,
 } from '../../../core/server';
 import {
   registerApplicationUsageCollector,
@@ -47,12 +48,14 @@ interface KibanaUsageCollectionPluginsDepsSetup {
 type SavedObjectsRegisterType = SavedObjectsServiceSetup['registerType'];
 
 export class KibanaUsageCollectionPlugin implements Plugin {
+  private readonly logger: Logger;
   private readonly legacyConfig$: Observable<SharedGlobalConfig>;
   private savedObjectsClient?: ISavedObjectsRepository;
   private uiSettingsClient?: IUiSettingsClient;
   private metric$: Subject<OpsMetrics>;
 
   constructor(initializerContext: PluginInitializerContext) {
+    this.logger = initializerContext.logger.get();
     this.legacyConfig$ = initializerContext.config.legacy.globalConfig$;
     this.metric$ = new Subject<OpsMetrics>();
   }
@@ -88,7 +91,12 @@ export class KibanaUsageCollectionPlugin implements Plugin {
     registerKibanaUsageCollector(usageCollection, this.legacyConfig$);
     registerManagementUsageCollector(usageCollection, getUiSettingsClient);
     registerUiMetricUsageCollector(usageCollection, registerType, getSavedObjectsClient);
-    registerApplicationUsageCollector(usageCollection, registerType, getSavedObjectsClient);
+    registerApplicationUsageCollector(
+      this.logger.get('application-usage'),
+      usageCollection,
+      registerType,
+      getSavedObjectsClient
+    );
     registerCspCollector(usageCollection, coreSetup.http);
   }
 }
diff --git a/test/api_integration/apis/telemetry/telemetry_local.js b/test/api_integration/apis/telemetry/telemetry_local.js
index d2d61705b763d..9a5467e622ff3 100644
--- a/test/api_integration/apis/telemetry/telemetry_local.js
+++ b/test/api_integration/apis/telemetry/telemetry_local.js
@@ -154,5 +154,113 @@ export default function ({ getService }) {
 
       expect(expected.every((m) => actual.includes(m))).to.be.ok();
     });
+
+    describe('application usage limits', () => {
+      const timeRange = {
+        min: '2018-07-23T22:07:00Z',
+        max: '2018-07-23T22:13:00Z',
+      };
+
+      function createSavedObject() {
+        return supertest
+          .post('/api/saved_objects/application_usage_transactional')
+          .send({
+            attributes: {
+              appId: 'test-app',
+              minutesOnScreen: 10.99,
+              numberOfClicks: 10,
+              timestamp: new Date().toISOString(),
+            },
+          })
+          .expect(200)
+          .then((resp) => resp.body.id);
+      }
+
+      describe('basic behaviour', () => {
+        let savedObjectId;
+        before('create 1 entry', async () => {
+          return createSavedObject().then((id) => (savedObjectId = id));
+        });
+        after('cleanup', () => {
+          return supertest
+            .delete(`/api/saved_objects/application_usage_transactional/${savedObjectId}`)
+            .expect(200);
+        });
+
+        it('should return application_usage data', async () => {
+          const { body } = await supertest
+            .post('/api/telemetry/v2/clusters/_stats')
+            .set('kbn-xsrf', 'xxx')
+            .send({ timeRange, unencrypted: true })
+            .expect(200);
+
+          expect(body.length).to.be(1);
+          const stats = body[0];
+          expect(stats.stack_stats.kibana.plugins.application_usage).to.eql({
+            'test-app': {
+              clicks_total: 10,
+              clicks_7_days: 10,
+              clicks_30_days: 10,
+              clicks_90_days: 10,
+              minutes_on_screen_total: 10.99,
+              minutes_on_screen_7_days: 10.99,
+              minutes_on_screen_30_days: 10.99,
+              minutes_on_screen_90_days: 10.99,
+            },
+          });
+        });
+      });
+
+      describe('10k + 1', () => {
+        const savedObjectIds = [];
+        before('create 10k + 1 entries for application usage', async () => {
+          await supertest
+            .post('/api/saved_objects/_bulk_create')
+            .send(
+              new Array(10001).fill(0).map(() => ({
+                type: 'application_usage_transactional',
+                attributes: {
+                  appId: 'test-app',
+                  minutesOnScreen: 1,
+                  numberOfClicks: 1,
+                  timestamp: new Date().toISOString(),
+                },
+              }))
+            )
+            .expect(200)
+            .then((resp) => resp.body.saved_objects.forEach(({ id }) => savedObjectIds.push(id)));
+        });
+        after('clean them all', async () => {
+          // The SavedObjects API does not allow bulk deleting, and deleting one by one takes ages and the tests timeout
+          await es.deleteByQuery({
+            index: '.kibana',
+            body: { query: { term: { type: 'application_usage_transactional' } } },
+          });
+        });
+
+        it("should only use the first 10k docs for the application_usage data (they'll be rolled up in a later process)", async () => {
+          const { body } = await supertest
+            .post('/api/telemetry/v2/clusters/_stats')
+            .set('kbn-xsrf', 'xxx')
+            .send({ timeRange, unencrypted: true })
+            .expect(200);
+
+          expect(body.length).to.be(1);
+          const stats = body[0];
+          expect(stats.stack_stats.kibana.plugins.application_usage).to.eql({
+            'test-app': {
+              clicks_total: 10000,
+              clicks_7_days: 10000,
+              clicks_30_days: 10000,
+              clicks_90_days: 10000,
+              minutes_on_screen_total: 10000,
+              minutes_on_screen_7_days: 10000,
+              minutes_on_screen_30_days: 10000,
+              minutes_on_screen_90_days: 10000,
+            },
+          });
+        });
+      });
+    });
   });
 }

From 3688df286a146d6fc82ffac70417b09db05030e9 Mon Sep 17 00:00:00 2001
From: Shahzad <shahzad.muhammad@elastic.co>
Date: Wed, 16 Sep 2020 21:20:45 +0200
Subject: [PATCH 02/19] [RUM Dashboard] Handle invalid service name param
 (#77163)

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
---
 .../apm/e2e/cypress/integration/helpers.ts    |  9 ++++++--
 .../step_definitions/csm/csm_dashboard.ts     | 12 ++++++----
 x-pack/plugins/apm/e2e/yarn.lock              |  8 +++----
 .../app/RumDashboard/ClientMetrics/index.tsx  |  3 ++-
 .../ServiceNameFilter/index.tsx               | 22 ++++++++++++++-----
 5 files changed, 38 insertions(+), 16 deletions(-)

diff --git a/x-pack/plugins/apm/e2e/cypress/integration/helpers.ts b/x-pack/plugins/apm/e2e/cypress/integration/helpers.ts
index 1956f1c2d9f0d..462304a959102 100644
--- a/x-pack/plugins/apm/e2e/cypress/integration/helpers.ts
+++ b/x-pack/plugins/apm/e2e/cypress/integration/helpers.ts
@@ -11,14 +11,19 @@ export const DEFAULT_TIMEOUT = 60 * 1000;
 
 export function loginAndWaitForPage(
   url: string,
-  dateRange: { to: string; from: string }
+  dateRange: { to: string; from: string },
+  selectedService?: string
 ) {
   const username = Cypress.env('elasticsearch_username');
   const password = Cypress.env('elasticsearch_password');
 
   cy.log(`Authenticating via ${username} / ${password}`);
 
-  const fullUrl = `${BASE_URL}${url}?rangeFrom=${dateRange.from}&rangeTo=${dateRange.to}`;
+  let fullUrl = `${BASE_URL}${url}?rangeFrom=${dateRange.from}&rangeTo=${dateRange.to}`;
+
+  if (selectedService) {
+    fullUrl += `&serviceName=${selectedService}`;
+  }
   cy.visit(fullUrl, { auth: { username, password } });
 
   cy.viewport('macbook-15');
diff --git a/x-pack/plugins/apm/e2e/cypress/support/step_definitions/csm/csm_dashboard.ts b/x-pack/plugins/apm/e2e/cypress/support/step_definitions/csm/csm_dashboard.ts
index a57241a197ca4..461e2960c5e02 100644
--- a/x-pack/plugins/apm/e2e/cypress/support/step_definitions/csm/csm_dashboard.ts
+++ b/x-pack/plugins/apm/e2e/cypress/support/step_definitions/csm/csm_dashboard.ts
@@ -15,10 +15,14 @@ Given(`a user browses the APM UI application for RUM Data`, () => {
   // open service overview page
   const RANGE_FROM = 'now-24h';
   const RANGE_TO = 'now';
-  loginAndWaitForPage(`/app/csm`, {
-    from: RANGE_FROM,
-    to: RANGE_TO,
-  });
+  loginAndWaitForPage(
+    `/app/csm`,
+    {
+      from: RANGE_FROM,
+      to: RANGE_TO,
+    },
+    'client'
+  );
 });
 
 Then(`should have correct client metrics`, () => {
diff --git a/x-pack/plugins/apm/e2e/yarn.lock b/x-pack/plugins/apm/e2e/yarn.lock
index 936294052aa7b..fc63189e97ea3 100644
--- a/x-pack/plugins/apm/e2e/yarn.lock
+++ b/x-pack/plugins/apm/e2e/yarn.lock
@@ -5494,10 +5494,10 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
-typescript@3.9.6:
-  version "3.9.6"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.9.6.tgz#8f3e0198a34c3ae17091b35571d3afd31999365a"
-  integrity sha512-Pspx3oKAPJtjNwE92YS05HQoY7z2SFyOpHo9MqJor3BXAGNaPUs83CuVp9VISFkSjyRfiTpmKuAYGJB7S7hOxw==
+typescript@4.0.2:
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.0.2.tgz#7ea7c88777c723c681e33bf7988be5d008d05ac2"
+  integrity sha512-e4ERvRV2wb+rRZ/IQeb3jm2VxBsirQLpQhdxplZ2MEzGvDkkMmPglecnNDfSUBivMjP93vRbngYYDQqQ/78bcQ==
 
 umd@^3.0.0:
   version "3.0.3"
diff --git a/x-pack/plugins/apm/public/components/app/RumDashboard/ClientMetrics/index.tsx b/x-pack/plugins/apm/public/components/app/RumDashboard/ClientMetrics/index.tsx
index f54a54211359c..1edfd724dadd7 100644
--- a/x-pack/plugins/apm/public/components/app/RumDashboard/ClientMetrics/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/RumDashboard/ClientMetrics/index.tsx
@@ -26,7 +26,8 @@ export function ClientMetrics() {
 
   const { data, status } = useFetcher(
     (callApmApi) => {
-      if (start && end) {
+      const { serviceName } = uiFilters;
+      if (start && end && serviceName) {
         return callApmApi({
           pathname: '/api/apm/rum/client-metrics',
           params: {
diff --git a/x-pack/plugins/apm/public/components/shared/LocalUIFilters/ServiceNameFilter/index.tsx b/x-pack/plugins/apm/public/components/shared/LocalUIFilters/ServiceNameFilter/index.tsx
index 3deba69a25df2..cbf9ba009dce2 100644
--- a/x-pack/plugins/apm/public/components/shared/LocalUIFilters/ServiceNameFilter/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/LocalUIFilters/ServiceNameFilter/index.tsx
@@ -24,7 +24,7 @@ interface Props {
 function ServiceNameFilter({ loading, serviceNames }: Props) {
   const history = useHistory();
   const {
-    urlParams: { serviceName },
+    urlParams: { serviceName: selectedServiceName },
   } = useUrlParams();
 
   const options = serviceNames.map((type) => ({
@@ -47,10 +47,22 @@ function ServiceNameFilter({ loading, serviceNames }: Props) {
   );
 
   useEffect(() => {
-    if (!serviceName && serviceNames.length > 0) {
-      updateServiceName(serviceNames[0]);
+    if (serviceNames?.length > 0) {
+      // select first from the list
+      if (!selectedServiceName) {
+        updateServiceName(serviceNames[0]);
+      }
+
+      // in case serviceName is cached from url and isn't present in current list
+      if (selectedServiceName && !serviceNames.includes(selectedServiceName)) {
+        updateServiceName(serviceNames[0]);
+      }
+    }
+
+    if (selectedServiceName && serviceNames.length === 0 && !loading) {
+      updateServiceName('');
     }
-  }, [serviceNames, serviceName, updateServiceName]);
+  }, [serviceNames, selectedServiceName, updateServiceName, loading]);
 
   return (
     <>
@@ -68,7 +80,7 @@ function ServiceNameFilter({ loading, serviceNames }: Props) {
         isLoading={loading}
         data-cy="serviceNameFilter"
         options={options}
-        value={serviceName}
+        value={selectedServiceName}
         compressed={true}
         onChange={(event) => {
           updateServiceName(event.target.value);

From 17fec25e3c281b4f66e5973efbaef0368b9152c5 Mon Sep 17 00:00:00 2001
From: Jonathan Buttner <56361221+jonathan-buttner@users.noreply.github.com>
Date: Wed, 16 Sep 2020 15:28:30 -0400
Subject: [PATCH 03/19] [Security Solution] Refactor resolver children _source
 (#77343)

* Moving generator to safe type version

* Finished generator and alert

* Gzipping again

* Finishing type conversions for backend

* Trying to cast front end tests back to unsafe type for now

* Working reducer tests

* Adding more comments and fixing alert type

* Restoring resolver test data

* Updating snapshot with timestamp info

* Getting the models figured out

* Event models type fixes

* Adding more comments

* Fixing more comments

* Adding comments
---
 .../common/endpoint/models/event.ts           | 176 ++++++++++++++++--
 .../routes/resolver/queries/children.ts       |  68 ++++++-
 .../routes/resolver/utils/children_helper.ts  |  10 +-
 .../resolver/utils/children_pagination.ts     |   4 +-
 .../utils/children_start_query_handler.ts     |   5 +-
 5 files changed, 229 insertions(+), 34 deletions(-)

diff --git a/x-pack/plugins/security_solution/common/endpoint/models/event.ts b/x-pack/plugins/security_solution/common/endpoint/models/event.ts
index 07208214a641a..9634659b1a5dd 100644
--- a/x-pack/plugins/security_solution/common/endpoint/models/event.ts
+++ b/x-pack/plugins/security_solution/common/endpoint/models/event.ts
@@ -3,20 +3,24 @@
  * or more contributor license agreements. Licensed under the Elastic License;
  * you may not use this file except in compliance with the Elastic License.
  */
-import {
-  LegacyEndpointEvent,
-  ResolverEvent,
-  SafeResolverEvent,
-  SafeLegacyEndpointEvent,
-} from '../types';
+import { LegacyEndpointEvent, ResolverEvent, SafeResolverEvent, ECSField } from '../types';
 import { firstNonNullValue, hasValue, values } from './ecs_safety_helpers';
 
+/**
+ * Legacy events will define the `endgame` object. This is used to narrow a ResolverEvent.
+ */
+interface LegacyEvent {
+  endgame?: object;
+}
+
 /*
- * Determine if a `ResolverEvent` is the legacy variety. Can be used to narrow `ResolverEvent` to `LegacyEndpointEvent`.
+ * Determine if a higher level event type is the legacy variety. Can be used to narrow an event type.
+ * T optionally defines an `endgame` object field used for determining the type of event. If T doesn't contain the
+ * `endgame` field it will serve as the narrowed type.
  */
-export function isLegacyEventSafeVersion(
-  event: SafeResolverEvent
-): event is SafeLegacyEndpointEvent {
+export function isLegacyEventSafeVersion<T extends LegacyEvent>(
+  event: LegacyEvent | {}
+): event is T {
   return 'endgame' in event && event.endgame !== undefined;
 }
 
@@ -27,7 +31,30 @@ export function isLegacyEvent(event: ResolverEvent): event is LegacyEndpointEven
   return (event as LegacyEndpointEvent).endgame !== undefined;
 }
 
-export function isProcessRunning(event: SafeResolverEvent): boolean {
+/**
+ * Minimum fields needed from the `SafeResolverEvent` type for the function below to operate correctly.
+ */
+type ProcessRunningFields = Partial<
+  | {
+      endgame: object;
+      event: Partial<{
+        type: ECSField<string>;
+        action: ECSField<string>;
+      }>;
+    }
+  | {
+      event: Partial<{
+        type: ECSField<string>;
+      }>;
+    }
+>;
+
+/**
+ * Checks if an event describes a process as running (whether it was started, already running, or changed)
+ *
+ * @param event a document to check for running fields
+ */
+export function isProcessRunning(event: ProcessRunningFields): boolean {
   if (isLegacyEventSafeVersion(event)) {
     return (
       hasValue(event.event?.type, 'process_start') ||
@@ -43,7 +70,18 @@ export function isProcessRunning(event: SafeResolverEvent): boolean {
   );
 }
 
-export function timestampSafeVersion(event: SafeResolverEvent): undefined | number {
+/**
+ * Minimum fields needed from the `SafeResolverEvent` type for the function below to operate correctly.
+ */
+type TimestampFields = Pick<SafeResolverEvent, '@timestamp'>;
+
+/**
+ * Extracts the first non null value from the `@timestamp` field in the document. Returns undefined if the field doesn't
+ * exist in the document.
+ *
+ * @param event a document from ES
+ */
+export function timestampSafeVersion(event: TimestampFields): undefined | number {
   return firstNonNullValue(event?.['@timestamp']);
 }
 
@@ -51,7 +89,7 @@ export function timestampSafeVersion(event: SafeResolverEvent): undefined | numb
  * The `@timestamp` for the event, as a `Date` object.
  * If `@timestamp` couldn't be parsed as a `Date`, returns `undefined`.
  */
-export function timestampAsDateSafeVersion(event: SafeResolverEvent): Date | undefined {
+export function timestampAsDateSafeVersion(event: TimestampFields): Date | undefined {
   const value = timestampSafeVersion(event);
   if (value === undefined) {
     return undefined;
@@ -93,9 +131,30 @@ export function eventId(event: ResolverEvent): number | undefined | string {
   return event.event.id;
 }
 
-export function eventSequence(event: SafeResolverEvent): number | undefined {
+/**
+ * Minimum fields needed from the `SafeResolverEvent` type for the function below to operate correctly.
+ */
+type EventSequenceFields = Partial<
+  | {
+      endgame: Partial<{
+        serial_event_id: ECSField<number>;
+      }>;
+    }
+  | {
+      event: Partial<{
+        sequence: ECSField<number>;
+      }>;
+    }
+>;
+
+/**
+ * Extract the first non null event sequence value from a document. Returns undefined if the field doesn't exist in the document.
+ *
+ * @param event a document from ES
+ */
+export function eventSequence(event: EventSequenceFields): number | undefined {
   if (isLegacyEventSafeVersion(event)) {
-    return firstNonNullValue(event.endgame.serial_event_id);
+    return firstNonNullValue(event.endgame?.serial_event_id);
   }
   return firstNonNullValue(event.event?.sequence);
 }
@@ -113,7 +172,29 @@ export function entityId(event: ResolverEvent): string {
   return event.process.entity_id;
 }
 
-export function entityIDSafeVersion(event: SafeResolverEvent): string | undefined {
+/**
+ * Minimum fields needed from the `SafeResolverEvent` type for the function below to operate correctly.
+ */
+type EntityIDFields = Partial<
+  | {
+      endgame: Partial<{
+        unique_pid: ECSField<number>;
+      }>;
+    }
+  | {
+      process: Partial<{
+        entity_id: ECSField<string>;
+      }>;
+    }
+>;
+
+/**
+ * Extract the first non null value from either the `entity_id` or `unique_pid` depending on the document type. Returns
+ * undefined if the field doesn't exist in the document.
+ *
+ * @param event a document from ES
+ */
+export function entityIDSafeVersion(event: EntityIDFields): string | undefined {
   if (isLegacyEventSafeVersion(event)) {
     return event.endgame?.unique_pid === undefined
       ? undefined
@@ -130,14 +211,59 @@ export function parentEntityId(event: ResolverEvent): string | undefined {
   return event.process.parent?.entity_id;
 }
 
-export function parentEntityIDSafeVersion(event: SafeResolverEvent): string | undefined {
+/**
+ * Minimum fields needed from the `SafeResolverEvent` type for the function below to operate correctly.
+ */
+type ParentEntityIDFields = Partial<
+  | {
+      endgame: Partial<{
+        unique_ppid: ECSField<number>;
+      }>;
+    }
+  | {
+      process: Partial<{
+        parent: Partial<{
+          entity_id: ECSField<string>;
+        }>;
+      }>;
+    }
+>;
+
+/**
+ * Extract the first non null value from either the `parent.entity_id` or `unique_ppid` depending on the document type. Returns
+ * undefined if the field doesn't exist in the document.
+ *
+ * @param event a document from ES
+ */
+export function parentEntityIDSafeVersion(event: ParentEntityIDFields): string | undefined {
   if (isLegacyEventSafeVersion(event)) {
-    return String(firstNonNullValue(event.endgame.unique_ppid));
+    return String(firstNonNullValue(event.endgame?.unique_ppid));
   }
   return firstNonNullValue(event.process?.parent?.entity_id);
 }
 
-export function ancestryArray(event: SafeResolverEvent): string[] | undefined {
+/**
+ * Minimum fields needed from the `SafeResolverEvent` type for the function below to operate correctly.
+ */
+type AncestryArrayFields = Partial<
+  | {
+      endgame: object;
+    }
+  | {
+      process: Partial<{
+        Ext: Partial<{
+          ancestry: ECSField<string>;
+        }>;
+      }>;
+    }
+>;
+
+/**
+ * Extracts all ancestry array from a document if it exists.
+ *
+ * @param event an ES document
+ */
+export function ancestryArray(event: AncestryArrayFields): string[] | undefined {
   if (isLegacyEventSafeVersion(event)) {
     return undefined;
   }
@@ -146,7 +272,17 @@ export function ancestryArray(event: SafeResolverEvent): string[] | undefined {
   return values(event.process?.Ext?.ancestry);
 }
 
-export function getAncestryAsArray(event: SafeResolverEvent | undefined): string[] {
+/**
+ * Minimum fields needed from the `SafeResolverEvent` type for the function below to operate correctly.
+ */
+type GetAncestryArrayFields = AncestryArrayFields & ParentEntityIDFields;
+
+/**
+ * Returns an array of strings representing the ancestry for a process.
+ *
+ * @param event an ES document
+ */
+export function getAncestryAsArray(event: GetAncestryArrayFields | undefined): string[] {
   if (!event) {
     return [];
   }
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/resolver/queries/children.ts b/x-pack/plugins/security_solution/server/endpoint/routes/resolver/queries/children.ts
index 8c7daf9451217..4c7be9b8d5a24 100644
--- a/x-pack/plugins/security_solution/server/endpoint/routes/resolver/queries/children.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/resolver/queries/children.ts
@@ -4,15 +4,59 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 import { SearchResponse } from 'elasticsearch';
-import { SafeResolverEvent } from '../../../../../common/endpoint/types';
+import { ECSField } from '../../../../../common/endpoint/types';
 import { ResolverQuery } from './base';
 import { ChildrenPaginationBuilder } from '../utils/children_pagination';
 import { JsonObject } from '../../../../../../../../src/plugins/kibana_utils/common';
 
+/**
+ * This type represents the document returned from ES for a legacy event when using the ChildrenQuery to fetch legacy events.
+ * It contains only the necessary fields that the children api needs to process the results before
+ * it requests the full lifecycle information for the children in a later query.
+ */
+export type LegacyChildEvent = Partial<{
+  '@timestamp': ECSField<number>;
+  event: Partial<{
+    type: ECSField<string>;
+    action: ECSField<string>;
+  }>;
+  endgame: Partial<{
+    serial_event_id: ECSField<number>;
+    unique_pid: ECSField<number>;
+    unique_ppid: ECSField<number>;
+  }>;
+}>;
+
+/**
+ * This type represents the document returned from ES for an event when using the ChildrenQuery to fetch legacy events.
+ * It contains only the necessary fields that the children api needs to process the results before
+ * it requests the full lifecycle information for the children in a later query.
+ */
+export type EndpointChildEvent = Partial<{
+  '@timestamp': ECSField<number>;
+  event: Partial<{
+    type: ECSField<string>;
+    sequence: ECSField<number>;
+  }>;
+  process: Partial<{
+    entity_id: ECSField<string>;
+    parent: Partial<{
+      entity_id: ECSField<string>;
+    }>;
+    Ext: Partial<{
+      ancestry: ECSField<string>;
+    }>;
+  }>;
+}>;
+
+export type ChildEvent = EndpointChildEvent | LegacyChildEvent;
+
 /**
  * Builds a query for retrieving descendants of a node.
+ * The first type `ChildEvent[]` represents the final formatted result. The second type `ChildEvent` defines the type
+ * used in the `SearchResponse<T>` field returned from the ES query.
  */
-export class ChildrenQuery extends ResolverQuery<SafeResolverEvent[]> {
+export class ChildrenQuery extends ResolverQuery<ChildEvent[], ChildEvent> {
   constructor(
     private readonly pagination: ChildrenPaginationBuilder,
     indexPattern: string | string[],
@@ -24,6 +68,14 @@ export class ChildrenQuery extends ResolverQuery<SafeResolverEvent[]> {
   protected legacyQuery(endpointID: string, uniquePIDs: string[]): JsonObject {
     const paginationFields = this.pagination.buildQueryFields('endgame.serial_event_id');
     return {
+      _source: [
+        '@timestamp',
+        'endgame.serial_event_id',
+        'endgame.unique_pid',
+        'endgame.unique_ppid',
+        'event.type',
+        'event.action',
+      ],
       collapse: {
         field: 'endgame.unique_pid',
       },
@@ -64,8 +116,18 @@ export class ChildrenQuery extends ResolverQuery<SafeResolverEvent[]> {
   }
 
   protected query(entityIDs: string[]): JsonObject {
+    // we don't have to include the `event.id` in the source response because it is not needed for processing
+    // the data returned by ES, it is only used for breaking ties when ES is doing the search
     const paginationFields = this.pagination.buildQueryFields('event.id');
     return {
+      _source: [
+        '@timestamp',
+        'event.type',
+        'event.sequence',
+        'process.entity_id',
+        'process.parent.entity_id',
+        'process.Ext.ancestry',
+      ],
       /**
        * Using collapse here will only return a single event per occurrence of a process.entity_id. The events are sorted
        * based on timestamp in ascending order so it will be the first event that ocurred. The actual type of event that
@@ -126,7 +188,7 @@ export class ChildrenQuery extends ResolverQuery<SafeResolverEvent[]> {
     };
   }
 
-  formatResponse(response: SearchResponse<SafeResolverEvent>): SafeResolverEvent[] {
+  formatResponse(response: SearchResponse<ChildEvent>): ChildEvent[] {
     return this.getResults(response);
   }
 }
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_helper.ts b/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_helper.ts
index e9174548898dd..f54472141c1de 100644
--- a/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_helper.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_helper.ts
@@ -17,6 +17,7 @@ import {
 } from '../../../../../common/endpoint/types';
 import { createChild } from './node';
 import { ChildrenPaginationBuilder } from './children_pagination';
+import { ChildEvent } from '../queries/children';
 
 /**
  * This class helps construct the children structure when building a resolver tree.
@@ -86,15 +87,12 @@ export class ChildrenNodesHelper {
    * @param queriedNodes the entity_ids of the nodes that returned these start events
    * @param startEvents an array of start events returned by ES
    */
-  addStartEvents(
-    queriedNodes: Set<string>,
-    startEvents: SafeResolverEvent[]
-  ): Set<string> | undefined {
+  addStartEvents(queriedNodes: Set<string>, startEvents: ChildEvent[]): Set<string> | undefined {
     let largestAncestryArray = 0;
     const nodesToQueryNext: Map<number, Set<string>> = new Map();
     const nonLeafNodes: Set<SafeResolverChildNode> = new Set();
 
-    const isDistantGrandchild = (event: SafeResolverEvent) => {
+    const isDistantGrandchild = (event: ChildEvent) => {
       const ancestry = getAncestryAsArray(event);
       return ancestry.length > 0 && queriedNodes.has(ancestry[ancestry.length - 1]);
     };
@@ -161,7 +159,7 @@ export class ChildrenNodesHelper {
     return nodesToQueryNext.get(largestAncestryArray);
   }
 
-  private setPaginationForNodes(nodes: Set<string>, startEvents: SafeResolverEvent[]) {
+  private setPaginationForNodes(nodes: Set<string>, startEvents: ChildEvent[]) {
     for (const nodeEntityID of nodes.values()) {
       const cachedNode = this.entityToNodeCache.get(nodeEntityID);
       if (cachedNode) {
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_pagination.ts b/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_pagination.ts
index 4cc8aaf42d12b..e202124554873 100644
--- a/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_pagination.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_pagination.ts
@@ -4,10 +4,10 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { SafeResolverEvent } from '../../../../../common/endpoint/types';
 import { eventSequence, timestampSafeVersion } from '../../../../../common/endpoint/models/event';
 import { JsonObject } from '../../../../../../../../src/plugins/kibana_utils/common';
 import { urlEncodeCursor, SortFields, urlDecodeCursor } from './pagination';
+import { ChildEvent } from '../queries/children';
 
 /**
  * Pagination information for the children class.
@@ -65,7 +65,7 @@ export class ChildrenPaginationBuilder {
    *
    * @param results the events that were returned by the ES query
    */
-  static buildCursor(results: SafeResolverEvent[]): string | null {
+  static buildCursor(results: ChildEvent[]): string | null {
     const lastResult = results[results.length - 1];
     const sequence = eventSequence(lastResult);
     const cursor = {
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_start_query_handler.ts b/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_start_query_handler.ts
index 327be8d3696fd..9f5f085d5b80d 100644
--- a/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_start_query_handler.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/resolver/utils/children_start_query_handler.ts
@@ -6,8 +6,7 @@
 
 import { SearchResponse } from 'elasticsearch';
 import { ILegacyScopedClusterClient } from 'kibana/server';
-import { SafeResolverEvent } from '../../../../../common/endpoint/types';
-import { ChildrenQuery } from '../queries/children';
+import { ChildEvent, ChildrenQuery } from '../queries/children';
 import { QueryInfo } from '../queries/multi_searcher';
 import { QueryHandler } from './fetch';
 import { ChildrenNodesHelper } from './children_helper';
@@ -46,7 +45,7 @@ export class ChildrenStartQueryHandler implements QueryHandler<ChildrenNodesHelp
     this.limitLeft = 0;
   }
 
-  private handleResponse = (response: SearchResponse<SafeResolverEvent>) => {
+  private handleResponse = (response: SearchResponse<ChildEvent>) => {
     const results = this.query.formatResponse(response);
     this.nodesToQuery = this.childrenHelper.addStartEvents(this.nodesToQuery, results) ?? new Set();
 

From 37527f94f343fdd48c0a4843f9a95325924a7040 Mon Sep 17 00:00:00 2001
From: Charlie Pichette <56399229+charlie-pichette@users.noreply.github.com>
Date: Wed, 16 Sep 2020 14:10:59 -0600
Subject: [PATCH 04/19] Validate href for reassign policy link (#77534)

---
 .../apps/endpoint/endpoint_list.ts                | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/x-pack/test/security_solution_endpoint/apps/endpoint/endpoint_list.ts b/x-pack/test/security_solution_endpoint/apps/endpoint/endpoint_list.ts
index 7485e5db20478..99689ca03603d 100644
--- a/x-pack/test/security_solution_endpoint/apps/endpoint/endpoint_list.ts
+++ b/x-pack/test/security_solution_endpoint/apps/endpoint/endpoint_list.ts
@@ -161,11 +161,18 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => {
           expect(endpointDetailTitleNew).to.equal(endpointDetailTitleInitial);
         });
 
-        // The integration does not work properly yet.  Skipping this test for now.
-        it.skip('navigates to ingest fleet when the Reassign Policy link is clicked', async () => {
+        // Just check the href link is correct - would need to load ingest data to validate the integration
+        it('navigates to ingest fleet when the Reassign Policy link is clicked', async () => {
+          // The prior test results in a tooltip. We need to move the mouse to clear it and allow the click
+          await (await testSubjects.find('hostnameCellLink')).moveMouseTo();
           await (await testSubjects.find('hostnameCellLink')).click();
-          await (await testSubjects.find('endpointDetailsLinkToIngest')).click();
-          await testSubjects.existOrFail('fleetAgentListTable');
+          const endpointDetailsLinkToIngestButton = await testSubjects.find(
+            'endpointDetailsLinkToIngest'
+          );
+          const hrefLink = await endpointDetailsLinkToIngestButton.getAttribute('href');
+          expect(hrefLink).to.contain(
+            '/app/ingestManager#/fleet/agents/023fa40c-411d-4188-a941-4147bfadd095/activity?openReassignFlyout=true'
+          );
         });
       });
 

From 4f0edbd160711711fe832bd488282eab6b8ee4cd Mon Sep 17 00:00:00 2001
From: IgorG <56408662+IgorGuz2000@users.noreply.github.com>
Date: Wed, 16 Sep 2020 16:16:20 -0400
Subject: [PATCH 05/19] Functional Test for Resolver fix (#77116)

* Final I hope check in for Resolver fix

* Fix click

* Fix click

* Fix click

* revert to select the first event

* Gzip Data file

* removed not zipped file

* striped Data file and gziped

* removed commented out delete indices

* Added query bar to select correct events

* removed commented out delete indices

* removed commented out delete indices

* removed commented out delete indices

* removed commented out delete indices

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
---
 .../endpoint/resolver_tree/data.json.gz       | Bin 0 -> 3488 bytes
 .../apps/endpoint/index.ts                    |   1 +
 .../apps/endpoint/resolver.ts                 | 197 ++++++++++++++++++
 .../test/security_solution_endpoint/config.ts |   4 +
 .../page_objects/hosts_page.ts                | 109 ++++++++++
 .../page_objects/index.ts                     |   2 +
 .../apis/data_stream_helper.ts                |   5 +
 7 files changed, 318 insertions(+)
 create mode 100644 x-pack/test/functional/es_archives/endpoint/resolver_tree/data.json.gz
 create mode 100644 x-pack/test/security_solution_endpoint/apps/endpoint/resolver.ts
 create mode 100644 x-pack/test/security_solution_endpoint/page_objects/hosts_page.ts

diff --git a/x-pack/test/functional/es_archives/endpoint/resolver_tree/data.json.gz b/x-pack/test/functional/es_archives/endpoint/resolver_tree/data.json.gz
new file mode 100644
index 0000000000000000000000000000000000000000..0c3e40ce6eb5434de0c3a91114d86724267f2998
GIT binary patch
literal 3488
zcmXYzc{~&TAIF`eWrYwUN93%D&DnBQu3SkZiiMFgM>L{C=FBadYwjyojv=9P6z0m&
z9J92nTyxBsV?Xu#{`-EsKcCO*{d&J1kLO1$mXkC2y@LZ2t1}`10de>D@n%{k+4)Zz
z3NU@&-Ur5%ka|CD+$C9=j%lh=)ZdCbJ%kU`&bb?15Ef44i0%xOXN1~KpGTNHIqvb@
zL>j7^e8=7B*M>nOgiPj(>Derjvj%pFug5avi6`3@2E-43?q%xb5ozpH`RwUvGfMJ2
zd-{!*^wfTvk?TMFh%}6)qu%A;QXLV?EV`OOPt~UV$t^3qRhl_gD+{%v39eBEx@26c
zgKS28d<tHBx7A{_1pj-!I)x>+gB(`KI8ZuYV)1^-pe>p*b?%ML#9Y9jndzTzTLp|b
zEqOi?O+s5syKUF6KD|i|qSdDVyYB}7vYKLI$W7C>td`Poc&l&13ES4)UC(yZle=Vn
z8(RO2Y3S$nay7-rl^+vB!h)AoPqsJPwKKHJ$4|v-zxSI8ifOM}v7aW+8FVE887rlS
zlt=viX=@zOTbdnL8t*=6h+j&IY3r)Arf8a(q$gV|94_Fly}f+f23ecb)i+D)wCa6u
zqqQ*G9v2r#r+8R2*o9>@nQl+EY7|vf>b9cbr7I$q+uiMcLHOcJrNj}^EEU<P5Te7#
zu5Z~&oTs^Hp4MecOT4L9YvdO36)51+6_HHz{@O&qrWEarZBPP7ub&R;EsryPH920=
zy%+5N4wO<C>L+b36SrU<x6Y<=FWQopjv1~f6znQWREEf@TKZ;BQFUZARk5a+3h`Iz
z_WhLW%LyzOgcY$QWyL1HMdP5!<rwMMWh-H^%uVwmZE~xJr`XJReJCn~diw2Im-Eip
zG!0x%P1i-8+Wa#S@>u|WdxYgeOd-%F^=E#5SpW?;AuFjM&)EUw@2r;Xc19v4Z@BoP
zFzPPOjPFwk^89d365~?Y)jM;zTlH@aOiX#o#oP5#@4B#0i4B=VzgxjIoTA8tAJ&X2
z$eFQa3J7#z`TP)nE{_=f`UD*Qq`mquq^Q!zR$^n&<Pk^qtS3eMyrb35XaZ2%*4^^$
znkDu}KqJZMl+D`IQej`b*{4!+_9dlsrje^NK8uLQ1W%%R$vy^xiO$@e${N%vxIN3#
z_bel~Py>0cm|c#?s3Uo+;a4e>lE6+g{oBskv_+T8J^f}4j<@sV0r1tkB+&s|4*~p%
z%#}rskbcUgwK@m#%%mc$oCCLwf7AQ}odml;vy^cisc5#DDic%j9ETlLdy!$h*%<3L
z8T#MD0w&#;i96m6UsaEsb^t-9p0(Feu{{&FrkWDGl8t|r$5UDoz0DAUKT}|;e_Y;0
zw2`7lWTyi7OM1R<nY7h>4#21>pPO*m>xP_x!@?&$Jr6}OGZ$5qB26<Ry!p5^={M)R
z1~PGV#d%a2iloRy!9k@@hqvlU^YUM~`I&i7c7u|M!)vc_&BOhsoBnR`rgX1AgJGer
z^_gTY#^GZ+r9X3}9SHq+L(o;}%C!IKi>w$F5NS1{YVlYkCRvsp(*prum<deC*Dr<Y
z1);wm-AC#I`VnZ!wzC-DAkrM7xW!|j4l_@Cn*U7b1L0H%GRjM5#3Gf`={Xa0qKgT7
zRONC+`VJC8g<z3FOS1357}Q>n4+`^um+|3XQ2^TgDDbEYE3-|A)8lc1NO2IHPqQ99
z$OOGe*r?0F?h3)kP>OgP7*nPK?&~0Yt}?I1OjM4s9^Ffg#(bpkIQ+;B`0!WxKb;BK
zu_df+qOL!NCn|sJgUJD9ZT+G@2^1gz4ZpL);Rv`$ze-44i&B();n#$eZWKJKuwtI)
zV7oBQis4kHE2A+RgeUj!qcCO502y0?$XL}N^Iw5Z$Wf!-bCPT{WbcLldy?x)b;V$D
zx^&EJY85B4YIObLm1vE@`^8q|D%PU`%sUA`yY(V9Inmhv8?ixv1EAY3LvW<jy`<yM
z7$)~bp-$$6O+sXq#+R9)QEn@S-ypm+snO`eVUOCntEN_8g_73D%h*}(S-`2Yi8@&k
zU{n-9R7L+!p7P{dSM+SB^aJmx(~q|pyo(<sQeWm(%O+D*$B4>nt8C(V)eW3dbXFl{
z#1jh70LIDRz)_H=dneU0pv773dk6b6mq^5k`}Pm6ic~i90z4xB7(2dlwH%NdrQX`M
z+@`lYekr1VyDe_`vq;K=imRk58oNw(pwI1{`cBu3-^}Hi6>>h-+CYNQwAS*xFCCV&
zC{;3b#s@koe%UC-=qYzelGbKPw)*OT*GQo9gq`=)ih(bmbc7M>>Vxl(CfBg0)s%>^
zxKNGDT1Ekg;0a_WI!a@?WUs(UvIu$sE}9cAbO^q5w?slaL&+ms4f}{BdNQRfc+>}n
z4|(UGT%4F<GSZ}`F&!j{96sapzyPLrs_bi>5A=h&k+`G&MM=z>F49v(E#ua9$$epi
zai`(epf57yCKc_ZInoxq-c*$?n%NM7*od;Lo2f18U7`$oq}js%81rbyA%Swvi3oxt
zRh&QA5cM)x^_XU77^Fr~>64`pub_}7=J?ebSM80m$jj!_MOZ#P?mP?esBrFMBEn9o
zhN7A|dELqVYo3|>!9i}+-L{12M_I=rNTPNz_)Gje;9ynjw4jsy)bZ{3{@40%T4qAt
zmHyiE&w;RG11k>X?`pljzRtg}?h@=GHske2(>C*XT1nGu9;4ObX*g%q1(R~FD)w(x
zX&$bpY!9EajpSt5Fxxd-5yu@AJ%7b1%#h~<9V1j4UxW0naY^4XHjDa{rvg!9wjubx
zl(zKmKd<)IIqqRkfS_Y|Eh^y0oya|V1(~00k?}fc-u`-Cs|O#;l%Dh9*VeB|r^nxY
zqpo{Lj-vkjgE5<|j<IFTviq?P%*?MzR7a^IVbXvLN`6j-w#83}Z=-7ZPY4b6s%j@I
zufXL}A;7()>Pr;g*BM4_*A8OCM_+i6sgZi~wH7hQQ=X@%*RD(ImwX%Rt)>FeHpXk%
zSRPRs-y3-HU|F5qH=7ro$5Z6PJ9U2yw#d(_yx8~F>U*9Arz1)fxz;;QbD+ps_z~%#
zsxR498a*-Z-;ra(n!n8EcQ?E*_1(d<5fnJn()jQPlia!{EL@z-FNr#OCgzMwHj?-|
z9Al(befsyNF~3GUd1b6zb$N{8ChB#Dh$|+GL5+MvhRj1Gv=Xe<_ks5grac>q$>*2h
zWPZvdKwV)Mqk&frv#{*6MoZv)(M<yOhi(n!t*{k<HhXU&O9H<!gofJ>#_k@2n)8|9
zP(kwnH%pRKTH}WWh$p5FR~3GTMxmC9;@X$n4$k%3zmEB1;IS^y=Fs=LIh;~=rMpj9
zsI8H_BH^7^ulG<0dRDdg7wa^OH*+JLc%fs~Kq0j>eWSpvLyB{D-c&$UiH6yTtW=NR
z->OkLV_r*_ddHyK$sV?IVQ~y3*{{SpMq+Psfi9GMCNNC*X(#@<X(R^?<*jd6dq`X_
zxW4*1eE;neZ@BZKXl~;0BGxk`zc<UUrxPvf%*&a}ZSe&l|I_9kP~}+V=NP?{$#t*<
zsvTvNWv%9{c|`XMzVxR98lf~+*<zzP2+Xrvvxi#}EENVjoKasr{px4u&92K!a{)7v
zbNL@7q1gg^YGO>F#aCz^Qj!;2?^jilFkR%B4r?y+Pz{gU?ZhAJ;Zi@EZT#M|z=p!N
z`>u673JNTA@=+0UXLoxn1^!B{h~rP=9b$50f-!-|Pk{Vy+J_m2Yj3}DuVw=64fJW}
zI7)!M1DQd>vFOy<myUpcjZ7eqD0GXQw*Y7WoI5*5X07E0t!3u`nu`6PLyim=7Z+hM
zj(?naCN$p9MOU6C6s2TUY6&eY&n3^UNEXyNueMflf2rAW7U$Pjc$s=GIlfNrq$c1W
z(lYO(_bjIg1wV!s900ppxsCQP`=x>WykMXkksB6Oo2yr9+8loBpJ-13Fs--=4#w!c
zNkBXH*c^4DHDL9m_AO?RM*`puVqo=A6ARrGwGRJ>Fd`pxI%O6KkjWZbaV4sWrC&#H
z9r3wG=ZMc=YG#}TNgqrUh;pZBvUx`g{7WxHD4|BYYYsR3Y#8b=yaOEi9!9(e0rO!|
z)A*pb$K7uGz?^f|7cR<#UQs`C{jZZ1Ah1AT6PCl4J|>p6<F!5FH~cW{r^j}+9qek`
zKG)wPTtWk9rXXqTJaHW(;>@6D0G$qS9zr*!ZyToWz8NXw{yDhWZKq~Y%z4<+-j!ph
zhS|;W>~c$ip)p|azZEQ^(Ytbx1c1bsg#v`4Jp_!8Zco3~k(V&Q49a|l-jJr&rn1~@
zD*jK?88EfDNeEW)aYWqX=|0{b_V})UVry~UZc@;{0L_vN@$5RKCbEdtng0T0_BTL&
zZrpyG1~N0W_xs23r!zj1*`b~_LLx2&fE>WFBM={Lc!aA?4&n-ktT-GIC(~f*9_VcY
zt)3HROXCa77({D-ZU(1Kl;Miw>v&1FBi#S}wV*eZI*y{g;;Qp_ldO4zEOA}`ike}q
z8?kDW!3L|i3^t6Yh2__PWP$0rEMO+kGxVljN9f;iGb5};LAbVkrEoNZ8CzI7`IMEJ
F>3`fB$teH;

literal 0
HcmV?d00001

diff --git a/x-pack/test/security_solution_endpoint/apps/endpoint/index.ts b/x-pack/test/security_solution_endpoint/apps/endpoint/index.ts
index ad1980cd7218b..c25233a0c82eb 100644
--- a/x-pack/test/security_solution_endpoint/apps/endpoint/index.ts
+++ b/x-pack/test/security_solution_endpoint/apps/endpoint/index.ts
@@ -30,5 +30,6 @@ export default function (providerContext: FtrProviderContext) {
     });
     loadTestFile(require.resolve('./endpoint_list'));
     loadTestFile(require.resolve('./policy_details'));
+    loadTestFile(require.resolve('./resolver'));
   });
 }
diff --git a/x-pack/test/security_solution_endpoint/apps/endpoint/resolver.ts b/x-pack/test/security_solution_endpoint/apps/endpoint/resolver.ts
new file mode 100644
index 0000000000000..725edb6d98198
--- /dev/null
+++ b/x-pack/test/security_solution_endpoint/apps/endpoint/resolver.ts
@@ -0,0 +1,197 @@
+/*
+ * 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 expect from '@kbn/expect';
+import { FtrProviderContext } from '../../ftr_provider_context';
+
+export default function ({ getPageObjects, getService }: FtrProviderContext) {
+  const pageObjects = getPageObjects(['common', 'timePicker', 'hosts', 'settings']);
+  const testSubjects = getService('testSubjects');
+  const esArchiver = getService('esArchiver');
+  const queryBar = getService('queryBar');
+
+  describe('Endpoint Event Resolver', function () {
+    before(async () => {
+      await esArchiver.load('endpoint/resolver_tree', { useCreate: true });
+      await pageObjects.hosts.navigateToSecurityHostsPage();
+      const fromTime = 'Jan 1, 2018 @ 00:00:00.000';
+      const toTime = 'now';
+      await pageObjects.timePicker.setAbsoluteRange(fromTime, toTime);
+      await queryBar.setQuery('event.dataset : endpoint.events.file');
+      await queryBar.submitQuery();
+      await (await testSubjects.find('draggable-content-host.name')).click();
+      await testSubjects.existOrFail('header-page-title');
+      await (await testSubjects.find('navigation-events')).click();
+      await testSubjects.existOrFail('events-viewer-panel');
+      await testSubjects.exists('investigate-in-resolver-button', { timeout: 4000 });
+      await (await testSubjects.findAll('investigate-in-resolver-button'))[0].click();
+    });
+
+    after(async () => {
+      await pageObjects.hosts.deleteDataStreams();
+    });
+
+    it('check that Resolver and Data table is loaded', async () => {
+      await testSubjects.existOrFail('resolver:graph');
+      await testSubjects.existOrFail('tableHeaderCell_name_0');
+      await testSubjects.existOrFail('tableHeaderCell_timestamp_1');
+    });
+
+    it('compare resolver Nodes Table data and Data length', async () => {
+      const nodeData: string[] = [];
+      const TableData: string[] = [];
+
+      const Table = await testSubjects.findAll('resolver:node-list:item');
+      for (const value of Table) {
+        const text = await value._webElement.getText();
+        TableData.push(text.split('\n')[0]);
+      }
+      await (await testSubjects.find('resolver:graph-controls:zoom-out')).click();
+      const Nodes = await testSubjects.findAll('resolver:node:primary-button');
+      for (const value of Nodes) {
+        nodeData.push(await value._webElement.getText());
+      }
+      for (let i = 0; i < nodeData.length; i++) {
+        expect(TableData[i]).to.eql(nodeData[i]);
+      }
+      expect(nodeData.length).to.eql(TableData.length);
+      await (await testSubjects.find('resolver:graph-controls:zoom-in')).click();
+    });
+
+    it('resolver Nodes navigation Up', async () => {
+      const OriginalNodeDataStyle = await pageObjects.hosts.parseStyles();
+      await (await testSubjects.find('resolver:graph-controls:north-button')).click();
+
+      const NewNodeDataStyle = await pageObjects.hosts.parseStyles();
+      for (let i = 0; i < OriginalNodeDataStyle.length; i++) {
+        expect(parseFloat(OriginalNodeDataStyle[i].top)).to.lessThan(
+          parseFloat(NewNodeDataStyle[i].top)
+        );
+        expect(parseFloat(OriginalNodeDataStyle[i].left)).to.equal(
+          parseFloat(NewNodeDataStyle[i].left)
+        );
+      }
+      await (await testSubjects.find('resolver:graph-controls:center-button')).click();
+    });
+
+    it('resolver Nodes navigation Down', async () => {
+      const OriginalNodeDataStyle = await pageObjects.hosts.parseStyles();
+      await (await testSubjects.find('resolver:graph-controls:south-button')).click();
+
+      const NewNodeDataStyle = await pageObjects.hosts.parseStyles();
+      for (let i = 0; i < NewNodeDataStyle.length; i++) {
+        expect(parseFloat(NewNodeDataStyle[i].top)).to.lessThan(
+          parseFloat(OriginalNodeDataStyle[i].top)
+        );
+        expect(parseFloat(OriginalNodeDataStyle[i].left)).to.equal(
+          parseFloat(NewNodeDataStyle[i].left)
+        );
+      }
+      await (await testSubjects.find('resolver:graph-controls:center-button')).click();
+    });
+
+    it('resolver Nodes navigation Left', async () => {
+      const OriginalNodeDataStyle = await pageObjects.hosts.parseStyles();
+      await (await testSubjects.find('resolver:graph-controls:east-button')).click();
+
+      const NewNodeDataStyle = await pageObjects.hosts.parseStyles();
+      for (let i = 0; i < OriginalNodeDataStyle.length; i++) {
+        expect(parseFloat(NewNodeDataStyle[i].left)).to.lessThan(
+          parseFloat(OriginalNodeDataStyle[i].left)
+        );
+        expect(parseFloat(NewNodeDataStyle[i].top)).to.equal(
+          parseFloat(OriginalNodeDataStyle[i].top)
+        );
+      }
+      await (await testSubjects.find('resolver:graph-controls:center-button')).click();
+    });
+
+    it('resolver Nodes navigation Right', async () => {
+      const OriginalNodeDataStyle = await pageObjects.hosts.parseStyles();
+      await testSubjects.click('resolver:graph-controls:west-button');
+      const NewNodeDataStyle = await pageObjects.hosts.parseStyles();
+      for (let i = 0; i < NewNodeDataStyle.length; i++) {
+        expect(parseFloat(OriginalNodeDataStyle[i].left)).to.lessThan(
+          parseFloat(NewNodeDataStyle[i].left)
+        );
+        expect(parseFloat(NewNodeDataStyle[i].top)).to.equal(
+          parseFloat(OriginalNodeDataStyle[i].top)
+        );
+      }
+      await (await testSubjects.find('resolver:graph-controls:center-button')).click();
+    });
+
+    it('resolver Nodes navigation Center', async () => {
+      const OriginalNodeDataStyle = await pageObjects.hosts.parseStyles();
+      await (await testSubjects.find('resolver:graph-controls:east-button')).click();
+      await (await testSubjects.find('resolver:graph-controls:south-button')).click();
+
+      const NewNodeDataStyle = await pageObjects.hosts.parseStyles();
+      for (let i = 0; i < NewNodeDataStyle.length; i++) {
+        expect(parseFloat(NewNodeDataStyle[i].left)).to.lessThan(
+          parseFloat(OriginalNodeDataStyle[i].left)
+        );
+        expect(parseFloat(NewNodeDataStyle[i].top)).to.lessThan(
+          parseFloat(OriginalNodeDataStyle[i].top)
+        );
+      }
+      await (await testSubjects.find('resolver:graph-controls:center-button')).click();
+      const CenterNodeDataStyle = await pageObjects.hosts.parseStyles();
+
+      for (let i = 0; i < CenterNodeDataStyle.length; i++) {
+        expect(parseFloat(CenterNodeDataStyle[i].left)).to.equal(
+          parseFloat(OriginalNodeDataStyle[i].left)
+        );
+        expect(parseFloat(CenterNodeDataStyle[i].top)).to.equal(
+          parseFloat(OriginalNodeDataStyle[i].top)
+        );
+      }
+    });
+
+    it('resolver Nodes navigation zoom in', async () => {
+      const OriginalNodeDataStyle = await pageObjects.hosts.parseStyles();
+      await (await testSubjects.find('resolver:graph-controls:zoom-in')).click();
+
+      const NewNodeDataStyle = await pageObjects.hosts.parseStyles();
+      for (let i = 1; i < NewNodeDataStyle.length; i++) {
+        expect(parseFloat(NewNodeDataStyle[i].left)).to.lessThan(
+          parseFloat(OriginalNodeDataStyle[i].left)
+        );
+        expect(parseFloat(NewNodeDataStyle[i].top)).to.lessThan(
+          parseFloat(OriginalNodeDataStyle[i].top)
+        );
+        expect(parseFloat(OriginalNodeDataStyle[i].width)).to.lessThan(
+          parseFloat(NewNodeDataStyle[i].width)
+        );
+        expect(parseFloat(OriginalNodeDataStyle[i].height)).to.lessThan(
+          parseFloat(NewNodeDataStyle[i].height)
+        );
+        await (await testSubjects.find('resolver:graph-controls:zoom-out')).click();
+      }
+    });
+
+    it('resolver Nodes navigation zoom out', async () => {
+      const OriginalNodeDataStyle = await pageObjects.hosts.parseStyles();
+      await (await testSubjects.find('resolver:graph-controls:zoom-out')).click();
+      const NewNodeDataStyle1 = await pageObjects.hosts.parseStyles();
+      for (let i = 1; i < OriginalNodeDataStyle.length; i++) {
+        expect(parseFloat(OriginalNodeDataStyle[i].left)).to.lessThan(
+          parseFloat(NewNodeDataStyle1[i].left)
+        );
+        expect(parseFloat(OriginalNodeDataStyle[i].top)).to.lessThan(
+          parseFloat(NewNodeDataStyle1[i].top)
+        );
+        expect(parseFloat(NewNodeDataStyle1[i].width)).to.lessThan(
+          parseFloat(OriginalNodeDataStyle[i].width)
+        );
+        expect(parseFloat(NewNodeDataStyle1[i].height)).to.lessThan(
+          parseFloat(OriginalNodeDataStyle[i].height)
+        );
+      }
+      await (await testSubjects.find('resolver:graph-controls:zoom-in')).click();
+    });
+  });
+}
diff --git a/x-pack/test/security_solution_endpoint/config.ts b/x-pack/test/security_solution_endpoint/config.ts
index 5aa5e42ffd4ee..840862ab00560 100644
--- a/x-pack/test/security_solution_endpoint/config.ts
+++ b/x-pack/test/security_solution_endpoint/config.ts
@@ -30,6 +30,10 @@ export default async function ({ readConfigFile }: FtrConfigProviderContext) {
       ['securitySolutionManagement']: {
         pathname: '/app/security/administration',
       },
+      ...xpackFunctionalConfig.get('apps'),
+      ['security']: {
+        pathname: '/app/security',
+      },
     },
     kbnTestServer: {
       ...xpackFunctionalConfig.get('kbnTestServer'),
diff --git a/x-pack/test/security_solution_endpoint/page_objects/hosts_page.ts b/x-pack/test/security_solution_endpoint/page_objects/hosts_page.ts
new file mode 100644
index 0000000000000..c5f7d5b5fdf31
--- /dev/null
+++ b/x-pack/test/security_solution_endpoint/page_objects/hosts_page.ts
@@ -0,0 +1,109 @@
+/*
+ * 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 { FtrProviderContext } from '../ftr_provider_context';
+import { deleteEventsStream } from '../../security_solution_endpoint_api_int/apis/data_stream_helper';
+import { deleteAlertsStream } from '../../security_solution_endpoint_api_int/apis/data_stream_helper';
+import { deleteMetadataStream } from '../../security_solution_endpoint_api_int/apis/data_stream_helper';
+import { deletePolicyStream } from '../../security_solution_endpoint_api_int/apis/data_stream_helper';
+import { deleteTelemetryStream } from '../../security_solution_endpoint_api_int/apis/data_stream_helper';
+export interface DataStyle {
+  left: string;
+  top: string;
+  width: string;
+  height: string;
+}
+
+export function SecurityHostsPageProvider({ getService, getPageObjects }: FtrProviderContext) {
+  const pageObjects = getPageObjects(['common', 'header']);
+  const testSubjects = getService('testSubjects');
+
+  /**
+   * @function parseStyles
+   * Parses a string of inline styles into a typescript object with casing for react
+   * @param {string} styles
+   * @returns {Object}
+   */
+  const parseStyle = (
+    styles: string
+  ): {
+    left?: string;
+    top?: string;
+    width?: string;
+    height?: string;
+  } =>
+    styles
+      .split(';')
+      .filter((style: string) => style.split(':')[0] && style.split(':')[1])
+      .map((style: string) => [
+        style
+          .split(':')[0]
+          .trim()
+          .replace(/-./g, (c: string) => c.substr(1).toUpperCase()),
+        style.split(':').slice(1).join(':').trim(),
+      ])
+      .reduce(
+        (styleObj: {}, style: string[]) => ({
+          ...styleObj,
+          [style[0]]: style[1],
+        }),
+        {}
+      );
+  return {
+    /**
+     * Navigate to the Security Hosts page
+     */
+    async navigateToSecurityHostsPage() {
+      await pageObjects.common.navigateToUrlWithBrowserHistory('security', '/hosts/AllHosts');
+      await pageObjects.header.waitUntilLoadingHasFinished();
+    },
+    /**
+     * Finds a table and returns the data in a nested array with row 0 is the headers if they exist.
+     * It uses euiTableCellContent to avoid poluting the array data with the euiTableRowCell__mobileHeader data.
+     * @param dataTestSubj
+     * @param element
+     * @returns Promise<string[][]>
+     */
+    async getEndpointEventResolverNodeData(dataTestSubj: string, element: string) {
+      await testSubjects.exists(dataTestSubj);
+      const Elements = await testSubjects.findAll(dataTestSubj);
+      const $ = [];
+      for (const value of Elements) {
+        $.push(await value.getAttribute(element));
+      }
+      return $;
+    },
+
+    /**
+     * Gets a array of not parsed styles and returns the Array of parsed styles.
+     * @returns Promise<string[][]>
+     */
+    async parseStyles() {
+      const tableData = await this.getEndpointEventResolverNodeData('resolver:node', 'style');
+      const styles: DataStyle[] = [];
+      for (let i = 1; i < tableData.length; i++) {
+        const eachStyle = parseStyle(tableData[i]);
+        styles.push({
+          top: eachStyle.top ?? '',
+          height: eachStyle.height ?? '',
+          left: eachStyle.left ?? '',
+          width: eachStyle.width ?? '',
+        });
+      }
+      return styles;
+    },
+    /**
+     * Deletes DataStreams from Index Management.
+     */
+    async deleteDataStreams() {
+      await deleteEventsStream(getService);
+      await deleteAlertsStream(getService);
+      await deletePolicyStream(getService);
+      await deleteMetadataStream(getService);
+      await deleteTelemetryStream(getService);
+    },
+  };
+}
diff --git a/x-pack/test/security_solution_endpoint/page_objects/index.ts b/x-pack/test/security_solution_endpoint/page_objects/index.ts
index 39a9e7009c385..3664a2033d8b7 100644
--- a/x-pack/test/security_solution_endpoint/page_objects/index.ts
+++ b/x-pack/test/security_solution_endpoint/page_objects/index.ts
@@ -10,6 +10,7 @@ import { EndpointPolicyPageProvider } from './policy_page';
 import { TrustedAppsPageProvider } from './trusted_apps_page';
 import { EndpointPageUtils } from './page_utils';
 import { IngestManagerCreatePackagePolicy } from './ingest_manager_create_package_policy_page';
+import { SecurityHostsPageProvider } from './hosts_page';
 
 export const pageObjects = {
   ...xpackFunctionalPageObjects,
@@ -18,4 +19,5 @@ export const pageObjects = {
   trustedApps: TrustedAppsPageProvider,
   endpointPageUtils: EndpointPageUtils,
   ingestManagerCreatePackagePolicy: IngestManagerCreatePackagePolicy,
+  hosts: SecurityHostsPageProvider,
 };
diff --git a/x-pack/test/security_solution_endpoint_api_int/apis/data_stream_helper.ts b/x-pack/test/security_solution_endpoint_api_int/apis/data_stream_helper.ts
index be25f26532d9c..f1c05b2fc8f20 100644
--- a/x-pack/test/security_solution_endpoint_api_int/apis/data_stream_helper.ts
+++ b/x-pack/test/security_solution_endpoint_api_int/apis/data_stream_helper.ts
@@ -11,6 +11,7 @@ import {
   alertsIndexPattern,
   policyIndexPattern,
   metadataCurrentIndexPattern,
+  telemetryIndexPattern,
 } from '../../../plugins/security_solution/common/endpoint/constants';
 
 export async function deleteDataStream(getService: (serviceName: 'es') => Client, index: string) {
@@ -75,3 +76,7 @@ export async function deleteAlertsStream(getService: (serviceName: 'es') => Clie
 export async function deletePolicyStream(getService: (serviceName: 'es') => Client) {
   await deleteDataStream(getService, policyIndexPattern);
 }
+
+export async function deleteTelemetryStream(getService: (serviceName: 'es') => Client) {
+  await deleteDataStream(getService, telemetryIndexPattern);
+}

From c178c8abfffcd65452f70e5f7a03932cd7783417 Mon Sep 17 00:00:00 2001
From: Paul Tavares <56442535+paul-tavares@users.noreply.github.com>
Date: Wed, 16 Sep 2020 16:21:31 -0400
Subject: [PATCH 06/19] [SECURITY_SOLUTION][ENDPOINT] Create Trusted Apps UI
 Flow (#77076)

* Add UI for creating a new Trusted App entry
---
 .../common/endpoint/constants.ts              |   1 +
 .../endpoint/schema/trusted_apps.test.ts      |  62 +-
 .../common/endpoint/schema/trusted_apps.ts    |   4 +-
 .../common/endpoint/types/trusted_apps.ts     |   8 +-
 .../public/management/common/routing.ts       |  27 +-
 .../components/administration_list_page.tsx   |  10 +-
 .../pages/trusted_apps/service/index.ts       |  14 +-
 .../state/trusted_apps_list_page_state.ts     |  28 +-
 .../pages/trusted_apps/state/type_guards.ts   |  55 +
 .../pages/trusted_apps/store/action.ts        |  29 +-
 .../trusted_apps/store/middleware.test.ts     |   5 +
 .../pages/trusted_apps/store/middleware.ts    |  40 +-
 .../pages/trusted_apps/store/reducer.test.ts  |   3 +-
 .../pages/trusted_apps/store/reducer.ts       |  34 +-
 .../trusted_apps/store/selectors.test.ts      |  90 +-
 .../pages/trusted_apps/store/selectors.ts     |  55 +-
 .../pages/trusted_apps/test_utils/index.ts    |   5 +
 .../management/pages/trusted_apps/types.ts    |  11 +
 .../trusted_apps_page.test.tsx.snap           | 968 +++++++++++++++++-
 .../components/create_trusted_app_flyout.tsx  | 152 +++
 .../components/create_trusted_app_form.tsx    | 280 +++++
 .../components/condition_entry.tsx            | 188 ++++
 .../components/condition_group.tsx            |  61 ++
 .../components/logical_condition/index.ts     |   7 +
 .../logical_condition_builder.tsx             |  89 ++
 .../pages/trusted_apps/view/constants.ts      |  20 +
 .../trusted_apps/view/trusted_apps_list.tsx   |  13 +-
 .../view/trusted_apps_page.test.tsx           | 266 ++++-
 .../trusted_apps/view/trusted_apps_page.tsx   |  47 +-
 .../routes/trusted_apps/trusted_apps.test.ts  |   6 +-
 30 files changed, 2478 insertions(+), 100 deletions(-)
 create mode 100644 x-pack/plugins/security_solution/public/management/pages/trusted_apps/state/type_guards.ts
 create mode 100644 x-pack/plugins/security_solution/public/management/pages/trusted_apps/types.ts
 create mode 100644 x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/create_trusted_app_flyout.tsx
 create mode 100644 x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/create_trusted_app_form.tsx
 create mode 100644 x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/components/condition_entry.tsx
 create mode 100644 x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/components/condition_group.tsx
 create mode 100644 x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/index.ts
 create mode 100644 x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/logical_condition_builder.tsx
 create mode 100644 x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/constants.ts

diff --git a/x-pack/plugins/security_solution/common/endpoint/constants.ts b/x-pack/plugins/security_solution/common/endpoint/constants.ts
index a6018837fa4fe..cd59c2518794c 100644
--- a/x-pack/plugins/security_solution/common/endpoint/constants.ts
+++ b/x-pack/plugins/security_solution/common/endpoint/constants.ts
@@ -13,6 +13,7 @@ export const telemetryIndexPattern = 'metrics-endpoint.telemetry-*';
 export const LIMITED_CONCURRENCY_ENDPOINT_ROUTE_TAG = 'endpoint:limited-concurrency';
 export const LIMITED_CONCURRENCY_ENDPOINT_COUNT = 100;
 
+export const TRUSTED_APPS_SUPPORTED_OS_TYPES: readonly string[] = ['macos', 'windows', 'linux'];
 export const TRUSTED_APPS_LIST_API = '/api/endpoint/trusted_apps';
 export const TRUSTED_APPS_CREATE_API = '/api/endpoint/trusted_apps';
 export const TRUSTED_APPS_DELETE_API = '/api/endpoint/trusted_apps/{id}';
diff --git a/x-pack/plugins/security_solution/common/endpoint/schema/trusted_apps.test.ts b/x-pack/plugins/security_solution/common/endpoint/schema/trusted_apps.test.ts
index b0c769216732d..fc94e9a7c312a 100644
--- a/x-pack/plugins/security_solution/common/endpoint/schema/trusted_apps.test.ts
+++ b/x-pack/plugins/security_solution/common/endpoint/schema/trusted_apps.test.ts
@@ -76,7 +76,7 @@ describe('When invoking Trusted Apps Schema', () => {
       os: 'windows',
       entries: [
         {
-          field: 'path',
+          field: 'process.path',
           type: 'match',
           operator: 'included',
           value: 'c:/programs files/Anti-Virus',
@@ -111,14 +111,6 @@ describe('When invoking Trusted Apps Schema', () => {
       expect(body.validate(bodyMsg)).toStrictEqual(bodyMsg);
     });
 
-    it('should validate `description` to be non-empty if defined', () => {
-      const bodyMsg = {
-        ...getCreateTrustedAppItem(),
-        description: '',
-      };
-      expect(() => body.validate(bodyMsg)).toThrow();
-    });
-
     it('should validate `os` to to only accept known values', () => {
       const bodyMsg = {
         ...getCreateTrustedAppItem(),
@@ -202,7 +194,7 @@ describe('When invoking Trusted Apps Schema', () => {
         };
         expect(() => body.validate(bodyMsg2)).toThrow();
 
-        ['hash', 'path'].forEach((field) => {
+        ['process.hash.*', 'process.path'].forEach((field) => {
           const bodyMsg3 = {
             ...getCreateTrustedAppItem(),
             entries: [
@@ -217,9 +209,55 @@ describe('When invoking Trusted Apps Schema', () => {
         });
       });
 
-      it.todo('should validate `entry.type` is limited to known values');
+      it('should validate `entry.type` is limited to known values', () => {
+        const bodyMsg = {
+          ...getCreateTrustedAppItem(),
+          entries: [
+            {
+              ...getTrustedAppItemEntryItem(),
+              type: 'invalid',
+            },
+          ],
+        };
+        expect(() => body.validate(bodyMsg)).toThrow();
+
+        // Allow `match`
+        const bodyMsg2 = {
+          ...getCreateTrustedAppItem(),
+          entries: [
+            {
+              ...getTrustedAppItemEntryItem(),
+              type: 'match',
+            },
+          ],
+        };
+        expect(() => body.validate(bodyMsg2)).not.toThrow();
+      });
+
+      it('should validate `entry.operator` is limited to known values', () => {
+        const bodyMsg = {
+          ...getCreateTrustedAppItem(),
+          entries: [
+            {
+              ...getTrustedAppItemEntryItem(),
+              operator: 'invalid',
+            },
+          ],
+        };
+        expect(() => body.validate(bodyMsg)).toThrow();
 
-      it.todo('should validate `entry.operator` is limited to known values');
+        // Allow `match`
+        const bodyMsg2 = {
+          ...getCreateTrustedAppItem(),
+          entries: [
+            {
+              ...getTrustedAppItemEntryItem(),
+              operator: 'included',
+            },
+          ],
+        };
+        expect(() => body.validate(bodyMsg2)).not.toThrow();
+      });
 
       it('should validate `entry.value` required', () => {
         const { value, ...entry } = getTrustedAppItemEntryItem();
diff --git a/x-pack/plugins/security_solution/common/endpoint/schema/trusted_apps.ts b/x-pack/plugins/security_solution/common/endpoint/schema/trusted_apps.ts
index 7c0de84b637c9..72e24a7d694d4 100644
--- a/x-pack/plugins/security_solution/common/endpoint/schema/trusted_apps.ts
+++ b/x-pack/plugins/security_solution/common/endpoint/schema/trusted_apps.ts
@@ -22,11 +22,11 @@ export const GetTrustedAppsRequestSchema = {
 export const PostTrustedAppCreateRequestSchema = {
   body: schema.object({
     name: schema.string({ minLength: 1 }),
-    description: schema.maybe(schema.string({ minLength: 1 })),
+    description: schema.maybe(schema.string({ minLength: 0, defaultValue: '' })),
     os: schema.oneOf([schema.literal('linux'), schema.literal('macos'), schema.literal('windows')]),
     entries: schema.arrayOf(
       schema.object({
-        field: schema.oneOf([schema.literal('hash'), schema.literal('path')]),
+        field: schema.oneOf([schema.literal('process.hash.*'), schema.literal('process.path')]),
         type: schema.literal('match'),
         operator: schema.literal('included'),
         value: schema.string({ minLength: 1 }),
diff --git a/x-pack/plugins/security_solution/common/endpoint/types/trusted_apps.ts b/x-pack/plugins/security_solution/common/endpoint/types/trusted_apps.ts
index 7aeb6c6024b99..3356fc67d2682 100644
--- a/x-pack/plugins/security_solution/common/endpoint/types/trusted_apps.ts
+++ b/x-pack/plugins/security_solution/common/endpoint/types/trusted_apps.ts
@@ -25,17 +25,17 @@ export interface PostTrustedAppCreateResponse {
   data: TrustedApp;
 }
 
-interface MacosLinuxConditionEntry {
-  field: 'hash' | 'path';
+export interface MacosLinuxConditionEntry {
+  field: 'process.hash.*' | 'process.path';
   type: 'match';
   operator: 'included';
   value: string;
 }
 
-type WindowsConditionEntry =
+export type WindowsConditionEntry =
   | MacosLinuxConditionEntry
   | (Omit<MacosLinuxConditionEntry, 'field'> & {
-      field: 'signer';
+      field: 'process.code_signature';
     });
 
 /** Type for a new Trusted App Entry */
diff --git a/x-pack/plugins/security_solution/public/management/common/routing.ts b/x-pack/plugins/security_solution/public/management/common/routing.ts
index 62f360df90192..40320ed794203 100644
--- a/x-pack/plugins/security_solution/public/management/common/routing.ts
+++ b/x-pack/plugins/security_solution/public/management/common/routing.ts
@@ -21,6 +21,7 @@ import {
 import { AdministrationSubTab } from '../types';
 import { appendSearch } from '../../common/components/link_to/helpers';
 import { EndpointIndexUIQueryParams } from '../pages/endpoint_hosts/types';
+import { TrustedAppsUrlParams } from '../pages/trusted_apps/types';
 
 // Taken from: https://github.com/microsoft/TypeScript/issues/12936#issuecomment-559034150
 type ExactKeys<T1, T2> = Exclude<keyof T1, keyof T2> extends never ? T1 : never;
@@ -89,18 +90,16 @@ export const getPolicyDetailPath = (policyId: string, search?: string) => {
   })}${appendSearch(search)}`;
 };
 
-interface ListPaginationParams {
-  page_index: number;
-  page_size: number;
-}
-
-const isDefaultOrMissing = (value: number | undefined, defaultValue: number) => {
+const isDefaultOrMissing = (
+  value: number | string | undefined,
+  defaultValue: number | undefined
+) => {
   return value === undefined || value === defaultValue;
 };
 
 const normalizeListPaginationParams = (
-  params?: Partial<ListPaginationParams>
-): Partial<ListPaginationParams> => {
+  params?: Partial<TrustedAppsUrlParams>
+): Partial<TrustedAppsUrlParams> => {
   if (params) {
     return {
       ...(!isDefaultOrMissing(params.page_index, MANAGEMENT_DEFAULT_PAGE)
@@ -109,13 +108,19 @@ const normalizeListPaginationParams = (
       ...(!isDefaultOrMissing(params.page_size, MANAGEMENT_DEFAULT_PAGE_SIZE)
         ? { page_size: params.page_size }
         : {}),
+      ...(!isDefaultOrMissing(params.show, undefined) ? { show: params.show } : {}),
     };
   } else {
     return {};
   }
 };
 
-const extractFirstParamValue = (query: querystring.ParsedUrlQuery, key: string): string => {
+/**
+ * Given an object with url params, and a given key, return back only the first param value (case multiples were defined)
+ * @param query
+ * @param key
+ */
+export const extractFirstParamValue = (query: querystring.ParsedUrlQuery, key: string): string => {
   const value = query[key];
 
   return Array.isArray(value) ? value[value.length - 1] : value;
@@ -135,12 +140,12 @@ const extractPageSize = (query: querystring.ParsedUrlQuery): number => {
 
 export const extractListPaginationParams = (
   query: querystring.ParsedUrlQuery
-): ListPaginationParams => ({
+): TrustedAppsUrlParams => ({
   page_index: extractPageIndex(query),
   page_size: extractPageSize(query),
 });
 
-export const getTrustedAppsListPath = (params?: Partial<ListPaginationParams>): string => {
+export const getTrustedAppsListPath = (params?: Partial<TrustedAppsUrlParams>): string => {
   const path = generatePath(MANAGEMENT_ROUTING_TRUSTED_APPS_PATH, {
     tabName: AdministrationSubTab.trustedApps,
   });
diff --git a/x-pack/plugins/security_solution/public/management/components/administration_list_page.tsx b/x-pack/plugins/security_solution/public/management/components/administration_list_page.tsx
index 3df525b4d59d6..372916581b35d 100644
--- a/x-pack/plugins/security_solution/public/management/components/administration_list_page.tsx
+++ b/x-pack/plugins/security_solution/public/management/components/administration_list_page.tsx
@@ -5,6 +5,7 @@
  */
 import React, { FC, memo } from 'react';
 import { EuiPanel, EuiSpacer, CommonProps } from '@elastic/eui';
+import styled from 'styled-components';
 import { SecurityPageName } from '../../../common/constants';
 import { WrapperPage } from '../../common/components/wrapper_page';
 import { HeaderPage } from '../../common/components/header_page';
@@ -14,6 +15,13 @@ import { AdministrationSubTab } from '../types';
 import { ENDPOINTS_TAB, TRUSTED_APPS_TAB, BETA_BADGE_LABEL } from '../common/translations';
 import { getEndpointListPath, getTrustedAppsListPath } from '../common/routing';
 
+/** Ensure that all flyouts z-index in Administation area show the flyout header */
+const EuiPanelStyled = styled(EuiPanel)`
+  .euiFlyout {
+    z-index: ${({ theme }) => theme.eui.euiZNavigation + 1};
+  }
+`;
+
 interface AdministrationListPageProps {
   beta: boolean;
   title: React.ReactNode;
@@ -54,7 +62,7 @@ export const AdministrationListPage: FC<AdministrationListPageProps & CommonProp
 
         <EuiSpacer />
 
-        <EuiPanel>{children}</EuiPanel>
+        <EuiPanelStyled>{children}</EuiPanelStyled>
 
         <SpyRoute pageName={SecurityPageName.administration} />
       </WrapperPage>
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/service/index.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/service/index.ts
index 9308c137cfb9c..a3c5911aa3a86 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/service/index.ts
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/service/index.ts
@@ -5,14 +5,20 @@
  */
 
 import { HttpStart } from 'kibana/public';
-import { TRUSTED_APPS_LIST_API } from '../../../../../common/endpoint/constants';
+import {
+  TRUSTED_APPS_CREATE_API,
+  TRUSTED_APPS_LIST_API,
+} from '../../../../../common/endpoint/constants';
 import {
   GetTrustedListAppsResponse,
   GetTrustedAppsListRequest,
+  PostTrustedAppCreateRequest,
+  PostTrustedAppCreateResponse,
 } from '../../../../../common/endpoint/types/trusted_apps';
 
 export interface TrustedAppsService {
   getTrustedAppsList(request: GetTrustedAppsListRequest): Promise<GetTrustedListAppsResponse>;
+  createTrustedApp(request: PostTrustedAppCreateRequest): Promise<PostTrustedAppCreateResponse>;
 }
 
 export class TrustedAppsHttpService implements TrustedAppsService {
@@ -23,4 +29,10 @@ export class TrustedAppsHttpService implements TrustedAppsService {
       query: request,
     });
   }
+
+  async createTrustedApp(request: PostTrustedAppCreateRequest) {
+    return this.http.post<PostTrustedAppCreateResponse>(TRUSTED_APPS_CREATE_API, {
+      body: JSON.stringify(request),
+    });
+  }
 }
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/state/trusted_apps_list_page_state.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/state/trusted_apps_list_page_state.ts
index 23f4cfd576c56..071557ec1a815 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/state/trusted_apps_list_page_state.ts
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/state/trusted_apps_list_page_state.ts
@@ -4,8 +4,10 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { TrustedApp } from '../../../../../common/endpoint/types/trusted_apps';
+import { NewTrustedApp, TrustedApp } from '../../../../../common/endpoint/types/trusted_apps';
 import { AsyncResourceState } from '.';
+import { TrustedAppsUrlParams } from '../types';
+import { ServerApiError } from '../../../../common/types';
 
 export interface PaginationInfo {
   index: number;
@@ -18,10 +20,34 @@ export interface TrustedAppsListData {
   paginationInfo: PaginationInfo;
 }
 
+/** Store State when an API request has been sent to create a new trusted app entry */
+export interface TrustedAppCreatePending {
+  type: 'pending';
+  data: NewTrustedApp;
+}
+
+/** Store State when creation of a new Trusted APP entry was successful */
+export interface TrustedAppCreateSuccess {
+  type: 'success';
+  data: TrustedApp;
+}
+
+/** Store State when creation of a new Trusted App Entry failed */
+export interface TrustedAppCreateFailure {
+  type: 'failure';
+  data: ServerApiError;
+}
+
 export interface TrustedAppsListPageState {
   listView: {
     currentListResourceState: AsyncResourceState<TrustedAppsListData>;
     currentPaginationInfo: PaginationInfo;
+    show: TrustedAppsUrlParams['show'] | undefined;
   };
+  createView:
+    | undefined
+    | TrustedAppCreatePending
+    | TrustedAppCreateSuccess
+    | TrustedAppCreateFailure;
   active: boolean;
 }
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/state/type_guards.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/state/type_guards.ts
new file mode 100644
index 0000000000000..1e8e0bc042b86
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/state/type_guards.ts
@@ -0,0 +1,55 @@
+/*
+ * 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 {
+  TrustedAppCreatePending,
+  TrustedAppsListPageState,
+  TrustedAppCreateFailure,
+  TrustedAppCreateSuccess,
+} from './trusted_apps_list_page_state';
+import {
+  Immutable,
+  NewTrustedApp,
+  WindowsConditionEntry,
+} from '../../../../../common/endpoint/types';
+import { TRUSTED_APPS_SUPPORTED_OS_TYPES } from '../../../../../common/endpoint/constants';
+
+type CreateViewPossibleStates =
+  | TrustedAppsListPageState['createView']
+  | Immutable<TrustedAppsListPageState['createView']>;
+
+export const isTrustedAppCreatePendingState = (
+  data: CreateViewPossibleStates
+): data is TrustedAppCreatePending => {
+  return data?.type === 'pending';
+};
+
+export const isTrustedAppCreateSuccessState = (
+  data: CreateViewPossibleStates
+): data is TrustedAppCreateSuccess => {
+  return data?.type === 'success';
+};
+
+export const isTrustedAppCreateFailureState = (
+  data: CreateViewPossibleStates
+): data is TrustedAppCreateFailure => {
+  return data?.type === 'failure';
+};
+
+export const isWindowsTrustedApp = <T extends NewTrustedApp = NewTrustedApp>(
+  trustedApp: T
+): trustedApp is T & { os: 'windows' } => {
+  return trustedApp.os === 'windows';
+};
+
+export const isWindowsTrustedAppCondition = (condition: {
+  field: string;
+}): condition is WindowsConditionEntry => {
+  return condition.field === 'process.code_signature' || true;
+};
+
+export const isTrustedAppSupportedOs = (os: string): os is NewTrustedApp['os'] =>
+  TRUSTED_APPS_SUPPORTED_OS_TYPES.includes(os);
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/action.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/action.ts
index 2154a0eca462e..3a43ffe58262c 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/action.ts
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/action.ts
@@ -4,7 +4,13 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { AsyncResourceState, TrustedAppsListData } from '../state';
+import {
+  AsyncResourceState,
+  TrustedAppCreateFailure,
+  TrustedAppCreatePending,
+  TrustedAppCreateSuccess,
+  TrustedAppsListData,
+} from '../state';
 
 export interface TrustedAppsListResourceStateChanged {
   type: 'trustedAppsListResourceStateChanged';
@@ -13,4 +19,23 @@ export interface TrustedAppsListResourceStateChanged {
   };
 }
 
-export type TrustedAppsPageAction = TrustedAppsListResourceStateChanged;
+export interface UserClickedSaveNewTrustedAppButton {
+  type: 'userClickedSaveNewTrustedAppButton';
+  payload: TrustedAppCreatePending;
+}
+
+export interface ServerReturnedCreateTrustedAppSuccess {
+  type: 'serverReturnedCreateTrustedAppSuccess';
+  payload: TrustedAppCreateSuccess;
+}
+
+export interface ServerReturnedCreateTrustedAppFailure {
+  type: 'serverReturnedCreateTrustedAppFailure';
+  payload: TrustedAppCreateFailure;
+}
+
+export type TrustedAppsPageAction =
+  | TrustedAppsListResourceStateChanged
+  | UserClickedSaveNewTrustedAppButton
+  | ServerReturnedCreateTrustedAppSuccess
+  | ServerReturnedCreateTrustedAppFailure;
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/middleware.test.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/middleware.test.ts
index c5abaae473486..e5f00ee0ccf81 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/middleware.test.ts
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/middleware.test.ts
@@ -31,6 +31,7 @@ const createGetTrustedListAppsResponse = (pagination: PaginationInfo, totalItems
 
 const createTrustedAppsServiceMock = (): jest.Mocked<TrustedAppsService> => ({
   getTrustedAppsList: jest.fn(),
+  createTrustedApp: jest.fn(),
 });
 
 const createStoreSetup = (trustedAppsService: TrustedAppsService) => {
@@ -70,6 +71,7 @@ describe('middleware', () => {
       expect(store.getState()).toStrictEqual({
         listView: createLoadingListViewWithPagination(pagination),
         active: true,
+        createView: undefined,
       });
 
       await spyMiddleware.waitForAction('trustedAppsListResourceStateChanged');
@@ -77,6 +79,7 @@ describe('middleware', () => {
       expect(store.getState()).toStrictEqual({
         listView: createLoadedListViewWithPagination(pagination, pagination, 500),
         active: true,
+        createView: undefined,
       });
     });
 
@@ -99,6 +102,7 @@ describe('middleware', () => {
       expect(store.getState()).toStrictEqual({
         listView: createLoadedListViewWithPagination(pagination, pagination, 500),
         active: true,
+        createView: undefined,
       });
     });
 
@@ -118,6 +122,7 @@ describe('middleware', () => {
           createServerApiError('Internal Server Error')
         ),
         active: true,
+        createView: undefined,
       });
 
       const infiniteLoopTest = async () => {
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/middleware.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/middleware.ts
index 31c301b8dbd2b..bf9cacff5caf0 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/middleware.ts
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/middleware.ts
@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { Immutable } from '../../../../../common/endpoint/types';
+import { Immutable, PostTrustedAppCreateRequest } from '../../../../../common/endpoint/types';
 import { AppAction } from '../../../../common/store/actions';
 import {
   ImmutableMiddleware,
@@ -28,6 +28,8 @@ import {
   getLastLoadedListResourceState,
   getListCurrentPageIndex,
   getListCurrentPageSize,
+  getTrustedAppCreateData,
+  isCreatePending,
   needsRefreshOfListData,
 } from './selectors';
 
@@ -81,6 +83,38 @@ const refreshList = async (
   }
 };
 
+const createTrustedApp = async (
+  store: ImmutableMiddlewareAPI<TrustedAppsListPageState, AppAction>,
+  trustedAppsService: TrustedAppsService
+) => {
+  const { dispatch, getState } = store;
+
+  if (isCreatePending(getState())) {
+    try {
+      const newTrustedApp = getTrustedAppCreateData(getState());
+      const createdTrustedApp = (
+        await trustedAppsService.createTrustedApp(newTrustedApp as PostTrustedAppCreateRequest)
+      ).data;
+      dispatch({
+        type: 'serverReturnedCreateTrustedAppSuccess',
+        payload: {
+          type: 'success',
+          data: createdTrustedApp,
+        },
+      });
+      refreshList(store, trustedAppsService);
+    } catch (error) {
+      dispatch({
+        type: 'serverReturnedCreateTrustedAppFailure',
+        payload: {
+          type: 'failure',
+          data: error.body || error,
+        },
+      });
+    }
+  }
+};
+
 export const createTrustedAppsPageMiddleware = (
   trustedAppsService: TrustedAppsService
 ): ImmutableMiddleware<TrustedAppsListPageState, AppAction> => {
@@ -91,6 +125,10 @@ export const createTrustedAppsPageMiddleware = (
     if (action.type === 'userChangedUrl' && needsRefreshOfListData(store.getState())) {
       await refreshList(store, trustedAppsService);
     }
+
+    if (action.type === 'userClickedSaveNewTrustedAppButton') {
+      createTrustedApp(store, trustedAppsService);
+    }
   };
 };
 
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/reducer.test.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/reducer.test.ts
index 34325e0cf1398..76dd4b48e63d2 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/reducer.test.ts
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/reducer.test.ts
@@ -26,6 +26,7 @@ describe('reducer', () => {
           currentPaginationInfo: { index: 5, size: 50 },
         },
         active: true,
+        createView: undefined,
       });
     });
 
@@ -67,7 +68,7 @@ describe('reducer', () => {
 
     it('makes page state inactive and resets list to uninitialised state when navigating away', () => {
       const result = trustedAppsPageReducer(
-        { listView: createLoadedListViewWithPagination(), active: true },
+        { listView: createLoadedListViewWithPagination(), active: true, createView: undefined },
         createUserChangedUrlAction('/endpoints')
       );
 
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/reducer.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/reducer.ts
index 4fdc6f90ef40c..d824a6e95c8d5 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/reducer.ts
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/reducer.ts
@@ -11,14 +11,19 @@ import { ImmutableReducer } from '../../../../common/store';
 import { AppLocation, Immutable } from '../../../../../common/endpoint/types';
 import { UserChangedUrl } from '../../../../common/store/routing/action';
 import { AppAction } from '../../../../common/store/actions';
-import { extractListPaginationParams } from '../../../common/routing';
+import { extractFirstParamValue, extractListPaginationParams } from '../../../common/routing';
 import {
   MANAGEMENT_ROUTING_TRUSTED_APPS_PATH,
   MANAGEMENT_DEFAULT_PAGE,
   MANAGEMENT_DEFAULT_PAGE_SIZE,
 } from '../../../common/constants';
 
-import { TrustedAppsListResourceStateChanged } from './action';
+import {
+  ServerReturnedCreateTrustedAppFailure,
+  ServerReturnedCreateTrustedAppSuccess,
+  TrustedAppsListResourceStateChanged,
+  UserClickedSaveNewTrustedAppButton,
+} from './action';
 import { TrustedAppsListPageState } from '../state';
 
 type StateReducer = ImmutableReducer<TrustedAppsListPageState, AppAction>;
@@ -51,7 +56,10 @@ const trustedAppsListResourceStateChanged: CaseReducer<TrustedAppsListResourceSt
 
 const userChangedUrl: CaseReducer<UserChangedUrl> = (state, action) => {
   if (isTrustedAppsPageLocation(action.payload)) {
-    const paginationParams = extractListPaginationParams(parse(action.payload.search.slice(1)));
+    const parsedUrlsParams = parse(action.payload.search.slice(1));
+    const paginationParams = extractListPaginationParams(parsedUrlsParams);
+    const show =
+      extractFirstParamValue(parsedUrlsParams, 'show') === 'create' ? 'create' : undefined;
 
     return {
       ...state,
@@ -61,7 +69,9 @@ const userChangedUrl: CaseReducer<UserChangedUrl> = (state, action) => {
           index: paginationParams.page_index,
           size: paginationParams.page_size,
         },
+        show,
       },
+      createView: show ? state.createView : undefined,
       active: true,
     };
   } else {
@@ -69,6 +79,17 @@ const userChangedUrl: CaseReducer<UserChangedUrl> = (state, action) => {
   }
 };
 
+const trustedAppsCreateResourceChanged: CaseReducer<
+  | UserClickedSaveNewTrustedAppButton
+  | ServerReturnedCreateTrustedAppFailure
+  | ServerReturnedCreateTrustedAppSuccess
+> = (state, action) => {
+  return {
+    ...state,
+    createView: action.payload,
+  };
+};
+
 export const initialTrustedAppsPageState: TrustedAppsListPageState = {
   listView: {
     currentListResourceState: { type: 'UninitialisedResourceState' },
@@ -76,7 +97,9 @@ export const initialTrustedAppsPageState: TrustedAppsListPageState = {
       index: MANAGEMENT_DEFAULT_PAGE,
       size: MANAGEMENT_DEFAULT_PAGE_SIZE,
     },
+    show: undefined,
   },
+  createView: undefined,
   active: false,
 };
 
@@ -90,6 +113,11 @@ export const trustedAppsPageReducer: StateReducer = (
 
     case 'userChangedUrl':
       return userChangedUrl(state, action);
+
+    case 'userClickedSaveNewTrustedAppButton':
+    case 'serverReturnedCreateTrustedAppSuccess':
+    case 'serverReturnedCreateTrustedAppFailure':
+      return trustedAppsCreateResourceChanged(state, action);
   }
 
   return state;
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/selectors.test.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/selectors.test.ts
index a969e2dee4773..453afa1befa6b 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/selectors.test.ts
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/selectors.test.ts
@@ -30,33 +30,41 @@ import {
 describe('selectors', () => {
   describe('needsRefreshOfListData()', () => {
     it('returns false for outdated resource state and inactive state', () => {
-      expect(needsRefreshOfListData({ listView: createDefaultListView(), active: false })).toBe(
-        false
-      );
+      expect(
+        needsRefreshOfListData({
+          listView: createDefaultListView(),
+          active: false,
+          createView: undefined,
+        })
+      ).toBe(false);
     });
 
     it('returns true for outdated resource state and active state', () => {
-      expect(needsRefreshOfListData({ listView: createDefaultListView(), active: true })).toBe(
-        true
-      );
+      expect(
+        needsRefreshOfListData({
+          listView: createDefaultListView(),
+          active: true,
+          createView: undefined,
+        })
+      ).toBe(true);
     });
 
     it('returns true when current loaded page index is outdated', () => {
       const listView = createLoadedListViewWithPagination({ index: 1, size: 20 });
 
-      expect(needsRefreshOfListData({ listView, active: true })).toBe(true);
+      expect(needsRefreshOfListData({ listView, active: true, createView: undefined })).toBe(true);
     });
 
     it('returns true when current loaded page size is outdated', () => {
       const listView = createLoadedListViewWithPagination({ index: 0, size: 50 });
 
-      expect(needsRefreshOfListData({ listView, active: true })).toBe(true);
+      expect(needsRefreshOfListData({ listView, active: true, createView: undefined })).toBe(true);
     });
 
     it('returns false when current loaded data is up to date', () => {
       const listView = createLoadedListViewWithPagination();
 
-      expect(needsRefreshOfListData({ listView, active: true })).toBe(false);
+      expect(needsRefreshOfListData({ listView, active: true, createView: undefined })).toBe(false);
     });
   });
 
@@ -64,9 +72,9 @@ describe('selectors', () => {
     it('returns current list resource state', () => {
       const listView = createDefaultListView();
 
-      expect(getCurrentListResourceState({ listView, active: false })).toStrictEqual(
-        createUninitialisedResourceState()
-      );
+      expect(
+        getCurrentListResourceState({ listView, active: false, createView: undefined })
+      ).toStrictEqual(createUninitialisedResourceState());
     });
   });
 
@@ -78,17 +86,20 @@ describe('selectors', () => {
           200
         ),
         currentPaginationInfo: createDefaultPaginationInfo(),
+        show: undefined,
       };
 
-      expect(getLastLoadedListResourceState({ listView, active: false })).toStrictEqual(
-        createListLoadedResourceState(createDefaultPaginationInfo(), 200)
-      );
+      expect(
+        getLastLoadedListResourceState({ listView, active: false, createView: undefined })
+      ).toStrictEqual(createListLoadedResourceState(createDefaultPaginationInfo(), 200));
     });
   });
 
   describe('getListItems()', () => {
     it('returns empty list when no valid data loaded', () => {
-      expect(getListItems({ listView: createDefaultListView(), active: false })).toStrictEqual([]);
+      expect(
+        getListItems({ listView: createDefaultListView(), active: false, createView: undefined })
+      ).toStrictEqual([]);
     });
 
     it('returns last loaded list items', () => {
@@ -98,9 +109,10 @@ describe('selectors', () => {
           200
         ),
         currentPaginationInfo: createDefaultPaginationInfo(),
+        show: undefined,
       };
 
-      expect(getListItems({ listView, active: false })).toStrictEqual(
+      expect(getListItems({ listView, active: false, createView: undefined })).toStrictEqual(
         createSampleTrustedApps(createDefaultPaginationInfo())
       );
     });
@@ -108,7 +120,13 @@ describe('selectors', () => {
 
   describe('getListTotalItemsCount()', () => {
     it('returns 0 when no valid data loaded', () => {
-      expect(getListTotalItemsCount({ listView: createDefaultListView(), active: false })).toBe(0);
+      expect(
+        getListTotalItemsCount({
+          listView: createDefaultListView(),
+          active: false,
+          createView: undefined,
+        })
+      ).toBe(0);
     });
 
     it('returns last loaded total items count', () => {
@@ -118,21 +136,34 @@ describe('selectors', () => {
           200
         ),
         currentPaginationInfo: createDefaultPaginationInfo(),
+        show: undefined,
       };
 
-      expect(getListTotalItemsCount({ listView, active: false })).toBe(200);
+      expect(getListTotalItemsCount({ listView, active: false, createView: undefined })).toBe(200);
     });
   });
 
   describe('getListCurrentPageIndex()', () => {
     it('returns page index', () => {
-      expect(getListCurrentPageIndex({ listView: createDefaultListView(), active: false })).toBe(0);
+      expect(
+        getListCurrentPageIndex({
+          listView: createDefaultListView(),
+          active: false,
+          createView: undefined,
+        })
+      ).toBe(0);
     });
   });
 
   describe('getListCurrentPageSize()', () => {
     it('returns page index', () => {
-      expect(getListCurrentPageSize({ listView: createDefaultListView(), active: false })).toBe(20);
+      expect(
+        getListCurrentPageSize({
+          listView: createDefaultListView(),
+          active: false,
+          createView: undefined,
+        })
+      ).toBe(20);
     });
   });
 
@@ -144,24 +175,32 @@ describe('selectors', () => {
           200
         ),
         currentPaginationInfo: createDefaultPaginationInfo(),
+        show: undefined,
       };
 
-      expect(getListErrorMessage({ listView, active: false })).toBeUndefined();
+      expect(
+        getListErrorMessage({ listView, active: false, createView: undefined })
+      ).toBeUndefined();
     });
 
     it('returns message when not in failed state', () => {
       const listView = {
         currentListResourceState: createListFailedResourceState('Internal Server Error'),
         currentPaginationInfo: createDefaultPaginationInfo(),
+        show: undefined,
       };
 
-      expect(getListErrorMessage({ listView, active: false })).toBe('Internal Server Error');
+      expect(getListErrorMessage({ listView, active: false, createView: undefined })).toBe(
+        'Internal Server Error'
+      );
     });
   });
 
   describe('isListLoading()', () => {
     it('returns false when no loading is happening', () => {
-      expect(isListLoading({ listView: createDefaultListView(), active: false })).toBe(false);
+      expect(
+        isListLoading({ listView: createDefaultListView(), active: false, createView: undefined })
+      ).toBe(false);
     });
 
     it('returns true when loading is in progress', () => {
@@ -171,9 +210,10 @@ describe('selectors', () => {
           200
         ),
         currentPaginationInfo: createDefaultPaginationInfo(),
+        show: undefined,
       };
 
-      expect(isListLoading({ listView, active: false })).toBe(true);
+      expect(isListLoading({ listView, active: false, createView: undefined })).toBe(true);
     });
   });
 });
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/selectors.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/selectors.ts
index 6fde779ac1cce..f074b21f79f4e 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/selectors.ts
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/store/selectors.ts
@@ -4,7 +4,8 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { Immutable, TrustedApp } from '../../../../../common/endpoint/types';
+import { createSelector } from 'reselect';
+import { Immutable, NewTrustedApp, TrustedApp } from '../../../../../common/endpoint/types';
 
 import {
   AsyncResourceState,
@@ -14,9 +15,16 @@ import {
   isOutdatedResourceState,
   LoadedResourceState,
   PaginationInfo,
+  TrustedAppCreateFailure,
   TrustedAppsListData,
   TrustedAppsListPageState,
 } from '../state';
+import { TrustedAppsUrlParams } from '../types';
+import {
+  isTrustedAppCreateFailureState,
+  isTrustedAppCreatePendingState,
+  isTrustedAppCreateSuccessState,
+} from '../state/type_guards';
 
 const pageInfosEqual = (pageInfo1: PaginationInfo, pageInfo2: PaginationInfo): boolean =>
   pageInfo1.index === pageInfo2.index && pageInfo1.size === pageInfo2.size;
@@ -65,6 +73,27 @@ export const getListTotalItemsCount = (state: Immutable<TrustedAppsListPageState
   );
 };
 
+export const getListCurrentShowValue: (
+  state: Immutable<TrustedAppsListPageState>
+) => TrustedAppsListPageState['listView']['show'] = (state) => {
+  return state.listView.show;
+};
+
+export const getListUrlSearchParams: (
+  state: Immutable<TrustedAppsListPageState>
+) => TrustedAppsUrlParams = createSelector(
+  getListCurrentPageIndex,
+  getListCurrentPageSize,
+  getListCurrentShowValue,
+  (pageIndex, pageSize, showValue) => {
+    return {
+      page_index: pageIndex,
+      page_size: pageSize,
+      show: showValue,
+    };
+  }
+);
+
 export const getListErrorMessage = (
   state: Immutable<TrustedAppsListPageState>
 ): string | undefined => {
@@ -74,3 +103,27 @@ export const getListErrorMessage = (
 export const isListLoading = (state: Immutable<TrustedAppsListPageState>): boolean => {
   return isLoadingResourceState(state.listView.currentListResourceState);
 };
+
+export const isCreatePending: (state: Immutable<TrustedAppsListPageState>) => boolean = ({
+  createView,
+}) => {
+  return isTrustedAppCreatePendingState(createView);
+};
+
+export const getTrustedAppCreateData: (
+  state: Immutable<TrustedAppsListPageState>
+) => undefined | Immutable<NewTrustedApp> = ({ createView }) => {
+  return (isTrustedAppCreatePendingState(createView) && createView.data) || undefined;
+};
+
+export const getApiCreateErrors: (
+  state: Immutable<TrustedAppsListPageState>
+) => undefined | TrustedAppCreateFailure['data'] = ({ createView }) => {
+  return (isTrustedAppCreateFailureState(createView) && createView.data) || undefined;
+};
+
+export const wasCreateSuccessful: (state: Immutable<TrustedAppsListPageState>) => boolean = ({
+  createView,
+}) => {
+  return isTrustedAppCreateSuccessState(createView);
+};
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/test_utils/index.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/test_utils/index.ts
index fab059a422a2a..70e4e1e685b01 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/test_utils/index.ts
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/test_utils/index.ts
@@ -21,6 +21,7 @@ import {
 } from '../state';
 
 import { TrustedAppsListResourceStateChanged } from '../store/action';
+import { initialTrustedAppsPageState } from '../store/reducer';
 
 const OS_LIST: Array<TrustedApp['os']> = ['windows', 'macos', 'linux'];
 
@@ -93,6 +94,7 @@ export const createListComplexLoadingResourceState = (
 export const createDefaultPaginationInfo = () => ({ index: 0, size: 20 });
 
 export const createDefaultListView = () => ({
+  ...initialTrustedAppsPageState.listView,
   currentListResourceState: createUninitialisedResourceState(),
   currentPaginationInfo: createDefaultPaginationInfo(),
 });
@@ -101,6 +103,7 @@ export const createLoadingListViewWithPagination = (
   currentPaginationInfo: PaginationInfo,
   previousState: StaleResourceState<TrustedAppsListData> = createUninitialisedResourceState()
 ): TrustedAppsListPageState['listView'] => ({
+  ...initialTrustedAppsPageState.listView,
   currentListResourceState: { type: 'LoadingResourceState', previousState },
   currentPaginationInfo,
 });
@@ -110,6 +113,7 @@ export const createLoadedListViewWithPagination = (
   currentPaginationInfo: PaginationInfo = createDefaultPaginationInfo(),
   totalItemsCount: number = 200
 ): TrustedAppsListPageState['listView'] => ({
+  ...initialTrustedAppsPageState.listView,
   currentListResourceState: createListLoadedResourceState(paginationInfo, totalItemsCount),
   currentPaginationInfo,
 });
@@ -119,6 +123,7 @@ export const createFailedListViewWithPagination = (
   error: ServerApiError,
   lastLoadedState?: LoadedResourceState<TrustedAppsListData>
 ): TrustedAppsListPageState['listView'] => ({
+  ...initialTrustedAppsPageState.listView,
   currentListResourceState: { type: 'FailedResourceState', error, lastLoadedState },
   currentPaginationInfo,
 });
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/types.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/types.ts
new file mode 100644
index 0000000000000..4d59cd7913a0c
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/types.ts
@@ -0,0 +1,11 @@
+/*
+ * 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.
+ */
+
+export interface TrustedAppsUrlParams {
+  page_index: number;
+  page_size: number;
+  show?: 'create';
+}
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_apps_page.test.tsx.snap b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_apps_page.test.tsx.snap
index d6e9aee108cf6..5cb788d96f3e7 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_apps_page.test.tsx.snap
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_apps_page.test.tsx.snap
@@ -1,23 +1,959 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`TrustedAppsPage rendering 1`] = `
-<AdministrationListPage
-  beta={true}
-  subtitle={
-    <FormattedMessage
-      defaultMessage="View and configure trusted applications"
-      id="xpack.securitySolution.trustedapps.list.pageSubTitle"
-      values={Object {}}
-    />
+Object {
+  "asFragment": [Function],
+  "baseElement": .c0 {
+  padding: 24px;
+}
+
+.c0.siemWrapperPage--restrictWidthDefault,
+.c0.siemWrapperPage--restrictWidthCustom {
+  box-sizing: content-box;
+  margin: 0 auto;
+}
+
+.c0.siemWrapperPage--restrictWidthDefault {
+  max-width: 1000px;
+}
+
+.c0.siemWrapperPage--fullHeight {
+  height: 100%;
+}
+
+.c0.siemWrapperPage--withTimeline {
+  padding-right: 70px;
+}
+
+.c0.siemWrapperPage--noPadding {
+  padding: 0;
+}
+
+.c4 {
+  margin-top: 8px;
+}
+
+.c4 .siemSubtitle__item {
+  color: #6a717d;
+  font-size: 12px;
+  line-height: 1.5;
+}
+
+.c3 {
+  vertical-align: middle;
+}
+
+.c1 {
+  margin-bottom: 24px;
+}
+
+.c2 {
+  display: block;
+}
+
+.c5 .euiFlyout {
+  z-index: 4001;
+}
+
+@media only screen and (min-width:575px) {
+  .c4 .siemSubtitle__item {
+    display: inline-block;
+    margin-right: 16px;
   }
-  title={
-    <FormattedMessage
-      defaultMessage="Trusted Applications"
-      id="xpack.securitySolution.trustedapps.list.pageTitle"
-      values={Object {}}
-    />
+
+  .c4 .siemSubtitle__item:last-child {
+    margin-right: 0;
   }
+}
+
+<body>
+    <div>
+      <div
+        class="c0 siemWrapperPage"
+      >
+        <header
+          class="c1 siemHeaderPage"
+        >
+          <div
+            class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+          >
+            <div
+              class="euiFlexItem c2"
+            >
+              <h1
+                class="euiTitle euiTitle--large"
+                data-test-subj="header-page-title"
+              >
+                Trusted Applications
+                 
+                <span
+                  class="euiBetaBadge c3"
+                  title="Beta"
+                >
+                  Beta
+                </span>
+              </h1>
+              <div
+                class="c4 siemSubtitle"
+              >
+                <div
+                  class="siemSubtitle__item siemSubtitle__item--node"
+                  data-test-subj="header-panel-subtitle"
+                >
+                  View and configure trusted applications
+                </div>
+              </div>
+            </div>
+            <div
+              class="euiFlexItem euiFlexItem--flexGrowZero c2"
+              data-test-subj="header-page-supplements"
+            >
+              <button
+                class="euiButton euiButton--primary euiButton--fill"
+                data-test-subj="trustedAppsListAddButton"
+                type="button"
+              >
+                <span
+                  class="euiButtonContent euiButton__content"
+                >
+                  <div
+                    class="euiButtonContent__icon"
+                    data-euiicon-type="plusInCircle"
+                  />
+                  <span
+                    class="euiButton__text"
+                  >
+                    Add Trusted Application
+                  </span>
+                </span>
+              </button>
+            </div>
+          </div>
+        </header>
+        <div
+          class="euiTabs"
+          role="tablist"
+        >
+          <button
+            aria-selected="false"
+            class="euiTab"
+            data-test-subj="navigation-endpoints"
+            role="tab"
+            type="button"
+          >
+            <span
+              class="euiTab__content"
+            >
+              Endpoints
+            </span>
+          </button>
+          <button
+            aria-selected="false"
+            class="euiTab"
+            data-test-subj="navigation-trusted_apps"
+            role="tab"
+            type="button"
+          >
+            <span
+              class="euiTab__content"
+            >
+              Trusted applications
+            </span>
+          </button>
+        </div>
+        <div
+          class="euiSpacer euiSpacer--l"
+        />
+        <div
+          class="euiPanel euiPanel--paddingMedium c5"
+        >
+          <div
+            class="euiBasicTable euiBasicTable-loading"
+          >
+            <div>
+              <div
+                class="euiTableHeaderMobile"
+              >
+                <div
+                  class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsBaseline euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow"
+                >
+                  <div
+                    class="euiFlexItem euiFlexItem--flexGrowZero"
+                  />
+                  <div
+                    class="euiFlexItem euiFlexItem--flexGrowZero"
+                  />
+                </div>
+              </div>
+              <table
+                class="euiTable euiTable--responsive"
+                id="mockId"
+                tabindex="-1"
+              >
+                <caption
+                  class="euiScreenReaderOnly euiTableCaption"
+                />
+                <thead>
+                  <tr>
+                    <th
+                      class="euiTableHeaderCell"
+                      data-test-subj="tableHeaderCell_name_0"
+                      role="columnheader"
+                      scope="col"
+                    >
+                      <div
+                        class="euiTableCellContent"
+                      >
+                        <span
+                          class="euiTableCellContent__text"
+                          title="Name"
+                        >
+                          Name
+                        </span>
+                      </div>
+                    </th>
+                    <th
+                      class="euiTableHeaderCell"
+                      data-test-subj="tableHeaderCell_os_1"
+                      role="columnheader"
+                      scope="col"
+                    >
+                      <div
+                        class="euiTableCellContent"
+                      >
+                        <span
+                          class="euiTableCellContent__text"
+                          title="OS"
+                        >
+                          OS
+                        </span>
+                      </div>
+                    </th>
+                    <th
+                      class="euiTableHeaderCell"
+                      data-test-subj="tableHeaderCell_created_at_2"
+                      role="columnheader"
+                      scope="col"
+                    >
+                      <div
+                        class="euiTableCellContent"
+                      >
+                        <span
+                          class="euiTableCellContent__text"
+                          title="Date Created"
+                        >
+                          Date Created
+                        </span>
+                      </div>
+                    </th>
+                    <th
+                      class="euiTableHeaderCell"
+                      data-test-subj="tableHeaderCell_created_by_3"
+                      role="columnheader"
+                      scope="col"
+                    >
+                      <div
+                        class="euiTableCellContent"
+                      >
+                        <span
+                          class="euiTableCellContent__text"
+                          title="Created By"
+                        >
+                          Created By
+                        </span>
+                      </div>
+                    </th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr
+                    class="euiTableRow"
+                  >
+                    <td
+                      class="euiTableRowCell euiTableRowCell--isMobileFullWidth"
+                      colspan="4"
+                    >
+                      <div
+                        class="euiTableCellContent euiTableCellContent--alignCenter"
+                      >
+                        <span
+                          class="euiTableCellContent__text"
+                        >
+                          No items found
+                        </span>
+                      </div>
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </body>,
+  "container": <div>
+    <div
+      class="sc-fzoyAV jWxvlI siemWrapperPage"
+    >
+      <header
+        class="sc-oVoYc gokfWe siemHeaderPage"
+      >
+        <div
+          class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+        >
+          <div
+            class="euiFlexItem sc-pdMpF bYVYXb"
+          >
+            <h1
+              class="euiTitle euiTitle--large"
+              data-test-subj="header-page-title"
+            >
+              Trusted Applications
+               
+              <span
+                class="euiBetaBadge sc-pTUxa bXJtIM"
+                title="Beta"
+              >
+                Beta
+              </span>
+            </h1>
+            <div
+              class="sc-fzoXzr iMKumH siemSubtitle"
+            >
+              <div
+                class="siemSubtitle__item siemSubtitle__item--node"
+                data-test-subj="header-panel-subtitle"
+              >
+                View and configure trusted applications
+              </div>
+            </div>
+          </div>
+          <div
+            class="euiFlexItem euiFlexItem--flexGrowZero sc-pdMpF bYVYXb"
+            data-test-subj="header-page-supplements"
+          >
+            <button
+              class="euiButton euiButton--primary euiButton--fill"
+              data-test-subj="trustedAppsListAddButton"
+              type="button"
+            >
+              <span
+                class="euiButtonContent euiButton__content"
+              >
+                <div
+                  class="euiButtonContent__icon"
+                  data-euiicon-type="plusInCircle"
+                />
+                <span
+                  class="euiButton__text"
+                >
+                  Add Trusted Application
+                </span>
+              </span>
+            </button>
+          </div>
+        </div>
+      </header>
+      <div
+        class="euiTabs"
+        role="tablist"
+      >
+        <button
+          aria-selected="false"
+          class="euiTab"
+          data-test-subj="navigation-endpoints"
+          role="tab"
+          type="button"
+        >
+          <span
+            class="euiTab__content"
+          >
+            Endpoints
+          </span>
+        </button>
+        <button
+          aria-selected="false"
+          class="euiTab"
+          data-test-subj="navigation-trusted_apps"
+          role="tab"
+          type="button"
+        >
+          <span
+            class="euiTab__content"
+          >
+            Trusted applications
+          </span>
+        </button>
+      </div>
+      <div
+        class="euiSpacer euiSpacer--l"
+      />
+      <div
+        class="euiPanel euiPanel--paddingMedium sc-pjuKs cIhDKD"
+      >
+        <div
+          class="euiBasicTable euiBasicTable-loading"
+        >
+          <div>
+            <div
+              class="euiTableHeaderMobile"
+            >
+              <div
+                class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsBaseline euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow"
+              >
+                <div
+                  class="euiFlexItem euiFlexItem--flexGrowZero"
+                />
+                <div
+                  class="euiFlexItem euiFlexItem--flexGrowZero"
+                />
+              </div>
+            </div>
+            <table
+              class="euiTable euiTable--responsive"
+              id="mockId"
+              tabindex="-1"
+            >
+              <caption
+                class="euiScreenReaderOnly euiTableCaption"
+              />
+              <thead>
+                <tr>
+                  <th
+                    class="euiTableHeaderCell"
+                    data-test-subj="tableHeaderCell_name_0"
+                    role="columnheader"
+                    scope="col"
+                  >
+                    <div
+                      class="euiTableCellContent"
+                    >
+                      <span
+                        class="euiTableCellContent__text"
+                        title="Name"
+                      >
+                        Name
+                      </span>
+                    </div>
+                  </th>
+                  <th
+                    class="euiTableHeaderCell"
+                    data-test-subj="tableHeaderCell_os_1"
+                    role="columnheader"
+                    scope="col"
+                  >
+                    <div
+                      class="euiTableCellContent"
+                    >
+                      <span
+                        class="euiTableCellContent__text"
+                        title="OS"
+                      >
+                        OS
+                      </span>
+                    </div>
+                  </th>
+                  <th
+                    class="euiTableHeaderCell"
+                    data-test-subj="tableHeaderCell_created_at_2"
+                    role="columnheader"
+                    scope="col"
+                  >
+                    <div
+                      class="euiTableCellContent"
+                    >
+                      <span
+                        class="euiTableCellContent__text"
+                        title="Date Created"
+                      >
+                        Date Created
+                      </span>
+                    </div>
+                  </th>
+                  <th
+                    class="euiTableHeaderCell"
+                    data-test-subj="tableHeaderCell_created_by_3"
+                    role="columnheader"
+                    scope="col"
+                  >
+                    <div
+                      class="euiTableCellContent"
+                    >
+                      <span
+                        class="euiTableCellContent__text"
+                        title="Created By"
+                      >
+                        Created By
+                      </span>
+                    </div>
+                  </th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr
+                  class="euiTableRow"
+                >
+                  <td
+                    class="euiTableRowCell euiTableRowCell--isMobileFullWidth"
+                    colspan="4"
+                  >
+                    <div
+                      class="euiTableCellContent euiTableCellContent--alignCenter"
+                    >
+                      <span
+                        class="euiTableCellContent__text"
+                      >
+                        No items found
+                      </span>
+                    </div>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>,
+  "debug": [Function],
+  "findAllByAltText": [Function],
+  "findAllByDisplayValue": [Function],
+  "findAllByLabelText": [Function],
+  "findAllByPlaceholderText": [Function],
+  "findAllByRole": [Function],
+  "findAllByTestId": [Function],
+  "findAllByText": [Function],
+  "findAllByTitle": [Function],
+  "findByAltText": [Function],
+  "findByDisplayValue": [Function],
+  "findByLabelText": [Function],
+  "findByPlaceholderText": [Function],
+  "findByRole": [Function],
+  "findByTestId": [Function],
+  "findByText": [Function],
+  "findByTitle": [Function],
+  "getAllByAltText": [Function],
+  "getAllByDisplayValue": [Function],
+  "getAllByLabelText": [Function],
+  "getAllByPlaceholderText": [Function],
+  "getAllByRole": [Function],
+  "getAllByTestId": [Function],
+  "getAllByText": [Function],
+  "getAllByTitle": [Function],
+  "getByAltText": [Function],
+  "getByDisplayValue": [Function],
+  "getByLabelText": [Function],
+  "getByPlaceholderText": [Function],
+  "getByRole": [Function],
+  "getByTestId": [Function],
+  "getByText": [Function],
+  "getByTitle": [Function],
+  "queryAllByAltText": [Function],
+  "queryAllByDisplayValue": [Function],
+  "queryAllByLabelText": [Function],
+  "queryAllByPlaceholderText": [Function],
+  "queryAllByRole": [Function],
+  "queryAllByTestId": [Function],
+  "queryAllByText": [Function],
+  "queryAllByTitle": [Function],
+  "queryByAltText": [Function],
+  "queryByDisplayValue": [Function],
+  "queryByLabelText": [Function],
+  "queryByPlaceholderText": [Function],
+  "queryByRole": [Function],
+  "queryByTestId": [Function],
+  "queryByText": [Function],
+  "queryByTitle": [Function],
+  "rerender": [Function],
+  "unmount": [Function],
+}
+`;
+
+exports[`TrustedAppsPage when the Add Trusted App button is clicked should display create form 1`] = `
+@media only screen and (min-width:575px) {
+
+}
+
+<div
+  class="euiForm"
+  data-test-subj="addTrustedAppFlyout-createForm"
 >
-  <TrustedAppsList />
-</AdministrationListPage>
+  <div
+    class="euiFormRow euiFormRow--fullWidth"
+    data-test-subj="addTrustedAppFlyout-createForm-nameRow"
+    id="mockId-row"
+  >
+    <div
+      class="euiFormRow__labelWrapper"
+    >
+      <label
+        class="euiFormLabel euiFormRow__label"
+        for="mockId"
+      >
+        Name your trusted app application
+      </label>
+    </div>
+    <div
+      class="euiFormRow__fieldWrapper"
+    >
+      <div
+        class="euiFormControlLayout euiFormControlLayout--fullWidth"
+      >
+        <div
+          class="euiFormControlLayout__childrenWrapper"
+        >
+          <input
+            class="euiFieldText euiFieldText--fullWidth"
+            data-test-subj="addTrustedAppFlyout-createForm-nameTextField"
+            id="mockId"
+            name="name"
+            type="text"
+            value=""
+          />
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    class="euiFormRow euiFormRow--fullWidth"
+    data-test-subj="addTrustedAppFlyout-createForm-OsRow"
+    id="mockId-row"
+  >
+    <div
+      class="euiFormRow__labelWrapper"
+    >
+      <label
+        class="euiFormLabel euiFormRow__label"
+        for="mockId"
+      >
+        Select operating system
+      </label>
+    </div>
+    <div
+      class="euiFormRow__fieldWrapper"
+    >
+      <div
+        class="euiPopover euiPopover--anchorDownCenter euiPopover--displayBlock euiSuperSelect euiSuperSelect--fullWidth"
+      >
+        <div
+          class="euiPopover__anchor"
+        >
+          <input
+            id="mockId"
+            name="os"
+            type="hidden"
+            value="windows"
+          />
+          <div
+            class="euiFormControlLayout euiFormControlLayout--fullWidth"
+          >
+            <div
+              class="euiFormControlLayout__childrenWrapper"
+            >
+              <span
+                class="euiScreenReaderOnly"
+                id="mockId"
+              >
+                Select an option: Windows, is selected
+              </span>
+              <button
+                aria-haspopup="true"
+                aria-labelledby="mockId mockId"
+                aria-selected="true"
+                class="euiSuperSelectControl euiSuperSelectControl--fullWidth"
+                data-test-subj="addTrustedAppFlyout-createForm-osSelectField"
+                role="option"
+                type="button"
+              >
+                Windows
+              </button>
+              <div
+                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right"
+              >
+                <span
+                  class="euiFormControlLayoutCustomIcon"
+                >
+                  <div
+                    aria-hidden="true"
+                    class="euiFormControlLayoutCustomIcon__icon"
+                    data-euiicon-type="arrowDown"
+                  />
+                </span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    class="euiFormRow euiFormRow--fullWidth"
+    data-test-subj="addTrustedAppFlyout-createForm-conditionsRow"
+    id="mockId-row"
+  >
+    <div
+      class="euiFormRow__fieldWrapper"
+    >
+      <div
+        data-test-subj="addTrustedAppFlyout-createForm-conditionsBuilder"
+      >
+        <div>
+          <div
+            class="euiFlexGroup euiFlexGroup--gutterExtraSmall euiFlexGroup--directionRow euiFlexGroup--responsive"
+            data-test-subj="addTrustedAppFlyout-createForm-conditionsBuilder-group1"
+          >
+            <div
+              class="euiFlexItem euiFlexItem--flexGrow1"
+            >
+              <div
+                class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+                data-test-subj="addTrustedAppFlyout-createForm-conditionsBuilder-group1-entry0"
+              >
+                <div
+                  class="euiFlexItem euiFlexItem--flexGrow2"
+                >
+                  <div
+                    class="euiFormRow euiFormRow--fullWidth"
+                    id="mockId-row"
+                  >
+                    <div
+                      class="euiFormRow__labelWrapper"
+                    >
+                      <label
+                        class="euiFormLabel euiFormRow__label"
+                        for="mockId"
+                      >
+                        Field
+                      </label>
+                    </div>
+                    <div
+                      class="euiFormRow__fieldWrapper"
+                    >
+                      <div
+                        class="euiPopover euiPopover--anchorDownCenter euiPopover--displayBlock euiSuperSelect"
+                      >
+                        <div
+                          class="euiPopover__anchor"
+                        >
+                          <input
+                            id="mockId"
+                            type="hidden"
+                            value="process.hash.*"
+                          />
+                          <div
+                            class="euiFormControlLayout"
+                          >
+                            <div
+                              class="euiFormControlLayout__childrenWrapper"
+                            >
+                              <span
+                                class="euiScreenReaderOnly"
+                                id="mockId"
+                              >
+                                Select an option: Hash, is selected
+                              </span>
+                              <button
+                                aria-haspopup="true"
+                                aria-labelledby="mockId mockId"
+                                aria-selected="true"
+                                class="euiSuperSelectControl"
+                                data-test-subj="addTrustedAppFlyout-createForm-conditionsBuilder-group1-entry0-field"
+                                role="option"
+                                type="button"
+                              >
+                                Hash
+                              </button>
+                              <div
+                                class="euiFormControlLayoutIcons euiFormControlLayoutIcons--right"
+                              >
+                                <span
+                                  class="euiFormControlLayoutCustomIcon"
+                                >
+                                  <div
+                                    aria-hidden="true"
+                                    class="euiFormControlLayoutCustomIcon__icon"
+                                    data-euiicon-type="arrowDown"
+                                  />
+                                </span>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  class="euiFlexItem"
+                >
+                  <div
+                    class="euiFormRow euiFormRow--fullWidth"
+                    id="mockId-row"
+                  >
+                    <div
+                      class="euiFormRow__labelWrapper"
+                    >
+                      <label
+                        class="euiFormLabel euiFormRow__label"
+                        for="mockId"
+                      >
+                        Operator
+                      </label>
+                    </div>
+                    <div
+                      class="euiFormRow__fieldWrapper"
+                    >
+                      <div
+                        class="euiFormControlLayout euiFormControlLayout--readOnly"
+                      >
+                        <div
+                          class="euiFormControlLayout__childrenWrapper"
+                        >
+                          <input
+                            class="euiFieldText"
+                            id="mockId"
+                            name="operator"
+                            readonly=""
+                            type="text"
+                            value="is"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  class="euiFlexItem euiFlexItem--flexGrow3"
+                >
+                  <div
+                    class="euiFormRow euiFormRow--fullWidth"
+                    id="mockId-row"
+                  >
+                    <div
+                      class="euiFormRow__labelWrapper"
+                    >
+                      <label
+                        class="euiFormLabel euiFormRow__label"
+                        for="mockId"
+                      >
+                        Value
+                      </label>
+                    </div>
+                    <div
+                      class="euiFormRow__fieldWrapper"
+                    >
+                      <div
+                        class="euiFormControlLayout"
+                      >
+                        <div
+                          class="euiFormControlLayout__childrenWrapper"
+                        >
+                          <input
+                            class="euiFieldText"
+                            data-test-subj="addTrustedAppFlyout-createForm-conditionsBuilder-group1-entry0-value"
+                            id="mockId"
+                            name="value"
+                            type="text"
+                            value=""
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  class="euiFlexItem euiFlexItem--flexGrowZero"
+                >
+                  <div
+                    class="euiFormRow euiFormRow--fullWidth"
+                    id="mockId-row"
+                  >
+                    <div
+                      class="euiFormRow__labelWrapper"
+                    >
+                      <label
+                        class="euiFormLabel euiFormRow__label"
+                        for="mockId"
+                      >
+                         
+                      </label>
+                    </div>
+                    <div
+                      class="euiFormRow__fieldWrapper"
+                    >
+                      <button
+                        aria-label="Remove Entry"
+                        class="euiButtonIcon euiButtonIcon--danger"
+                        disabled=""
+                        id="mockId"
+                        type="button"
+                      >
+                        <div
+                          aria-hidden="true"
+                          class="euiButtonIcon__icon"
+                          data-euiicon-type="trash"
+                        />
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="euiSpacer euiSpacer--s"
+        />
+        <button
+          class="euiButton euiButton--primary euiButton--small euiButton--fill"
+          data-test-subj="addTrustedAppFlyout-createForm-conditionsBuilder-AndButton"
+          style="min-width: 95px;"
+          type="button"
+        >
+          <span
+            class="euiButtonContent euiButton__content"
+          >
+            <div
+              class="euiButtonContent__icon"
+              data-euiicon-type="plusInCircle"
+            />
+            <span
+              class="euiButton__text"
+            >
+              AND
+            </span>
+          </span>
+        </button>
+      </div>
+    </div>
+  </div>
+  <div
+    class="euiFormRow euiFormRow--fullWidth"
+    data-test-subj="addTrustedAppFlyout-createForm-descriptionRow"
+    id="mockId-row"
+  >
+    <div
+      class="euiFormRow__labelWrapper"
+    >
+      <label
+        class="euiFormLabel euiFormRow__label"
+        for="mockId"
+      >
+        Description
+      </label>
+    </div>
+    <div
+      class="euiFormRow__fieldWrapper"
+    >
+      <textarea
+        class="euiTextArea euiTextArea--resizeVertical euiTextArea--fullWidth"
+        data-test-subj="addTrustedAppFlyout-createForm-descriptionField"
+        id="mockId"
+        name="description"
+        rows="6"
+      />
+    </div>
+  </div>
+</div>
 `;
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/create_trusted_app_flyout.tsx b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/create_trusted_app_flyout.tsx
new file mode 100644
index 0000000000000..cced85083348c
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/create_trusted_app_flyout.tsx
@@ -0,0 +1,152 @@
+/*
+ * 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 {
+  EuiButton,
+  EuiButtonEmpty,
+  EuiFlexGroup,
+  EuiFlexItem,
+  EuiFlyout,
+  EuiFlyoutBody,
+  EuiFlyoutFooter,
+  EuiFlyoutHeader,
+  EuiTitle,
+} from '@elastic/eui';
+import React, { memo, useCallback, useEffect, useState } from 'react';
+import { EuiFlyoutProps } from '@elastic/eui/src/components/flyout/flyout';
+import { FormattedMessage } from '@kbn/i18n/react';
+import { useDispatch } from 'react-redux';
+import { i18n } from '@kbn/i18n';
+import {
+  CreateTrustedAppForm,
+  CreateTrustedAppFormProps,
+  TrustedAppFormState,
+} from './create_trusted_app_form';
+import { useTrustedAppsSelector } from '../hooks';
+import { getApiCreateErrors, isCreatePending, wasCreateSuccessful } from '../../store/selectors';
+import { AppAction } from '../../../../../common/store/actions';
+import { useToasts } from '../../../../../common/lib/kibana';
+
+type CreateTrustedAppFlyoutProps = Omit<EuiFlyoutProps, 'hideCloseButton'>;
+export const CreateTrustedAppFlyout = memo<CreateTrustedAppFlyoutProps>(
+  ({ onClose, ...flyoutProps }) => {
+    const dispatch = useDispatch<(action: AppAction) => void>();
+    const toasts = useToasts();
+
+    const pendingCreate = useTrustedAppsSelector(isCreatePending);
+    const apiErrors = useTrustedAppsSelector(getApiCreateErrors);
+    const wasCreated = useTrustedAppsSelector(wasCreateSuccessful);
+
+    const [formState, setFormState] = useState<undefined | TrustedAppFormState>();
+    const dataTestSubj = flyoutProps['data-test-subj'];
+
+    const getTestId = useCallback(
+      (suffix: string): string | undefined => {
+        if (dataTestSubj) {
+          return `${dataTestSubj}-${suffix}`;
+        }
+      },
+      [dataTestSubj]
+    );
+    const handleCancelClick = useCallback(() => {
+      if (pendingCreate) {
+        return;
+      }
+      onClose();
+    }, [onClose, pendingCreate]);
+    const handleSaveClick = useCallback(() => {
+      if (formState) {
+        dispatch({
+          type: 'userClickedSaveNewTrustedAppButton',
+          payload: {
+            type: 'pending',
+            data: formState.item,
+          },
+        });
+      }
+    }, [dispatch, formState]);
+    const handleFormOnChange = useCallback<CreateTrustedAppFormProps['onChange']>(
+      (newFormState) => {
+        setFormState(newFormState);
+      },
+      []
+    );
+
+    // If it was created, then close flyout
+    useEffect(() => {
+      if (wasCreated) {
+        toasts.addSuccess(
+          i18n.translate(
+            'xpack.securitySolution.trustedapps.createTrustedAppFlyout.successToastTitle',
+            {
+              defaultMessage: '"{name}" has been added to the Trusted Applications list.',
+              values: { name: formState?.item.name },
+            }
+          )
+        );
+        onClose();
+      }
+    }, [formState?.item?.name, onClose, toasts, wasCreated]);
+
+    return (
+      <EuiFlyout onClose={handleCancelClick} {...flyoutProps} hideCloseButton={pendingCreate}>
+        <EuiFlyoutHeader hasBorder>
+          <EuiTitle size="m">
+            <h2 data-test-subj={getTestId('headerTitle')}>
+              <FormattedMessage
+                id="xpack.securitySolution.trustedapps.createTrustedAppFlyout.title"
+                defaultMessage="Add trusted application"
+              />
+            </h2>
+          </EuiTitle>
+        </EuiFlyoutHeader>
+
+        <EuiFlyoutBody>
+          <CreateTrustedAppForm
+            fullWidth
+            onChange={handleFormOnChange}
+            isInvalid={!!apiErrors}
+            error={apiErrors?.message}
+            data-test-subj={getTestId('createForm')}
+          />
+        </EuiFlyoutBody>
+
+        <EuiFlyoutFooter>
+          <EuiFlexGroup justifyContent="spaceBetween">
+            <EuiFlexItem grow={false}>
+              <EuiButtonEmpty
+                onClick={handleCancelClick}
+                flush="left"
+                isDisabled={pendingCreate}
+                data-test-subj={getTestId('cancelButton')}
+              >
+                <FormattedMessage
+                  id="xpack.securitySolution.trustedapps.createTrustedAppFlyout.cancelButton"
+                  defaultMessage="Cancel"
+                />
+              </EuiButtonEmpty>
+            </EuiFlexItem>
+            <EuiFlexItem grow={false}>
+              <EuiButton
+                onClick={handleSaveClick}
+                fill
+                isDisabled={!formState?.isValid || pendingCreate}
+                isLoading={pendingCreate}
+                data-test-subj={getTestId('createButton')}
+              >
+                <FormattedMessage
+                  id="xpack.securitySolution.trustedapps.createTrustedAppFlyout.saveButton"
+                  defaultMessage="Add trusted application"
+                />
+              </EuiButton>
+            </EuiFlexItem>
+          </EuiFlexGroup>
+        </EuiFlyoutFooter>
+      </EuiFlyout>
+    );
+  }
+);
+CreateTrustedAppFlyout.displayName = 'NewTrustedAppFlyout';
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/create_trusted_app_form.tsx b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/create_trusted_app_form.tsx
new file mode 100644
index 0000000000000..b6eb9795acd1d
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/create_trusted_app_form.tsx
@@ -0,0 +1,280 @@
+/*
+ * 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, { ChangeEventHandler, memo, useCallback, useEffect, useMemo, useState } from 'react';
+import {
+  EuiForm,
+  EuiFormRow,
+  EuiFieldText,
+  EuiSuperSelect,
+  EuiSuperSelectOption,
+  EuiTextArea,
+} from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import { EuiFormProps } from '@elastic/eui/src/components/form/form';
+import { TRUSTED_APPS_SUPPORTED_OS_TYPES } from '../../../../../../common/endpoint/constants';
+import { LogicalConditionBuilder } from './logical_condition';
+import {
+  MacosLinuxConditionEntry,
+  NewTrustedApp,
+  TrustedApp,
+} from '../../../../../../common/endpoint/types';
+import { LogicalConditionBuilderProps } from './logical_condition/logical_condition_builder';
+import { OS_TITLES } from '../constants';
+import {
+  isTrustedAppSupportedOs,
+  isWindowsTrustedApp,
+  isWindowsTrustedAppCondition,
+} from '../../state/type_guards';
+
+const generateNewEntry = (): NewTrustedApp['entries'][0] => {
+  return {
+    field: 'process.hash.*',
+    operator: 'included',
+    type: 'match',
+    value: '',
+  };
+};
+
+interface ValidationResult {
+  isValid: boolean;
+  errors: Partial<{ [k in keyof NewTrustedApp]: string }>;
+}
+const validateFormValues = (values: NewTrustedApp): ValidationResult => {
+  const errors: ValidationResult['errors'] = {};
+
+  if (!values.name.trim()) {
+    errors.name = 'Name is required';
+  }
+
+  if (!values.os) {
+    errors.os = 'OS is required';
+  }
+
+  if (!values.entries.length) {
+    errors.entries = 'At least one Field definition is required';
+  } else {
+    values.entries.some((entry, index) => {
+      if (!entry.field || !entry.value.trim()) {
+        errors.entries = `Field entry ${index + 1} must have a value`;
+        return true;
+      }
+      return false;
+    });
+  }
+
+  return {
+    isValid: Object.keys(errors).length === 0,
+    errors,
+  };
+};
+
+export interface TrustedAppFormState {
+  isValid: boolean;
+  item: NewTrustedApp;
+}
+export type CreateTrustedAppFormProps = Pick<
+  EuiFormProps,
+  'className' | 'data-test-subj' | 'isInvalid' | 'error' | 'invalidCallout'
+> & {
+  /** if form should be shown full width of parent container */
+  fullWidth?: boolean;
+  onChange: (state: TrustedAppFormState) => void;
+};
+export const CreateTrustedAppForm = memo<CreateTrustedAppFormProps>(
+  ({ fullWidth, onChange, ...formProps }) => {
+    const dataTestSubj = formProps['data-test-subj'];
+    const osOptions: Array<EuiSuperSelectOption<string>> = useMemo(() => {
+      return TRUSTED_APPS_SUPPORTED_OS_TYPES.map((os) => {
+        return {
+          value: os,
+          inputDisplay: OS_TITLES[os as TrustedApp['os']],
+        };
+      });
+    }, []);
+    const [formValues, setFormValues] = useState<NewTrustedApp>({
+      name: '',
+      os: 'windows',
+      entries: [generateNewEntry()],
+      description: '',
+    });
+    const getTestId = useCallback(
+      (suffix: string): string | undefined => {
+        if (dataTestSubj) {
+          return `${dataTestSubj}-${suffix}`;
+        }
+      },
+      [dataTestSubj]
+    );
+    const handleAndClick = useCallback(() => {
+      setFormValues(
+        (prevState): NewTrustedApp => {
+          if (isWindowsTrustedApp(prevState)) {
+            return {
+              ...prevState,
+              entries: [...prevState.entries, generateNewEntry()].filter((entry) =>
+                isWindowsTrustedAppCondition(entry)
+              ),
+            };
+          } else {
+            return {
+              ...prevState,
+              entries: [
+                ...prevState.entries.filter((entry) => !isWindowsTrustedAppCondition(entry)),
+                generateNewEntry(),
+              ] as MacosLinuxConditionEntry[],
+            };
+          }
+        }
+      );
+    }, [setFormValues]);
+    const handleDomChangeEvents = useCallback<
+      ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>
+    >(({ target: { name, value } }) => {
+      setFormValues(
+        (prevState): NewTrustedApp => {
+          return {
+            ...prevState,
+            [name]: value,
+          };
+        }
+      );
+    }, []);
+    const handleOsChange = useCallback<(v: string) => void>((newOsValue) => {
+      setFormValues(
+        (prevState): NewTrustedApp => {
+          if (isTrustedAppSupportedOs(newOsValue)) {
+            const updatedState: NewTrustedApp = {
+              ...prevState,
+              entries: [],
+              os: newOsValue,
+            };
+            if (!isWindowsTrustedApp(updatedState)) {
+              updatedState.entries.push(
+                ...(prevState.entries.filter(
+                  (entry) => !isWindowsTrustedAppCondition(entry)
+                ) as MacosLinuxConditionEntry[])
+              );
+            }
+            return updatedState;
+          }
+          return prevState;
+        }
+      );
+    }, []);
+    const handleEntryRemove = useCallback((entry: NewTrustedApp['entries'][0]) => {
+      setFormValues(
+        (prevState): NewTrustedApp => {
+          return {
+            ...prevState,
+            entries: prevState.entries.filter((item) => item !== entry),
+          } as NewTrustedApp;
+        }
+      );
+    }, []);
+    const handleEntryChange = useCallback<LogicalConditionBuilderProps['onEntryChange']>(
+      (newEntry, oldEntry) => {
+        setFormValues(
+          (prevState): NewTrustedApp => {
+            if (isWindowsTrustedApp(prevState)) {
+              return {
+                ...prevState,
+                entries: prevState.entries.map((item) => {
+                  if (item === oldEntry) {
+                    return newEntry;
+                  }
+                  return item;
+                }),
+              } as NewTrustedApp;
+            } else {
+              return {
+                ...prevState,
+                entries: prevState.entries.map((item) => {
+                  if (item === oldEntry) {
+                    return newEntry;
+                  }
+                  return item;
+                }),
+              } as NewTrustedApp;
+            }
+          }
+        );
+      },
+      []
+    );
+
+    // Anytime the form values change - validate and notify
+    useEffect(() => {
+      onChange({
+        isValid: validateFormValues(formValues).isValid,
+        item: formValues,
+      });
+    }, [formValues, onChange]);
+
+    return (
+      <EuiForm {...formProps} component="div">
+        <EuiFormRow
+          label={i18n.translate('xpack.securitySolution.trustedapps.create.name', {
+            defaultMessage: 'Name your trusted app application',
+          })}
+          fullWidth={fullWidth}
+          data-test-subj={getTestId('nameRow')}
+        >
+          <EuiFieldText
+            name="name"
+            value={formValues.name}
+            onChange={handleDomChangeEvents}
+            fullWidth
+            data-test-subj={getTestId('nameTextField')}
+          />
+        </EuiFormRow>
+        <EuiFormRow
+          label={i18n.translate('xpack.securitySolution.trustedapps.create.os', {
+            defaultMessage: 'Select operating system',
+          })}
+          fullWidth={fullWidth}
+          data-test-subj={getTestId('OsRow')}
+        >
+          <EuiSuperSelect
+            name="os"
+            options={osOptions}
+            valueOfSelected={formValues.os}
+            onChange={handleOsChange}
+            fullWidth
+            data-test-subj={getTestId('osSelectField')}
+          />
+        </EuiFormRow>
+        <EuiFormRow fullWidth={fullWidth} data-test-subj={getTestId('conditionsRow')}>
+          <LogicalConditionBuilder
+            entries={formValues.entries}
+            os={formValues.os}
+            onAndClicked={handleAndClick}
+            onEntryRemove={handleEntryRemove}
+            onEntryChange={handleEntryChange}
+            data-test-subj={getTestId('conditionsBuilder')}
+          />
+        </EuiFormRow>
+        <EuiFormRow
+          label={i18n.translate('xpack.securitySolution.trustedapps.create.description', {
+            defaultMessage: 'Description',
+          })}
+          fullWidth={fullWidth}
+          data-test-subj={getTestId('descriptionRow')}
+        >
+          <EuiTextArea
+            name="description"
+            value={formValues.description}
+            onChange={handleDomChangeEvents}
+            fullWidth
+            data-test-subj={getTestId('descriptionField')}
+          />
+        </EuiFormRow>
+      </EuiForm>
+    );
+  }
+);
+
+CreateTrustedAppForm.displayName = 'NewTrustedAppForm';
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/components/condition_entry.tsx b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/components/condition_entry.tsx
new file mode 100644
index 0000000000000..23bced0c048b1
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/components/condition_entry.tsx
@@ -0,0 +1,188 @@
+/*
+ * 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, { ChangeEventHandler, memo, useCallback, useMemo } from 'react';
+import {
+  EuiFlexGroup,
+  EuiFlexItem,
+  EuiFormRow,
+  EuiSuperSelect,
+  EuiFieldText,
+  EuiButtonIcon,
+  EuiSuperSelectOption,
+} from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import { TrustedApp } from '../../../../../../../../common/endpoint/types';
+
+const ConditionEntryCell = memo<{
+  showLabel: boolean;
+  label?: string;
+  children: React.ReactElement;
+}>(({ showLabel, label = '', children }) => {
+  return showLabel ? (
+    <EuiFormRow label={label} fullWidth>
+      {children}
+    </EuiFormRow>
+  ) : (
+    <>{children}</>
+  );
+});
+
+ConditionEntryCell.displayName = 'ConditionEntryCell';
+
+export interface ConditionEntryProps {
+  // FIXME:PT probably need to adjust below types to match what is done in `TrustedApp` type
+  os: TrustedApp['os'];
+  entry: TrustedApp['entries'][0];
+  /** controls if remove button is enabled/disabled */
+  isRemoveDisabled?: boolean;
+  /** If the labels for each Column in the input row should be shown. Normally set on the first row entry */
+  showLabels: boolean;
+  onRemove: (entry: TrustedApp['entries'][0]) => void;
+  onChange: (newEntry: TrustedApp['entries'][0], oldEntry: TrustedApp['entries'][0]) => void;
+  'data-test-subj'?: string;
+}
+export const ConditionEntry = memo<ConditionEntryProps>(
+  ({
+    entry,
+    showLabels = false,
+    onRemove,
+    onChange,
+    isRemoveDisabled = false,
+    'data-test-subj': dataTestSubj,
+  }) => {
+    const getTestId = useCallback(
+      (suffix: string): string | undefined => {
+        if (dataTestSubj) {
+          return `${dataTestSubj}-${suffix}`;
+        }
+      },
+      [dataTestSubj]
+    );
+    const fieldOptions = useMemo<Array<EuiSuperSelectOption<string>>>(() => {
+      return [
+        {
+          inputDisplay: i18n.translate(
+            'xpack.securitySolution.trustedapps.logicalConditionBuilder.entry.field.hash',
+            { defaultMessage: 'Hash' }
+          ),
+          value: 'process.hash.*',
+        },
+        {
+          inputDisplay: i18n.translate(
+            'xpack.securitySolution.trustedapps.logicalConditionBuilder.entry.field.path',
+            { defaultMessage: 'Path' }
+          ),
+          value: 'process.path',
+        },
+      ];
+    }, []);
+    const handleValueUpdate = useCallback<ChangeEventHandler<HTMLInputElement>>(
+      (ev) => {
+        onChange(
+          {
+            ...entry,
+            value: ev.target.value,
+          },
+          entry
+        );
+      },
+      [entry, onChange]
+    );
+    const handleFieldUpdate = useCallback(
+      (newField) => {
+        onChange(
+          {
+            ...entry,
+            field: newField,
+          },
+          entry
+        );
+      },
+      [entry, onChange]
+    );
+    const handleRemoveClick = useCallback(() => {
+      onRemove(entry);
+    }, [entry, onRemove]);
+
+    return (
+      <EuiFlexGroup
+        gutterSize="s"
+        alignItems="center"
+        direction="row"
+        data-test-subj={dataTestSubj}
+      >
+        <EuiFlexItem grow={2}>
+          <ConditionEntryCell
+            showLabel={showLabels}
+            label={i18n.translate(
+              'xpack.securitySolution.trustedapps.logicalConditionBuilder.entry.field',
+              { defaultMessage: 'Field' }
+            )}
+          >
+            <EuiSuperSelect
+              options={fieldOptions}
+              valueOfSelected={entry.field}
+              onChange={handleFieldUpdate}
+              data-test-subj={getTestId('field')}
+            />
+          </ConditionEntryCell>
+        </EuiFlexItem>
+        <EuiFlexItem>
+          <ConditionEntryCell
+            showLabel={showLabels}
+            label={i18n.translate(
+              'xpack.securitySolution.trustedapps.logicalConditionBuilder.entry.operator',
+              { defaultMessage: 'Operator' }
+            )}
+          >
+            <EuiFieldText
+              name="operator"
+              value={i18n.translate(
+                'xpack.securitySolution.trustedapps.logicalConditionBuilder.entry.operator.is',
+                { defaultMessage: 'is' }
+              )}
+              readOnly
+            />
+          </ConditionEntryCell>
+        </EuiFlexItem>
+        <EuiFlexItem grow={3}>
+          <ConditionEntryCell
+            showLabel={showLabels}
+            label={i18n.translate(
+              'xpack.securitySolution.trustedapps.logicalConditionBuilder.entry.value',
+              { defaultMessage: 'Value' }
+            )}
+          >
+            <EuiFieldText
+              name="value"
+              value={entry.value}
+              onChange={handleValueUpdate}
+              data-test-subj={getTestId('value')}
+            />
+          </ConditionEntryCell>
+        </EuiFlexItem>
+        <EuiFlexItem grow={false}>
+          {/* Unicode `nbsp` is used below so that Remove button is property displayed */}
+          <ConditionEntryCell showLabel={showLabels} label={'\u00A0'}>
+            <EuiButtonIcon
+              color="danger"
+              iconType="trash"
+              onClick={handleRemoveClick}
+              isDisabled={isRemoveDisabled}
+              aria-label={i18n.translate(
+                'xpack.securitySolution.trustedapps.logicalConditionBuilder.entry.removeLabel',
+                { defaultMessage: 'Remove Entry' }
+              )}
+            />
+          </ConditionEntryCell>
+        </EuiFlexItem>
+      </EuiFlexGroup>
+    );
+  }
+);
+
+ConditionEntry.displayName = 'ConditionEntry';
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/components/condition_group.tsx b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/components/condition_group.tsx
new file mode 100644
index 0000000000000..323eddbaf8648
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/components/condition_group.tsx
@@ -0,0 +1,61 @@
+/*
+ * 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, { memo, useCallback } from 'react';
+import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
+import styled from 'styled-components';
+import { NewTrustedApp, TrustedApp } from '../../../../../../../../common/endpoint/types';
+import { ConditionEntry, ConditionEntryProps } from './condition_entry';
+import { AndOrBadge } from '../../../../../../../common/components/and_or_badge';
+
+const AndBadgeFlexItem = styled(EuiFlexItem)`
+  padding-top: 20px;
+`;
+
+export interface ConditionGroupProps {
+  os: TrustedApp['os'];
+  entries: TrustedApp['entries'];
+  onEntryRemove: ConditionEntryProps['onRemove'];
+  onEntryChange: ConditionEntryProps['onChange'];
+  'data-test-subj'?: string;
+}
+export const ConditionGroup = memo<ConditionGroupProps>(
+  ({ os, entries, onEntryRemove, onEntryChange, 'data-test-subj': dataTestSubj }) => {
+    const getTestId = useCallback(
+      (suffix: string): string | undefined => {
+        if (dataTestSubj) {
+          return `${dataTestSubj}-${suffix}`;
+        }
+      },
+      [dataTestSubj]
+    );
+    return (
+      <EuiFlexGroup gutterSize="xs" data-test-subj={dataTestSubj}>
+        {entries.length > 1 && (
+          <AndBadgeFlexItem grow={false}>
+            <AndOrBadge type={'and'} includeAntennas={true} />
+          </AndBadgeFlexItem>
+        )}
+        <EuiFlexItem grow={1}>
+          {(entries as (NewTrustedApp & { os: 'windows' })['entries']).map((entry, index) => (
+            <ConditionEntry
+              key={index}
+              os={os}
+              entry={entry}
+              showLabels={index === 0}
+              isRemoveDisabled={index === 0 && entries.length <= 1}
+              onRemove={onEntryRemove}
+              onChange={onEntryChange}
+              data-test-subj={getTestId(`entry${index}`)}
+            />
+          ))}
+        </EuiFlexItem>
+      </EuiFlexGroup>
+    );
+  }
+);
+
+ConditionGroup.displayName = 'ConditionGroup';
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/index.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/index.ts
new file mode 100644
index 0000000000000..944a30abd73d3
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/index.ts
@@ -0,0 +1,7 @@
+/*
+ * 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.
+ */
+
+export { LogicalConditionBuilder } from './logical_condition_builder';
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/logical_condition_builder.tsx b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/logical_condition_builder.tsx
new file mode 100644
index 0000000000000..e5e84acd0c4ad
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/logical_condition/logical_condition_builder.tsx
@@ -0,0 +1,89 @@
+/*
+ * 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, { memo, useCallback } from 'react';
+import { EuiButton, CommonProps, EuiText, EuiSpacer } from '@elastic/eui';
+import { FormattedMessage } from '@kbn/i18n/react';
+import { ConditionGroup, ConditionGroupProps } from './components/condition_group';
+
+const BUTTON_MIN_WIDTH = Object.freeze({ minWidth: '95px' });
+
+export type LogicalConditionBuilderProps = CommonProps &
+  ConditionGroupProps & {
+    onAndClicked: () => void;
+    isAndDisabled?: boolean;
+  };
+export const LogicalConditionBuilder = memo<LogicalConditionBuilderProps>(
+  ({
+    entries,
+    os,
+    className,
+    isAndDisabled = false,
+    onAndClicked,
+    onEntryRemove,
+    onEntryChange,
+    'data-test-subj': dataTestSubj,
+  }) => {
+    const getTestId = useCallback(
+      (suffix: string): string | undefined => {
+        if (dataTestSubj) {
+          return `${dataTestSubj}-${suffix}`;
+        }
+      },
+      [dataTestSubj]
+    );
+    return (
+      <div data-test-subj={dataTestSubj} className={className}>
+        <div>
+          {entries.length === 0 ? (
+            <NoEntries />
+          ) : (
+            <ConditionGroup
+              os={os}
+              entries={entries}
+              onEntryRemove={onEntryRemove}
+              onEntryChange={onEntryChange}
+              data-test-subj={getTestId('group1')}
+            />
+          )}
+        </div>
+        <EuiSpacer size="s" />
+        <EuiButton
+          fill
+          size="s"
+          iconType="plusInCircle"
+          onClick={onAndClicked}
+          data-test-subj={getTestId('AndButton')}
+          isDisabled={isAndDisabled}
+          style={BUTTON_MIN_WIDTH}
+        >
+          <FormattedMessage
+            id="xpack.securitySolution.trustedapps.logicalConditionBuilder.andOperator"
+            defaultMessage="AND"
+          />
+        </EuiButton>
+      </div>
+    );
+  }
+);
+
+LogicalConditionBuilder.displayName = 'LogicalConditionBuilder';
+
+// FIXME:PT need to style this better.
+const NoEntries = memo(() => {
+  return (
+    <div>
+      <EuiText>
+        <FormattedMessage
+          id="xpack.securitySolution.trustedapps.logicalConditionBuilder.noEntries"
+          defaultMessage="No entries"
+        />
+      </EuiText>
+    </div>
+  );
+});
+
+NoEntries.displayName = 'NoEntries';
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/constants.ts b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/constants.ts
new file mode 100644
index 0000000000000..d5df8c528511a
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/constants.ts
@@ -0,0 +1,20 @@
+/*
+ * 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 { i18n } from '@kbn/i18n';
+import { TrustedApp } from '../../../../../common/endpoint/types';
+
+export const OS_TITLES: Readonly<{ [K in TrustedApp['os']]: string }> = {
+  windows: i18n.translate('xpack.securitySolution.trustedapps.os.windows', {
+    defaultMessage: 'Windows',
+  }),
+  macos: i18n.translate('xpack.securitySolution.trustedapps.os.macos', {
+    defaultMessage: 'Mac OS',
+  }),
+  linux: i18n.translate('xpack.securitySolution.trustedapps.os.linux', {
+    defaultMessage: 'Linux',
+  }),
+};
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_list.tsx b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_list.tsx
index a9077dd84913e..ea834060d5223 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_list.tsx
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_list.tsx
@@ -26,18 +26,7 @@ import {
 import { useTrustedAppsSelector } from './hooks';
 
 import { FormattedDate } from '../../../../common/components/formatted_date';
-
-const OS_TITLES: Readonly<{ [K in TrustedApp['os']]: string }> = {
-  windows: i18n.translate('xpack.securitySolution.trustedapps.os.windows', {
-    defaultMessage: 'Windows',
-  }),
-  macos: i18n.translate('xpack.securitySolution.trustedapps.os.macos', {
-    defaultMessage: 'Mac OS',
-  }),
-  linux: i18n.translate('xpack.securitySolution.trustedapps.os.linux', {
-    defaultMessage: 'Linux',
-  }),
-};
+import { OS_TITLES } from './constants';
 
 const COLUMN_TITLES: Readonly<{ [K in keyof Omit<TrustedApp, 'id' | 'entries'>]: string }> = {
   name: i18n.translate('xpack.securitySolution.trustedapps.list.columns.name', {
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_page.test.tsx b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_page.test.tsx
index cc7dbd42d7a7d..c0c9cdf227643 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_page.test.tsx
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_page.test.tsx
@@ -3,13 +3,273 @@
  * or more contributor license agreements. Licensed under the Elastic License;
  * you may not use this file except in compliance with the Elastic License.
  */
-import { shallow } from 'enzyme';
 import React from 'react';
-
+import * as reactTestingLibrary from '@testing-library/react';
 import { TrustedAppsPage } from './trusted_apps_page';
+import { AppContextTestRender, createAppRootMockRenderer } from '../../../../common/mock/endpoint';
+import { fireEvent } from '@testing-library/dom';
+import { MiddlewareActionSpyHelper } from '../../../../common/store/test_utils';
+import { NewTrustedApp, PostTrustedAppCreateResponse } from '../../../../../common/endpoint/types';
+import { HttpFetchOptions } from 'kibana/public';
+
+jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => ({
+  htmlIdGenerator: () => () => 'mockId',
+}));
 
 describe('TrustedAppsPage', () => {
+  let history: AppContextTestRender['history'];
+  let coreStart: AppContextTestRender['coreStart'];
+  let waitForAction: MiddlewareActionSpyHelper['waitForAction'];
+  let render: () => ReturnType<AppContextTestRender['render']>;
+
+  beforeEach(() => {
+    const mockedContext = createAppRootMockRenderer();
+
+    history = mockedContext.history;
+    coreStart = mockedContext.coreStart;
+    waitForAction = mockedContext.middlewareSpy.waitForAction;
+    render = () => mockedContext.render(<TrustedAppsPage />);
+    reactTestingLibrary.act(() => {
+      history.push('/trusted_apps');
+    });
+  });
+
   test('rendering', () => {
-    expect(shallow(<TrustedAppsPage />)).toMatchSnapshot();
+    expect(render()).toMatchSnapshot();
+  });
+
+  it('should display a Add Trusted App button', async () => {
+    const { getByTestId } = render();
+    const addButton = await getByTestId('trustedAppsListAddButton');
+    expect(addButton.textContent).toBe('Add Trusted Application');
+  });
+
+  describe('when the Add Trusted App button is clicked', () => {
+    const renderAndClickAddButton = async (): Promise<
+      ReturnType<AppContextTestRender['render']>
+    > => {
+      const renderResult = render();
+      const addButton = renderResult.getByTestId('trustedAppsListAddButton');
+      reactTestingLibrary.act(() => {
+        fireEvent.click(addButton, { button: 1 });
+      });
+      return renderResult;
+    };
+
+    it('should display the create flyout', async () => {
+      const { getByTestId } = await renderAndClickAddButton();
+      const flyout = getByTestId('addTrustedAppFlyout');
+      expect(flyout).not.toBeNull();
+
+      const flyoutTitle = getByTestId('addTrustedAppFlyout-headerTitle');
+      expect(flyoutTitle.textContent).toBe('Add trusted application');
+    });
+
+    it('should update the URL to indicate the flyout is opened', async () => {
+      await renderAndClickAddButton();
+      expect(/show\=create/.test(history.location.search)).toBe(true);
+    });
+
+    it('should preserve other URL search params', async () => {
+      reactTestingLibrary.act(() => {
+        history.push('/trusted_apps?page_index=2&page_size=20');
+      });
+      await renderAndClickAddButton();
+      expect(history.location.search).toBe('?page_index=2&page_size=20&show=create');
+    });
+
+    it('should display create form', async () => {
+      const { getByTestId } = await renderAndClickAddButton();
+      expect(getByTestId('addTrustedAppFlyout-createForm')).toMatchSnapshot();
+    });
+
+    it('should initially have the flyout Add button disabled', async () => {
+      const { getByTestId } = await renderAndClickAddButton();
+      expect((getByTestId('addTrustedAppFlyout-createButton') as HTMLButtonElement).disabled).toBe(
+        true
+      );
+    });
+
+    it('should close flyout if cancel button is clicked', async () => {
+      const { getByTestId, queryByTestId } = await renderAndClickAddButton();
+      const cancelButton = getByTestId('addTrustedAppFlyout-cancelButton');
+      reactTestingLibrary.act(() => {
+        fireEvent.click(cancelButton, { button: 1 });
+      });
+      expect(queryByTestId('addTrustedAppFlyout')).toBeNull();
+      expect(history.location.search).toBe('');
+    });
+
+    it('should close flyout if flyout close button is clicked', async () => {
+      const { getByTestId, queryByTestId } = await renderAndClickAddButton();
+      const flyoutCloseButton = getByTestId('euiFlyoutCloseButton');
+      reactTestingLibrary.act(() => {
+        fireEvent.click(flyoutCloseButton, { button: 1 });
+      });
+      expect(queryByTestId('addTrustedAppFlyout')).toBeNull();
+      expect(history.location.search).toBe('');
+    });
+
+    describe('and when the form data is valid', () => {
+      const fillInCreateForm = ({ getByTestId }: ReturnType<AppContextTestRender['render']>) => {
+        reactTestingLibrary.act(() => {
+          fireEvent.change(getByTestId('addTrustedAppFlyout-createForm-nameTextField'), {
+            target: { value: 'trusted app A' },
+          });
+
+          fireEvent.change(
+            getByTestId('addTrustedAppFlyout-createForm-conditionsBuilder-group1-entry0-value'),
+            { target: { value: 'SOME$HASH#HERE' } }
+          );
+
+          fireEvent.change(getByTestId('addTrustedAppFlyout-createForm-descriptionField'), {
+            target: { value: 'let this be' },
+          });
+        });
+      };
+
+      it('should enable the Flyout Add button', async () => {
+        const renderResult = await renderAndClickAddButton();
+        const { getByTestId } = renderResult;
+        fillInCreateForm(renderResult);
+        const flyoutAddButton = getByTestId(
+          'addTrustedAppFlyout-createButton'
+        ) as HTMLButtonElement;
+        expect(flyoutAddButton.disabled).toBe(false);
+      });
+
+      describe('and the Flyout Add button is clicked', () => {
+        let renderResult: ReturnType<AppContextTestRender['render']>;
+        let resolveHttpPost: (response?: PostTrustedAppCreateResponse) => void;
+        let httpPostBody: string;
+        let rejectHttpPost: (response: Error) => void;
+
+        beforeEach(async () => {
+          // Mock the http.post() call and expose `resolveHttpPost()` method so that
+          // we can control when the API call response is returned, which will allow us
+          // to test the UI behaviours while the API call is in flight
+          coreStart.http.post.mockImplementation(
+            // @ts-ignore
+            async (path: string, options: HttpFetchOptions) => {
+              return new Promise((resolve, reject) => {
+                httpPostBody = options.body as string;
+                resolveHttpPost = resolve;
+                rejectHttpPost = reject;
+              });
+            }
+          );
+
+          renderResult = await renderAndClickAddButton();
+          fillInCreateForm(renderResult);
+          const userClickedSaveActionWatcher = waitForAction('userClickedSaveNewTrustedAppButton');
+          reactTestingLibrary.act(() => {
+            fireEvent.click(renderResult.getByTestId('addTrustedAppFlyout-createButton'), {
+              button: 1,
+            });
+          });
+          await reactTestingLibrary.act(async () => {
+            await userClickedSaveActionWatcher;
+          });
+        });
+
+        afterEach(() => resolveHttpPost());
+
+        it('should disable the Cancel button', async () => {
+          expect(
+            (renderResult.getByTestId('addTrustedAppFlyout-cancelButton') as HTMLButtonElement)
+              .disabled
+          ).toBe(true);
+          resolveHttpPost();
+        });
+
+        it('should hide the dialog close button', async () => {
+          expect(renderResult.queryByTestId('euiFlyoutCloseButton')).toBeNull();
+        });
+
+        it('should disable the flyout Add button and set it to loading', async () => {
+          const saveButton = renderResult.getByTestId(
+            'addTrustedAppFlyout-createButton'
+          ) as HTMLButtonElement;
+          expect(saveButton.disabled).toBe(true);
+          expect(saveButton.querySelector('.euiLoadingSpinner')).not.toBeNull();
+        });
+
+        describe('and if create was successful', () => {
+          beforeEach(async () => {
+            const successCreateApiResponse: PostTrustedAppCreateResponse = {
+              data: {
+                ...(JSON.parse(httpPostBody) as NewTrustedApp),
+                id: '1',
+                created_at: '2020-09-16T14:09:45.484Z',
+                created_by: 'kibana',
+              },
+            };
+            await reactTestingLibrary.act(async () => {
+              const serverResponseAction = waitForAction('serverReturnedCreateTrustedAppSuccess');
+              coreStart.http.get.mockClear();
+              resolveHttpPost(successCreateApiResponse);
+              await serverResponseAction;
+            });
+          });
+
+          it('should close the flyout', async () => {
+            expect(renderResult.queryByTestId('addTrustedAppFlyout')).toBeNull();
+          });
+
+          it('should show success toast notification', async () => {
+            expect(coreStart.notifications.toasts.addSuccess.mock.calls[0][0]).toEqual(
+              '"trusted app A" has been added to the Trusted Applications list.'
+            );
+          });
+
+          it('should trigger the List to reload', async () => {
+            expect(coreStart.http.get.mock.calls[0][0]).toEqual('/api/endpoint/trusted_apps');
+          });
+        });
+
+        describe('and if create failed', () => {
+          beforeEach(async () => {
+            const failedCreateApiResponse: Error & { body?: { message: string } } = new Error(
+              'Bad call'
+            );
+            failedCreateApiResponse.body = {
+              message: 'bad call',
+            };
+            await reactTestingLibrary.act(async () => {
+              const serverResponseAction = waitForAction('serverReturnedCreateTrustedAppFailure');
+              coreStart.http.get.mockClear();
+              rejectHttpPost(failedCreateApiResponse);
+              await serverResponseAction;
+            });
+          });
+
+          it('should continue to show the flyout', async () => {
+            expect(renderResult.getByTestId('addTrustedAppFlyout')).not.toBeNull();
+          });
+
+          it('should enable the Cancel Button', async () => {
+            expect(
+              (renderResult.getByTestId('addTrustedAppFlyout-cancelButton') as HTMLButtonElement)
+                .disabled
+            ).toBe(false);
+          });
+
+          it('should show the dialog close button', async () => {
+            expect(renderResult.getByTestId('euiFlyoutCloseButton')).not.toBeNull();
+          });
+
+          it('should enable the flyout Add button and remove loading indicating', () => {
+            expect(
+              (renderResult.getByTestId('addTrustedAppFlyout-createButton') as HTMLButtonElement)
+                .disabled
+            ).toBe(false);
+          });
+
+          it('should show API errors in the form', async () => {
+            expect(renderResult.container.querySelector('.euiForm__errors')).not.toBeNull();
+          });
+        });
+      });
+    });
   });
 });
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_page.tsx b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_page.tsx
index c0d3b9cd699de..a0dae900eb30e 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_page.tsx
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/trusted_apps_page.tsx
@@ -3,12 +3,49 @@
  * 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, { memo } from 'react';
+import React, { memo, useCallback } from 'react';
 import { FormattedMessage } from '@kbn/i18n/react';
+import { EuiButton } from '@elastic/eui';
+import { useHistory } from 'react-router-dom';
 import { AdministrationListPage } from '../../../components/administration_list_page';
 import { TrustedAppsList } from './trusted_apps_list';
+import { CreateTrustedAppFlyout } from './components/create_trusted_app_flyout';
+import { getTrustedAppsListPath } from '../../../common/routing';
+import { useTrustedAppsSelector } from './hooks';
+import { getListCurrentShowValue, getListUrlSearchParams } from '../store/selectors';
 
 export const TrustedAppsPage = memo(() => {
+  const history = useHistory();
+  const urlParams = useTrustedAppsSelector(getListUrlSearchParams);
+  const showAddFlout = useTrustedAppsSelector(getListCurrentShowValue) === 'create';
+  const handleAddButtonClick = useCallback(() => {
+    history.push(
+      getTrustedAppsListPath({
+        ...urlParams,
+        show: 'create',
+      })
+    );
+  }, [history, urlParams]);
+  const handleAddFlyoutClose = useCallback(() => {
+    const { show, ...paginationParamsOnly } = urlParams;
+    history.push(getTrustedAppsListPath(paginationParamsOnly));
+  }, [history, urlParams]);
+
+  const addButton = (
+    <EuiButton
+      fill
+      iconType="plusInCircle"
+      isDisabled={showAddFlout}
+      onClick={handleAddButtonClick}
+      data-test-subj="trustedAppsListAddButton"
+    >
+      <FormattedMessage
+        id="xpack.securitySolution.trustedapps.list.addButton"
+        defaultMessage="Add Trusted Application"
+      />
+    </EuiButton>
+  );
+
   return (
     <AdministrationListPage
       beta={true}
@@ -24,7 +61,15 @@ export const TrustedAppsPage = memo(() => {
           defaultMessage="View and configure trusted applications"
         />
       }
+      actions={addButton}
     >
+      {showAddFlout && (
+        <CreateTrustedAppFlyout
+          onClose={handleAddFlyoutClose}
+          size="s"
+          data-test-subj="addTrustedAppFlyout"
+        />
+      )}
       <TrustedAppsList />
     </AdministrationListPage>
   );
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/trusted_apps/trusted_apps.test.ts b/x-pack/plugins/security_solution/server/endpoint/routes/trusted_apps/trusted_apps.test.ts
index eeee2d99bf26d..35d0bf1116148 100644
--- a/x-pack/plugins/security_solution/server/endpoint/routes/trusted_apps/trusted_apps.test.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/trusted_apps/trusted_apps.test.ts
@@ -144,7 +144,7 @@ describe('when invoking endpoint trusted apps route handlers', () => {
       os: 'windows',
       entries: [
         {
-          field: 'path',
+          field: 'process.path',
           type: 'match',
           operator: 'included',
           value: 'c:/programs files/Anti-Virus',
@@ -197,7 +197,7 @@ describe('when invoking endpoint trusted apps route handlers', () => {
         description: 'this one is ok',
         entries: [
           {
-            field: 'path',
+            field: 'process.path',
             operator: 'included',
             type: 'match',
             value: 'c:/programs files/Anti-Virus',
@@ -224,7 +224,7 @@ describe('when invoking endpoint trusted apps route handlers', () => {
             description: 'this one is ok',
             entries: [
               {
-                field: 'path',
+                field: 'process.path',
                 operator: 'included',
                 type: 'match',
                 value: 'c:/programs files/Anti-Virus',

From b3aabe98aa6b6d80fc4a2776320fd65909de2e8a Mon Sep 17 00:00:00 2001
From: Josh Dover <me@joshdover.com>
Date: Wed, 16 Sep 2020 14:24:11 -0600
Subject: [PATCH 07/19] Migrate /api/settings to KP (#77554)

---
 docs/developer/plugin-list.asciidoc           |   4 +
 .../server/context/context_service.mock.ts    |   4 +-
 src/core/server/mocks.ts                      |   1 +
 src/core/utils/context.mock.ts                |   8 +-
 x-pack/legacy/plugins/xpack_main/index.js     |   3 +-
 .../xpack_main/server/routes/api/v1/index.js  |   1 -
 .../server/routes/api/v1/settings.js          |  68 ------------
 x-pack/plugins/monitoring/server/index.ts     |   1 +
 .../collectors/get_settings_collector.ts      |  14 ++-
 .../kibana_monitoring/collectors/index.ts     |   2 +
 x-pack/plugins/xpack_legacy/README.md         |   3 +
 x-pack/plugins/xpack_legacy/kibana.json       |  10 ++
 x-pack/plugins/xpack_legacy/server/index.ts   |  11 ++
 x-pack/plugins/xpack_legacy/server/plugin.ts  |  48 ++++++++
 .../server/routes/settings.test.ts            | 105 ++++++++++++++++++
 .../xpack_legacy/server/routes/settings.ts    |  93 ++++++++++++++++
 x-pack/test/api_integration/apis/index.js     |   2 +-
 .../{xpack_main => xpack_legacy}/index.js     |   2 +-
 .../settings/index.js                         |   0
 .../settings/settings.js                      |   0
 20 files changed, 298 insertions(+), 82 deletions(-)
 delete mode 100644 x-pack/legacy/plugins/xpack_main/server/routes/api/v1/settings.js
 create mode 100644 x-pack/plugins/xpack_legacy/README.md
 create mode 100644 x-pack/plugins/xpack_legacy/kibana.json
 create mode 100644 x-pack/plugins/xpack_legacy/server/index.ts
 create mode 100644 x-pack/plugins/xpack_legacy/server/plugin.ts
 create mode 100644 x-pack/plugins/xpack_legacy/server/routes/settings.test.ts
 create mode 100644 x-pack/plugins/xpack_legacy/server/routes/settings.ts
 rename x-pack/test/api_integration/apis/{xpack_main => xpack_legacy}/index.js (90%)
 rename x-pack/test/api_integration/apis/{xpack_main => xpack_legacy}/settings/index.js (100%)
 rename x-pack/test/api_integration/apis/{xpack_main => xpack_legacy}/settings/settings.js (100%)

diff --git a/docs/developer/plugin-list.asciidoc b/docs/developer/plugin-list.asciidoc
index 7727cd322181f..501a3698d07d9 100644
--- a/docs/developer/plugin-list.asciidoc
+++ b/docs/developer/plugin-list.asciidoc
@@ -494,6 +494,10 @@ in their infrastructure.
 |This plugins adopts some conventions in addition to or in place of conventions in Kibana (at the time of the plugin's creation):
 
 
+|{kib-repo}blob/{branch}/x-pack/plugins/xpack_legacy/README.md[xpackLegacy]
+|Contains HTTP endpoints and UiSettings that are slated for removal.
+
+
 |===
 
 include::{kibana-root}/src/plugins/dashboard/README.asciidoc[leveloffset=+1]
diff --git a/src/core/server/context/context_service.mock.ts b/src/core/server/context/context_service.mock.ts
index a8d895acad624..24e0d52100bb1 100644
--- a/src/core/server/context/context_service.mock.ts
+++ b/src/core/server/context/context_service.mock.ts
@@ -21,9 +21,9 @@ import type { PublicMethodsOf } from '@kbn/utility-types';
 import { ContextService, ContextSetup } from './context_service';
 import { contextMock } from '../../utils/context.mock';
 
-const createSetupContractMock = () => {
+const createSetupContractMock = (mockContext = {}) => {
   const setupContract: jest.Mocked<ContextSetup> = {
-    createContextContainer: jest.fn().mockImplementation(() => contextMock.create()),
+    createContextContainer: jest.fn().mockImplementation(() => contextMock.create(mockContext)),
   };
   return setupContract;
 };
diff --git a/src/core/server/mocks.ts b/src/core/server/mocks.ts
index 52dccb6880882..2f995ff915293 100644
--- a/src/core/server/mocks.ts
+++ b/src/core/server/mocks.ts
@@ -52,6 +52,7 @@ export { typeRegistryMock as savedObjectsTypeRegistryMock } from './saved_object
 export { uiSettingsServiceMock } from './ui_settings/ui_settings_service.mock';
 export { metricsServiceMock } from './metrics/metrics_service.mock';
 export { renderingMock } from './rendering/rendering_service.mock';
+export { contextServiceMock } from './context/context_service.mock';
 
 export function pluginInitializerContextConfigMock<T>(config: T) {
   const globalConfig: SharedGlobalConfig = {
diff --git a/src/core/utils/context.mock.ts b/src/core/utils/context.mock.ts
index de844f3f0f07d..273d64ec8f822 100644
--- a/src/core/utils/context.mock.ts
+++ b/src/core/utils/context.mock.ts
@@ -21,15 +21,13 @@ import { IContextContainer } from './context';
 
 export type ContextContainerMock = jest.Mocked<IContextContainer<any>>;
 
-const createContextMock = () => {
+const createContextMock = (mockContext = {}) => {
   const contextMock: ContextContainerMock = {
     registerContext: jest.fn(),
-    createHandler: jest.fn((id, handler) => (...args: any[]) =>
-      Promise.resolve(handler({}, ...args))
-    ),
+    createHandler: jest.fn(),
   };
   contextMock.createHandler.mockImplementation((pluginId, handler) => (...args) =>
-    handler({}, ...args)
+    handler(mockContext, ...args)
   );
   return contextMock;
 };
diff --git a/x-pack/legacy/plugins/xpack_main/index.js b/x-pack/legacy/plugins/xpack_main/index.js
index 854fba6624719..4931394038465 100644
--- a/x-pack/legacy/plugins/xpack_main/index.js
+++ b/x-pack/legacy/plugins/xpack_main/index.js
@@ -7,7 +7,7 @@
 import { resolve } from 'path';
 import { mirrorPluginStatus } from '../../server/lib/mirror_plugin_status';
 import { setupXPackMain } from './server/lib/setup_xpack_main';
-import { xpackInfoRoute, settingsRoute } from './server/routes/api/v1';
+import { xpackInfoRoute } from './server/routes/api/v1';
 
 export const xpackMain = (kibana) => {
   return new kibana.Plugin({
@@ -29,7 +29,6 @@ export const xpackMain = (kibana) => {
 
       // register routes
       xpackInfoRoute(server);
-      settingsRoute(server, this.kbnServer);
     },
   });
 };
diff --git a/x-pack/legacy/plugins/xpack_main/server/routes/api/v1/index.js b/x-pack/legacy/plugins/xpack_main/server/routes/api/v1/index.js
index c0e59b4ea4ab2..80baf7bf1a64d 100644
--- a/x-pack/legacy/plugins/xpack_main/server/routes/api/v1/index.js
+++ b/x-pack/legacy/plugins/xpack_main/server/routes/api/v1/index.js
@@ -5,4 +5,3 @@
  */
 
 export { xpackInfoRoute } from './xpack_info';
-export { settingsRoute } from './settings';
diff --git a/x-pack/legacy/plugins/xpack_main/server/routes/api/v1/settings.js b/x-pack/legacy/plugins/xpack_main/server/routes/api/v1/settings.js
deleted file mode 100644
index 34fc4d97c1328..0000000000000
--- a/x-pack/legacy/plugins/xpack_main/server/routes/api/v1/settings.js
+++ /dev/null
@@ -1,68 +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.
- */
-
-import { boomify } from 'boom';
-import { get } from 'lodash';
-import { KIBANA_SETTINGS_TYPE } from '../../../../../../../plugins/monitoring/common/constants';
-
-const getClusterUuid = async (callCluster) => {
-  const { cluster_uuid: uuid } = await callCluster('info', { filterPath: 'cluster_uuid' });
-  return uuid;
-};
-
-export function settingsRoute(server, kbnServer) {
-  server.route({
-    path: '/api/settings',
-    method: 'GET',
-    async handler(req) {
-      const { server } = req;
-      const { callWithRequest } = server.plugins.elasticsearch.getCluster('data');
-      const callCluster = (...args) => callWithRequest(req, ...args); // All queries from HTTP API must use authentication headers from the request
-
-      try {
-        const { usageCollection } = server.newPlatform.setup.plugins;
-        const settingsCollector = usageCollection.getCollectorByType(KIBANA_SETTINGS_TYPE);
-
-        let settings = await settingsCollector.fetch(callCluster);
-        if (!settings) {
-          settings = settingsCollector.getEmailValueStructure(null);
-        }
-        const uuid = await getClusterUuid(callCluster);
-
-        const snapshotRegex = /-snapshot/i;
-        const config = server.config();
-        const status = kbnServer.status.toJSON();
-        const kibana = {
-          uuid: config.get('server.uuid'),
-          name: config.get('server.name'),
-          index: config.get('kibana.index'),
-          host: config.get('server.host'),
-          port: config.get('server.port'),
-          locale: config.get('i18n.locale'),
-          transport_address: `${config.get('server.host')}:${config.get('server.port')}`,
-          version: kbnServer.version.replace(snapshotRegex, ''),
-          snapshot: snapshotRegex.test(kbnServer.version),
-          status: get(status, 'overall.state'),
-        };
-
-        return {
-          cluster_uuid: uuid,
-          settings: {
-            ...settings,
-            kibana,
-          },
-        };
-      } catch (err) {
-        req.log(['error'], err); // FIXME doesn't seem to log anything useful if ES times out
-        if (err.isBoom) {
-          return err;
-        } else {
-          return boomify(err, { statusCode: err.statusCode, message: err.message });
-        }
-      }
-    },
-  });
-}
diff --git a/x-pack/plugins/monitoring/server/index.ts b/x-pack/plugins/monitoring/server/index.ts
index 60f04c535ebf1..de679a2834d7b 100644
--- a/x-pack/plugins/monitoring/server/index.ts
+++ b/x-pack/plugins/monitoring/server/index.ts
@@ -10,6 +10,7 @@ import { Plugin } from './plugin';
 import { configSchema } from './config';
 import { deprecations } from './deprecations';
 
+export { KibanaSettingsCollector } from './kibana_monitoring/collectors';
 export { MonitoringConfig } from './config';
 export const plugin = (initContext: PluginInitializerContext) => new Plugin(initContext);
 export const config: PluginConfigDescriptor<TypeOf<typeof configSchema>> = {
diff --git a/x-pack/plugins/monitoring/server/kibana_monitoring/collectors/get_settings_collector.ts b/x-pack/plugins/monitoring/server/kibana_monitoring/collectors/get_settings_collector.ts
index c66adfcabd671..a3ff4b952ce97 100644
--- a/x-pack/plugins/monitoring/server/kibana_monitoring/collectors/get_settings_collector.ts
+++ b/x-pack/plugins/monitoring/server/kibana_monitoring/collectors/get_settings_collector.ts
@@ -4,6 +4,8 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { Collector } from '../../../../../../src/plugins/usage_collection/server';
+
 import { KIBANA_SETTINGS_TYPE } from '../../../common/constants';
 import { MonitoringConfig } from '../../config';
 
@@ -38,11 +40,19 @@ export async function checkForEmailValue(
   }
 }
 
+interface EmailSettingData {
+  xpack: { default_admin_email: string | null };
+}
+
+export interface KibanaSettingsCollector extends Collector<EmailSettingData | undefined> {
+  getEmailValueStructure(email: string | null): EmailSettingData;
+}
+
 export function getSettingsCollector(usageCollection: any, config: MonitoringConfig) {
   return usageCollection.makeStatsCollector({
     type: KIBANA_SETTINGS_TYPE,
     isReady: () => true,
-    async fetch() {
+    async fetch(this: KibanaSettingsCollector) {
       let kibanaSettingsData;
       const defaultAdminEmail = await checkForEmailValue(config);
 
@@ -64,7 +74,7 @@ export function getSettingsCollector(usageCollection: any, config: MonitoringCon
       // returns undefined if there was no result
       return kibanaSettingsData;
     },
-    getEmailValueStructure(email: string) {
+    getEmailValueStructure(email: string | null) {
       return {
         xpack: {
           default_admin_email: email,
diff --git a/x-pack/plugins/monitoring/server/kibana_monitoring/collectors/index.ts b/x-pack/plugins/monitoring/server/kibana_monitoring/collectors/index.ts
index dcd35b0d323eb..aa4853ab226f4 100644
--- a/x-pack/plugins/monitoring/server/kibana_monitoring/collectors/index.ts
+++ b/x-pack/plugins/monitoring/server/kibana_monitoring/collectors/index.ts
@@ -8,6 +8,8 @@ import { UsageCollectionSetup } from 'src/plugins/usage_collection/server';
 import { getSettingsCollector } from './get_settings_collector';
 import { MonitoringConfig } from '../../config';
 
+export { KibanaSettingsCollector } from './get_settings_collector';
+
 export function registerCollectors(
   usageCollection: UsageCollectionSetup,
   config: MonitoringConfig
diff --git a/x-pack/plugins/xpack_legacy/README.md b/x-pack/plugins/xpack_legacy/README.md
new file mode 100644
index 0000000000000..be43825347959
--- /dev/null
+++ b/x-pack/plugins/xpack_legacy/README.md
@@ -0,0 +1,3 @@
+# Xpack Leagcy
+
+Contains HTTP endpoints and UiSettings that are slated for removal.
diff --git a/x-pack/plugins/xpack_legacy/kibana.json b/x-pack/plugins/xpack_legacy/kibana.json
new file mode 100644
index 0000000000000..fc45b612d72cf
--- /dev/null
+++ b/x-pack/plugins/xpack_legacy/kibana.json
@@ -0,0 +1,10 @@
+{
+  "id": "xpackLegacy",
+  "version": "8.0.0",
+  "kibanaVersion": "kibana",
+  "server": true,
+  "ui": false,
+  "requiredPlugins": [
+    "usageCollection"
+  ]
+}
diff --git a/x-pack/plugins/xpack_legacy/server/index.ts b/x-pack/plugins/xpack_legacy/server/index.ts
new file mode 100644
index 0000000000000..ecdee0692fc9d
--- /dev/null
+++ b/x-pack/plugins/xpack_legacy/server/index.ts
@@ -0,0 +1,11 @@
+/*
+ * 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 { PluginInitializerContext } from '../../../../src/core/server';
+import { XpackLegacyPlugin } from './plugin';
+
+export const plugin = (initializerContext: PluginInitializerContext) =>
+  new XpackLegacyPlugin(initializerContext);
diff --git a/x-pack/plugins/xpack_legacy/server/plugin.ts b/x-pack/plugins/xpack_legacy/server/plugin.ts
new file mode 100644
index 0000000000000..2905f8e4bf3d4
--- /dev/null
+++ b/x-pack/plugins/xpack_legacy/server/plugin.ts
@@ -0,0 +1,48 @@
+/*
+ * 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 { first } from 'rxjs/operators';
+
+import {
+  CoreStart,
+  CoreSetup,
+  Plugin,
+  PluginInitializerContext,
+} from '../../../../src/core/server';
+import { UsageCollectionSetup } from '../../../../src/plugins/usage_collection/server';
+import { registerSettingsRoute } from './routes/settings';
+
+interface SetupPluginDeps {
+  usageCollection: UsageCollectionSetup;
+}
+
+export class XpackLegacyPlugin implements Plugin {
+  constructor(private readonly initContext: PluginInitializerContext) {}
+
+  public async setup(core: CoreSetup, { usageCollection }: SetupPluginDeps) {
+    const router = core.http.createRouter();
+    const globalConfig = await this.initContext.config.legacy.globalConfig$
+      .pipe(first())
+      .toPromise();
+    const serverInfo = core.http.getServerInfo();
+
+    registerSettingsRoute({
+      router,
+      usageCollection,
+      overallStatus$: core.status.overall$,
+      config: {
+        kibanaIndex: globalConfig.kibana.index,
+        kibanaVersion: this.initContext.env.packageInfo.version,
+        uuid: this.initContext.env.instanceUuid,
+        server: serverInfo,
+      },
+    });
+  }
+
+  public start(core: CoreStart) {}
+
+  public stop() {}
+}
diff --git a/x-pack/plugins/xpack_legacy/server/routes/settings.test.ts b/x-pack/plugins/xpack_legacy/server/routes/settings.test.ts
new file mode 100644
index 0000000000000..02fa669cb05e0
--- /dev/null
+++ b/x-pack/plugins/xpack_legacy/server/routes/settings.test.ts
@@ -0,0 +1,105 @@
+/*
+ * 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 { BehaviorSubject } from 'rxjs';
+import { UnwrapPromise } from '@kbn/utility-types';
+import supertest from 'supertest';
+
+import {
+  LegacyAPICaller,
+  ServiceStatus,
+  ServiceStatusLevels,
+} from '../../../../../src/core/server';
+import { contextServiceMock } from '../../../../../src/core/server/mocks';
+import { createHttpServer } from '../../../../../src/core/server/test_utils';
+import { registerSettingsRoute } from './settings';
+
+type HttpService = ReturnType<typeof createHttpServer>;
+type HttpSetup = UnwrapPromise<ReturnType<HttpService['setup']>>;
+
+describe('/api/stats', () => {
+  let server: HttpService;
+  let httpSetup: HttpSetup;
+  let overallStatus$: BehaviorSubject<ServiceStatus>;
+  let mockApiCaller: jest.Mocked<LegacyAPICaller>;
+
+  beforeEach(async () => {
+    mockApiCaller = jest.fn().mockResolvedValue({ cluster_uuid: 'yyy-yyyyy' });
+    server = createHttpServer();
+    httpSetup = await server.setup({
+      context: contextServiceMock.createSetupContract({
+        core: {
+          elasticsearch: {
+            legacy: {
+              client: {
+                callAsCurrentUser: mockApiCaller,
+              },
+            },
+          },
+        },
+      }),
+    });
+
+    overallStatus$ = new BehaviorSubject<ServiceStatus>({
+      level: ServiceStatusLevels.available,
+      summary: 'everything is working',
+    });
+
+    const usageCollection = {
+      getCollectorByType: jest.fn().mockReturnValue({
+        fetch: jest
+          .fn()
+          .mockReturnValue({ xpack: { default_admin_email: 'kibana-machine@elastic.co' } }),
+      }),
+    } as any;
+
+    const router = httpSetup.createRouter('');
+    registerSettingsRoute({
+      router,
+      overallStatus$,
+      usageCollection,
+      config: {
+        kibanaIndex: '.kibana-test',
+        kibanaVersion: '8.8.8-SNAPSHOT',
+        server: {
+          name: 'mykibana',
+          hostname: 'mykibana.com',
+          port: 1234,
+        },
+        uuid: 'xxx-xxxxx',
+      },
+    });
+
+    await server.start();
+  });
+
+  afterEach(async () => {
+    await server.stop();
+  });
+
+  it('successfully returns data', async () => {
+    const response = await supertest(httpSetup.server.listener).get('/api/settings').expect(200);
+    expect(response.body).toMatchObject({
+      cluster_uuid: 'yyy-yyyyy',
+      settings: {
+        xpack: {
+          default_admin_email: 'kibana-machine@elastic.co',
+        },
+        kibana: {
+          uuid: 'xxx-xxxxx',
+          name: 'mykibana',
+          index: '.kibana-test',
+          host: 'mykibana.com',
+          locale: 'en',
+          transport_address: `mykibana.com:1234`,
+          version: '8.8.8',
+          snapshot: true,
+          status: 'green',
+        },
+      },
+    });
+  });
+});
diff --git a/x-pack/plugins/xpack_legacy/server/routes/settings.ts b/x-pack/plugins/xpack_legacy/server/routes/settings.ts
new file mode 100644
index 0000000000000..2a0eb3d11584e
--- /dev/null
+++ b/x-pack/plugins/xpack_legacy/server/routes/settings.ts
@@ -0,0 +1,93 @@
+/*
+ * 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 { i18n } from '@kbn/i18n';
+import { Observable } from 'rxjs';
+import { first } from 'rxjs/operators';
+
+import { IRouter, ServiceStatus, ServiceStatusLevels } from '../../../../../src/core/server';
+import { UsageCollectionSetup } from '../../../../../src/plugins/usage_collection/server';
+import { KIBANA_SETTINGS_TYPE } from '../../../monitoring/common/constants';
+import { KibanaSettingsCollector } from '../../../monitoring/server';
+
+const SNAPSHOT_REGEX = /-snapshot/i;
+
+export function registerSettingsRoute({
+  router,
+  usageCollection,
+  overallStatus$,
+  config,
+}: {
+  router: IRouter;
+  usageCollection: UsageCollectionSetup;
+  overallStatus$: Observable<ServiceStatus>;
+  config: {
+    kibanaIndex: string;
+    kibanaVersion: string;
+    uuid: string;
+    server: {
+      name: string;
+      hostname: string;
+      port: number;
+    };
+  };
+}) {
+  router.get(
+    {
+      path: '/api/settings',
+      validate: false,
+    },
+    async (context, req, res) => {
+      const { callAsCurrentUser } = context.core.elasticsearch.legacy.client;
+
+      const settingsCollector = usageCollection.getCollectorByType(KIBANA_SETTINGS_TYPE) as
+        | KibanaSettingsCollector
+        | undefined;
+      if (!settingsCollector) {
+        return res.internalError();
+      }
+
+      const settings =
+        (await settingsCollector.fetch(callAsCurrentUser)) ??
+        settingsCollector.getEmailValueStructure(null);
+      const { cluster_uuid: uuid } = await callAsCurrentUser('info', {
+        filterPath: 'cluster_uuid',
+      });
+
+      const overallStatus = await overallStatus$.pipe(first()).toPromise();
+
+      const kibana = {
+        uuid: config.uuid,
+        name: config.server.name,
+        index: config.kibanaIndex,
+        host: config.server.hostname,
+        port: config.server.port,
+        locale: i18n.getLocale(),
+        transport_address: `${config.server.hostname}:${config.server.port}`,
+        version: config.kibanaVersion.replace(SNAPSHOT_REGEX, ''),
+        snapshot: SNAPSHOT_REGEX.test(config.kibanaVersion),
+        status: ServiceStatusToLegacyState[overallStatus.level.toString()],
+      };
+
+      return res.ok({
+        body: {
+          cluster_uuid: uuid,
+          settings: {
+            ...settings,
+            kibana,
+          },
+        },
+      });
+    }
+  );
+}
+
+const ServiceStatusToLegacyState: Record<string, string> = {
+  [ServiceStatusLevels.critical.toString()]: 'red',
+  [ServiceStatusLevels.unavailable.toString()]: 'red',
+  [ServiceStatusLevels.degraded.toString()]: 'yellow',
+  [ServiceStatusLevels.available.toString()]: 'green',
+};
diff --git a/x-pack/test/api_integration/apis/index.js b/x-pack/test/api_integration/apis/index.js
index 23532d1311754..a1bcaa13cc52b 100644
--- a/x-pack/test/api_integration/apis/index.js
+++ b/x-pack/test/api_integration/apis/index.js
@@ -12,7 +12,7 @@ export default function ({ loadTestFile }) {
     loadTestFile(require.resolve('./security'));
     loadTestFile(require.resolve('./spaces'));
     loadTestFile(require.resolve('./monitoring'));
-    loadTestFile(require.resolve('./xpack_main'));
+    loadTestFile(require.resolve('./xpack_legacy'));
     loadTestFile(require.resolve('./features'));
     loadTestFile(require.resolve('./telemetry'));
     loadTestFile(require.resolve('./logstash'));
diff --git a/x-pack/test/api_integration/apis/xpack_main/index.js b/x-pack/test/api_integration/apis/xpack_legacy/index.js
similarity index 90%
rename from x-pack/test/api_integration/apis/xpack_main/index.js
rename to x-pack/test/api_integration/apis/xpack_legacy/index.js
index c011ef870df4a..b712d565311bc 100644
--- a/x-pack/test/api_integration/apis/xpack_main/index.js
+++ b/x-pack/test/api_integration/apis/xpack_legacy/index.js
@@ -5,7 +5,7 @@
  */
 
 export default function ({ loadTestFile }) {
-  describe('xpack_main', () => {
+  describe('xpack_legacy', () => {
     loadTestFile(require.resolve('./settings'));
   });
 }
diff --git a/x-pack/test/api_integration/apis/xpack_main/settings/index.js b/x-pack/test/api_integration/apis/xpack_legacy/settings/index.js
similarity index 100%
rename from x-pack/test/api_integration/apis/xpack_main/settings/index.js
rename to x-pack/test/api_integration/apis/xpack_legacy/settings/index.js
diff --git a/x-pack/test/api_integration/apis/xpack_main/settings/settings.js b/x-pack/test/api_integration/apis/xpack_legacy/settings/settings.js
similarity index 100%
rename from x-pack/test/api_integration/apis/xpack_main/settings/settings.js
rename to x-pack/test/api_integration/apis/xpack_legacy/settings/settings.js

From 333b200c9d9b32518c86a7950c58efdb296abc7d Mon Sep 17 00:00:00 2001
From: spalger <spalger@users.noreply.github.com>
Date: Wed, 16 Sep 2020 15:28:28 -0700
Subject: [PATCH 08/19] update invalid snapshot

---
 .../view/__snapshots__/trusted_apps_page.test.tsx.snap        | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_apps_page.test.tsx.snap b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_apps_page.test.tsx.snap
index 5cb788d96f3e7..642e86059ed6e 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_apps_page.test.tsx.snap
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/__snapshots__/trusted_apps_page.test.tsx.snap
@@ -660,10 +660,8 @@ exports[`TrustedAppsPage when the Add Trusted App button is clicked should displ
               <button
                 aria-haspopup="true"
                 aria-labelledby="mockId mockId"
-                aria-selected="true"
                 class="euiSuperSelectControl euiSuperSelectControl--fullWidth"
                 data-test-subj="addTrustedAppFlyout-createForm-osSelectField"
-                role="option"
                 type="button"
               >
                 Windows
@@ -756,10 +754,8 @@ exports[`TrustedAppsPage when the Add Trusted App button is clicked should displ
                               <button
                                 aria-haspopup="true"
                                 aria-labelledby="mockId mockId"
-                                aria-selected="true"
                                 class="euiSuperSelectControl"
                                 data-test-subj="addTrustedAppFlyout-createForm-conditionsBuilder-group1-entry0-field"
-                                role="option"
                                 type="button"
                               >
                                 Hash

From 66830263a9bae700b2512fd6775fcfafbbac0afe Mon Sep 17 00:00:00 2001
From: Josh Dover <me@joshdover.com>
Date: Wed, 16 Sep 2020 16:55:35 -0600
Subject: [PATCH 09/19] Make sure getOpsMetrics$ only replays lastest value
 (#77673)

---
 .../server/metrics/metrics_service.test.ts    | 19 +++++++++++++++++++
 src/core/server/metrics/metrics_service.ts    |  2 +-
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/src/core/server/metrics/metrics_service.test.ts b/src/core/server/metrics/metrics_service.test.ts
index 269931d0e33ad..384a56c8dba94 100644
--- a/src/core/server/metrics/metrics_service.test.ts
+++ b/src/core/server/metrics/metrics_service.test.ts
@@ -106,6 +106,25 @@ describe('MetricsService', () => {
         `"#setup() needs to be run first"`
       );
     });
+
+    it('emits the last value on each getOpsMetrics$ call', async () => {
+      const firstMetrics = { metric: 'first' };
+      const secondMetrics = { metric: 'second' };
+      mockOpsCollector.collect
+        .mockResolvedValueOnce(firstMetrics)
+        .mockResolvedValueOnce(secondMetrics);
+
+      await metricsService.setup({ http: httpMock });
+      const { getOpsMetrics$ } = await metricsService.start();
+
+      const firstEmission = getOpsMetrics$().pipe(take(1)).toPromise();
+      jest.advanceTimersByTime(testInterval);
+      expect(await firstEmission).toEqual({ metric: 'first' });
+
+      const secondEmission = getOpsMetrics$().pipe(take(1)).toPromise();
+      jest.advanceTimersByTime(testInterval);
+      expect(await secondEmission).toEqual({ metric: 'second' });
+    });
   });
 
   describe('#stop', () => {
diff --git a/src/core/server/metrics/metrics_service.ts b/src/core/server/metrics/metrics_service.ts
index d4696b3aa9aaf..ab58a75d49a98 100644
--- a/src/core/server/metrics/metrics_service.ts
+++ b/src/core/server/metrics/metrics_service.ts
@@ -37,7 +37,7 @@ export class MetricsService
   private readonly logger: Logger;
   private metricsCollector?: OpsMetricsCollector;
   private collectInterval?: NodeJS.Timeout;
-  private metrics$ = new ReplaySubject<OpsMetrics>();
+  private metrics$ = new ReplaySubject<OpsMetrics>(1);
   private service?: InternalMetricsServiceSetup;
 
   constructor(private readonly coreContext: CoreContext) {

From bd6b38915bd7d97738febf2b84b60e854a5e6431 Mon Sep 17 00:00:00 2001
From: Scotty Bollinger <scotty.bollinger@elastic.co>
Date: Wed, 16 Sep 2020 18:06:34 -0500
Subject: [PATCH 10/19] [Enterprise Search] Add helpers for flash messages
 (#77677)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* [Enterprise Search] Add a helper for success messages

* Move method to separate file

* Update test names

* D R Y

* I really need to slow down  🤦🏼‍♂️

* PR feedback

* Typo
---
 .../shared/flash_messages/index.ts            |  1 +
 .../set_message_helpers.test.ts               | 53 +++++++++++++++++++
 .../flash_messages/set_message_helpers.ts     | 28 ++++++++++
 3 files changed, 82 insertions(+)
 create mode 100644 x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/set_message_helpers.test.ts
 create mode 100644 x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/set_message_helpers.ts

diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/index.ts b/x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/index.ts
index c03954179184e..c4daeb44420c8 100644
--- a/x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/index.ts
+++ b/x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/index.ts
@@ -13,3 +13,4 @@ export {
 } from './flash_messages_logic';
 export { FlashMessagesProvider } from './flash_messages_provider';
 export { flashAPIErrors } from './handle_api_errors';
+export { setSuccessMessage, setErrorMessage, setQueuedSuccessMessage } from './set_message_helpers';
diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/set_message_helpers.test.ts b/x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/set_message_helpers.test.ts
new file mode 100644
index 0000000000000..c3c60d77f4577
--- /dev/null
+++ b/x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/set_message_helpers.test.ts
@@ -0,0 +1,53 @@
+/*
+ * 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 {
+  FlashMessagesLogic,
+  setSuccessMessage,
+  setErrorMessage,
+  setQueuedSuccessMessage,
+} from './';
+
+describe('Flash Message Helpers', () => {
+  const message = 'I am a message';
+
+  beforeEach(() => {
+    FlashMessagesLogic.mount();
+  });
+
+  it('setSuccessMessage()', () => {
+    setSuccessMessage(message);
+
+    expect(FlashMessagesLogic.values.messages).toEqual([
+      {
+        message,
+        type: 'success',
+      },
+    ]);
+  });
+
+  it('setErrorMessage()', () => {
+    setErrorMessage(message);
+
+    expect(FlashMessagesLogic.values.messages).toEqual([
+      {
+        message,
+        type: 'error',
+      },
+    ]);
+  });
+
+  it('setQueuedSuccessMessage()', () => {
+    setQueuedSuccessMessage(message);
+
+    expect(FlashMessagesLogic.values.queuedMessages).toEqual([
+      {
+        message,
+        type: 'success',
+      },
+    ]);
+  });
+});
diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/set_message_helpers.ts b/x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/set_message_helpers.ts
new file mode 100644
index 0000000000000..6abb540b7c14b
--- /dev/null
+++ b/x-pack/plugins/enterprise_search/public/applications/shared/flash_messages/set_message_helpers.ts
@@ -0,0 +1,28 @@
+/*
+ * 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 { FlashMessagesLogic } from './';
+
+export const setSuccessMessage = (message: string) => {
+  FlashMessagesLogic.actions.setFlashMessages({
+    type: 'success',
+    message,
+  });
+};
+
+export const setErrorMessage = (message: string) => {
+  FlashMessagesLogic.actions.setFlashMessages({
+    type: 'error',
+    message,
+  });
+};
+
+export const setQueuedSuccessMessage = (message: string) => {
+  FlashMessagesLogic.actions.setQueuedMessages({
+    type: 'success',
+    message,
+  });
+};

From 9d1ba4d7111e6bd0b2d99b5461a93994cb9e9c71 Mon Sep 17 00:00:00 2001
From: Constance <constancecchen@users.noreply.github.com>
Date: Wed, 16 Sep 2020 17:50:28 -0700
Subject: [PATCH 11/19] [Enterprise Search] Add nested sub navigation to
 SideNavLinks (#77685)

* Add subNav prop to SideNavLinks

- for nested navigation

* [Probably extra] Tweak CSS to allow for recursive subnesting

- while attempting to expand the hitbox area of nested links as much as possible

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
---
 .../applications/shared/layout/side_nav.scss     | 11 +++++++++++
 .../applications/shared/layout/side_nav.test.tsx | 16 ++++++++++++++++
 .../applications/shared/layout/side_nav.tsx      |  3 +++
 3 files changed, 30 insertions(+)

diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.scss b/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.scss
index d673542ba1983..79cd7634cfaa0 100644
--- a/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.scss
+++ b/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.scss
@@ -72,4 +72,15 @@ $euiSizeML: $euiSize * 1.25; // 20px - between medium and large ¯\_(ツ)_/¯
       }
     }
   }
+
+  &__subNav {
+    padding-left: $euiSizeML;
+
+    // Extends the click area of links more to the left, so that second tiers
+    // of subnavigation links still have the same hitbox as first tier links
+    .enterpriseSearchNavLinks__item {
+      margin-left: -$euiSizeML;
+      padding-left: $euiSizeXXL;
+    }
+  }
 }
diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.test.tsx b/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.test.tsx
index c117fa404a16b..b006068ac0d9e 100644
--- a/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.test.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.test.tsx
@@ -89,4 +89,20 @@ describe('SideNavLink', () => {
     expect(wrapper.find('.testing')).toHaveLength(1);
     expect(wrapper.find('[data-test-subj="testing"]')).toHaveLength(1);
   });
+
+  it('renders nested subnavigation', () => {
+    const subNav = (
+      <SideNavLink to="/elsewhere" data-test-subj="subNav">
+        Another link!
+      </SideNavLink>
+    );
+    const wrapper = shallow(
+      <SideNavLink to="/" subNav={subNav}>
+        Link
+      </SideNavLink>
+    );
+
+    expect(wrapper.find('.enterpriseSearchNavLinks__subNav')).toHaveLength(1);
+    expect(wrapper.find('[data-test-subj="subNav"]')).toHaveLength(1);
+  });
 });
diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.tsx b/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.tsx
index 72e4f2f091496..edcfc2c84e3ad 100644
--- a/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/shared/layout/side_nav.tsx
@@ -66,6 +66,7 @@ interface ISideNavLinkProps {
   isExternal?: boolean;
   className?: string;
   isRoot?: boolean;
+  subNav?: React.ReactNode;
 }
 
 export const SideNavLink: React.FC<ISideNavLinkProps> = ({
@@ -74,6 +75,7 @@ export const SideNavLink: React.FC<ISideNavLinkProps> = ({
   children,
   className,
   isRoot,
+  subNav,
   ...rest
 }) => {
   const { closeNavigation } = useContext(NavContext) as INavContext;
@@ -103,6 +105,7 @@ export const SideNavLink: React.FC<ISideNavLinkProps> = ({
           {children}
         </EuiLink>
       )}
+      {subNav && <ul className="enterpriseSearchNavLinks__subNav">{subNav}</ul>}
     </li>
   );
 };

From 3e3f9c7ee977f3d7deb4aba80b3976e52ef53d1d Mon Sep 17 00:00:00 2001
From: nnamdifrankie <56440728+nnamdifrankie@users.noreply.github.com>
Date: Wed, 16 Sep 2020 21:25:38 -0400
Subject: [PATCH 12/19] [Ingest] fix transform path to work with external
 ES/cloud (#77640)

[Ingest] fix transform path to work with external ES/cloud
---
 .../epm/elasticsearch/transform/install.ts    | 198 ++++++++++--------
 .../epm/elasticsearch/transform/remove.ts     |   4 +-
 .../elasticsearch/transform/transform.test.ts |  46 ++--
 .../server/services/epm/packages/install.ts   |   4 +-
 4 files changed, 142 insertions(+), 110 deletions(-)

diff --git a/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/install.ts b/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/install.ts
index 1e58319183c7d..83ad08d09de76 100644
--- a/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/install.ts
+++ b/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/install.ts
@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { SavedObjectsClientContract } from 'kibana/server';
+import { Logger, SavedObjectsClientContract } from 'kibana/server';
 
 import { saveInstalledEsRefs } from '../../packages/install';
 import * as Registry from '../../registry';
@@ -33,89 +33,100 @@ export const installTransformForDataset = async (
   registryPackage: RegistryPackage,
   paths: string[],
   callCluster: CallESAsCurrentUser,
-  savedObjectsClient: SavedObjectsClientContract
+  savedObjectsClient: SavedObjectsClientContract,
+  logger: Logger
 ) => {
-  const installation = await getInstallation({ savedObjectsClient, pkgName: registryPackage.name });
-  let previousInstalledTransformEsAssets: EsAssetReference[] = [];
-  if (installation) {
-    previousInstalledTransformEsAssets = installation.installed_es.filter(
-      ({ type, id }) => type === ElasticsearchAssetType.transform
+  try {
+    const installation = await getInstallation({
+      savedObjectsClient,
+      pkgName: registryPackage.name,
+    });
+    let previousInstalledTransformEsAssets: EsAssetReference[] = [];
+    if (installation) {
+      previousInstalledTransformEsAssets = installation.installed_es.filter(
+        ({ type, id }) => type === ElasticsearchAssetType.transform
+      );
+    }
+
+    // delete all previous transform
+    await deleteTransforms(
+      callCluster,
+      previousInstalledTransformEsAssets.map((asset) => asset.id)
     );
-  }
-
-  // delete all previous transform
-  await deleteTransforms(
-    callCluster,
-    previousInstalledTransformEsAssets.map((asset) => asset.id)
-  );
-  // install the latest dataset
-  const datasets = registryPackage.datasets;
-  if (!datasets?.length) return [];
-  const installNameSuffix = `${registryPackage.version}`;
-
-  const transformPaths = paths.filter((path) => isTransform(path));
-  let installedTransforms: EsAssetReference[] = [];
-  if (transformPaths.length > 0) {
-    const transformPathDatasets = datasets.reduce<TransformPathDataset[]>((acc, dataset) => {
-      transformPaths.forEach((path) => {
-        if (isDatasetTransform(path, dataset.path)) {
-          acc.push({ path, dataset });
-        }
-      });
-      return acc;
-    }, []);
-
-    const transformRefs = transformPathDatasets.reduce<EsAssetReference[]>(
-      (acc, transformPathDataset) => {
-        if (transformPathDataset) {
-          acc.push({
-            id: getTransformNameForInstallation(transformPathDataset, installNameSuffix),
-            type: ElasticsearchAssetType.transform,
-          });
-        }
+    // install the latest dataset
+    const datasets = registryPackage.datasets;
+    if (!datasets?.length) return [];
+    const installNameSuffix = `${registryPackage.version}`;
+
+    const transformPaths = paths.filter((path) => isTransform(path));
+    let installedTransforms: EsAssetReference[] = [];
+    if (transformPaths.length > 0) {
+      const transformPathDatasets = datasets.reduce<TransformPathDataset[]>((acc, dataset) => {
+        transformPaths.forEach((path) => {
+          if (isDatasetTransform(path, dataset.path)) {
+            acc.push({ path, dataset });
+          }
+        });
         return acc;
-      },
-      []
-    );
-
-    // get and save transform refs before installing transforms
-    await saveInstalledEsRefs(savedObjectsClient, registryPackage.name, transformRefs);
-
-    const transforms: TransformInstallation[] = transformPathDatasets.map(
-      (transformPathDataset: TransformPathDataset) => {
-        return {
-          installationName: getTransformNameForInstallation(
-            transformPathDataset,
-            installNameSuffix
-          ),
-          content: getAsset(transformPathDataset.path).toString('utf-8'),
-        };
-      }
-    );
+      }, []);
+
+      const transformRefs = transformPathDatasets.reduce<EsAssetReference[]>(
+        (acc, transformPathDataset) => {
+          if (transformPathDataset) {
+            acc.push({
+              id: getTransformNameForInstallation(transformPathDataset, installNameSuffix),
+              type: ElasticsearchAssetType.transform,
+            });
+          }
+          return acc;
+        },
+        []
+      );
+
+      // get and save transform refs before installing transforms
+      await saveInstalledEsRefs(savedObjectsClient, registryPackage.name, transformRefs);
+
+      const transforms: TransformInstallation[] = transformPathDatasets.map(
+        (transformPathDataset: TransformPathDataset) => {
+          return {
+            installationName: getTransformNameForInstallation(
+              transformPathDataset,
+              installNameSuffix
+            ),
+            content: getAsset(transformPathDataset.path).toString('utf-8'),
+          };
+        }
+      );
 
-    const installationPromises = transforms.map(async (transform) => {
-      return installTransform({ callCluster, transform });
-    });
+      const installationPromises = transforms.map(async (transform) => {
+        return installTransform({ callCluster, transform, logger });
+      });
 
-    installedTransforms = await Promise.all(installationPromises).then((results) => results.flat());
-  }
+      installedTransforms = await Promise.all(installationPromises).then((results) =>
+        results.flat()
+      );
+    }
 
-  if (previousInstalledTransformEsAssets.length > 0) {
-    const currentInstallation = await getInstallation({
-      savedObjectsClient,
-      pkgName: registryPackage.name,
-    });
+    if (previousInstalledTransformEsAssets.length > 0) {
+      const currentInstallation = await getInstallation({
+        savedObjectsClient,
+        pkgName: registryPackage.name,
+      });
 
-    // remove the saved object reference
-    await deleteTransformRefs(
-      savedObjectsClient,
-      currentInstallation?.installed_es || [],
-      registryPackage.name,
-      previousInstalledTransformEsAssets.map((asset) => asset.id),
-      installedTransforms.map((installed) => installed.id)
-    );
+      // remove the saved object reference
+      await deleteTransformRefs(
+        savedObjectsClient,
+        currentInstallation?.installed_es || [],
+        registryPackage.name,
+        previousInstalledTransformEsAssets.map((asset) => asset.id),
+        installedTransforms.map((installed) => installed.id)
+      );
+    }
+    return installedTransforms;
+  } catch (err) {
+    logger.error(err);
+    throw err;
   }
-  return installedTransforms;
 };
 
 const isTransform = (path: string) => {
@@ -136,24 +147,31 @@ const isDatasetTransform = (path: string, datasetName: string) => {
 async function installTransform({
   callCluster,
   transform,
+  logger,
 }: {
   callCluster: CallESAsCurrentUser;
   transform: TransformInstallation;
+  logger: Logger;
 }): Promise<EsAssetReference> {
-  // defer validation on put if the source index is not available
-  await callCluster('transport.request', {
-    method: 'PUT',
-    path: `_transform/${transform.installationName}`,
-    query: 'defer_validation=true',
-    body: transform.content,
-  });
-
-  await callCluster('transport.request', {
-    method: 'POST',
-    path: `_transform/${transform.installationName}/_start`,
-  });
-
-  return { id: transform.installationName, type: ElasticsearchAssetType.transform };
+  try {
+    // defer validation on put if the source index is not available
+    await callCluster('transport.request', {
+      method: 'PUT',
+      path: `/_transform/${transform.installationName}`,
+      query: 'defer_validation=true',
+      body: transform.content,
+    });
+
+    await callCluster('transport.request', {
+      method: 'POST',
+      path: `/_transform/${transform.installationName}/_start`,
+    });
+
+    return { id: transform.installationName, type: ElasticsearchAssetType.transform };
+  } catch (err) {
+    logger.error(err);
+    throw err;
+  }
 }
 
 const getTransformNameForInstallation = (
diff --git a/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/remove.ts b/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/remove.ts
index 5c9d3e2846200..a527d05f1c49b 100644
--- a/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/remove.ts
+++ b/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/remove.ts
@@ -12,7 +12,7 @@ export const stopTransforms = async (transformIds: string[], callCluster: CallES
   for (const transformId of transformIds) {
     await callCluster('transport.request', {
       method: 'POST',
-      path: `_transform/${transformId}/_stop`,
+      path: `/_transform/${transformId}/_stop`,
       query: 'force=true',
       ignore: [404],
     });
@@ -29,7 +29,7 @@ export const deleteTransforms = async (
       await callCluster('transport.request', {
         method: 'DELETE',
         query: 'force=true',
-        path: `_transform/${transformId}`,
+        path: `/_transform/${transformId}`,
         ignore: [404],
       });
     })
diff --git a/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/transform.test.ts b/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/transform.test.ts
index 0b66077b8699a..bb506ecad0ade 100644
--- a/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/transform.test.ts
+++ b/x-pack/plugins/ingest_manager/server/services/epm/elasticsearch/transform/transform.test.ts
@@ -4,6 +4,9 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+// eslint-disable-next-line @kbn/eslint/no-restricted-paths
+import { loggingSystemMock } from '../../../../../../../../src/core/server/logging/logging_system.mock';
+
 jest.mock('../../packages/get', () => {
   return { getInstallation: jest.fn(), getInstallationObject: jest.fn() };
 });
@@ -15,7 +18,12 @@ jest.mock('./common', () => {
 });
 
 import { installTransformForDataset } from './install';
-import { ILegacyScopedClusterClient, SavedObject, SavedObjectsClientContract } from 'kibana/server';
+import {
+  ILegacyScopedClusterClient,
+  LoggerFactory,
+  SavedObject,
+  SavedObjectsClientContract,
+} from 'kibana/server';
 import { ElasticsearchAssetType, Installation, RegistryPackage } from '../../../../types';
 import { getInstallation, getInstallationObject } from '../../packages';
 import { getAsset } from './common';
@@ -25,6 +33,7 @@ import { savedObjectsClientMock } from '../../../../../../../../src/core/server/
 describe('test transform install', () => {
   let legacyScopedClusterClient: jest.Mocked<ILegacyScopedClusterClient>;
   let savedObjectsClient: jest.Mocked<SavedObjectsClientContract>;
+  let logger: jest.Mocked<LoggerFactory>;
   beforeEach(() => {
     legacyScopedClusterClient = {
       callAsInternalUser: jest.fn(),
@@ -33,6 +42,7 @@ describe('test transform install', () => {
     (getInstallation as jest.MockedFunction<typeof getInstallation>).mockReset();
     (getInstallationObject as jest.MockedFunction<typeof getInstallationObject>).mockReset();
     savedObjectsClient = savedObjectsClientMock.create();
+    logger = loggingSystemMock.create();
   });
 
   afterEach(() => {
@@ -132,15 +142,15 @@ describe('test transform install', () => {
         'endpoint-0.16.0-dev.0/dataset/metadata_current/elasticsearch/transform/default.json',
       ],
       legacyScopedClusterClient.callAsCurrentUser,
-      savedObjectsClient
+      savedObjectsClient,
+      logger.get('ingest')
     );
-
     expect(legacyScopedClusterClient.callAsCurrentUser.mock.calls).toEqual([
       [
         'transport.request',
         {
           method: 'POST',
-          path: '_transform/metrics-endpoint.metadata_current-default-0.15.0-dev.0/_stop',
+          path: '/_transform/metrics-endpoint.metadata_current-default-0.15.0-dev.0/_stop',
           query: 'force=true',
           ignore: [404],
         },
@@ -150,7 +160,7 @@ describe('test transform install', () => {
         {
           method: 'DELETE',
           query: 'force=true',
-          path: '_transform/metrics-endpoint.metadata_current-default-0.15.0-dev.0',
+          path: '/_transform/metrics-endpoint.metadata_current-default-0.15.0-dev.0',
           ignore: [404],
         },
       ],
@@ -158,7 +168,7 @@ describe('test transform install', () => {
         'transport.request',
         {
           method: 'PUT',
-          path: '_transform/metrics-endpoint.metadata-default-0.16.0-dev.0',
+          path: '/_transform/metrics-endpoint.metadata-default-0.16.0-dev.0',
           query: 'defer_validation=true',
           body: '{"content": "data"}',
         },
@@ -167,7 +177,7 @@ describe('test transform install', () => {
         'transport.request',
         {
           method: 'PUT',
-          path: '_transform/metrics-endpoint.metadata_current-default-0.16.0-dev.0',
+          path: '/_transform/metrics-endpoint.metadata_current-default-0.16.0-dev.0',
           query: 'defer_validation=true',
           body: '{"content": "data"}',
         },
@@ -176,14 +186,14 @@ describe('test transform install', () => {
         'transport.request',
         {
           method: 'POST',
-          path: '_transform/metrics-endpoint.metadata-default-0.16.0-dev.0/_start',
+          path: '/_transform/metrics-endpoint.metadata-default-0.16.0-dev.0/_start',
         },
       ],
       [
         'transport.request',
         {
           method: 'POST',
-          path: '_transform/metrics-endpoint.metadata_current-default-0.16.0-dev.0/_start',
+          path: '/_transform/metrics-endpoint.metadata_current-default-0.16.0-dev.0/_start',
         },
       ],
     ]);
@@ -287,7 +297,8 @@ describe('test transform install', () => {
       } as unknown) as RegistryPackage,
       ['endpoint-0.16.0-dev.0/dataset/metadata_current/elasticsearch/transform/default.json'],
       legacyScopedClusterClient.callAsCurrentUser,
-      savedObjectsClient
+      savedObjectsClient,
+      logger.get('ingest')
     );
 
     expect(legacyScopedClusterClient.callAsCurrentUser.mock.calls).toEqual([
@@ -295,7 +306,7 @@ describe('test transform install', () => {
         'transport.request',
         {
           method: 'PUT',
-          path: '_transform/metrics-endpoint.metadata_current-default-0.16.0-dev.0',
+          path: '/_transform/metrics-endpoint.metadata_current-default-0.16.0-dev.0',
           query: 'defer_validation=true',
           body: '{"content": "data"}',
         },
@@ -304,7 +315,7 @@ describe('test transform install', () => {
         'transport.request',
         {
           method: 'POST',
-          path: '_transform/metrics-endpoint.metadata_current-default-0.16.0-dev.0/_start',
+          path: '/_transform/metrics-endpoint.metadata_current-default-0.16.0-dev.0/_start',
         },
       ],
     ]);
@@ -384,26 +395,27 @@ describe('test transform install', () => {
       } as unknown) as RegistryPackage,
       [],
       legacyScopedClusterClient.callAsCurrentUser,
-      savedObjectsClient
+      savedObjectsClient,
+      logger.get('ingest')
     );
 
     expect(legacyScopedClusterClient.callAsCurrentUser.mock.calls).toEqual([
       [
         'transport.request',
         {
-          ignore: [404],
           method: 'POST',
-          path: '_transform/metrics-endpoint.metadata-current-default-0.15.0-dev.0/_stop',
+          path: '/_transform/metrics-endpoint.metadata-current-default-0.15.0-dev.0/_stop',
           query: 'force=true',
+          ignore: [404],
         },
       ],
       [
         'transport.request',
         {
-          ignore: [404],
           method: 'DELETE',
-          path: '_transform/metrics-endpoint.metadata-current-default-0.15.0-dev.0',
           query: 'force=true',
+          path: '/_transform/metrics-endpoint.metadata-current-default-0.15.0-dev.0',
+          ignore: [404],
         },
       ],
     ]);
diff --git a/x-pack/plugins/ingest_manager/server/services/epm/packages/install.ts b/x-pack/plugins/ingest_manager/server/services/epm/packages/install.ts
index 54b9c4d3fbb17..4179e82d6ad1d 100644
--- a/x-pack/plugins/ingest_manager/server/services/epm/packages/install.ts
+++ b/x-pack/plugins/ingest_manager/server/services/epm/packages/install.ts
@@ -36,6 +36,7 @@ import { deleteKibanaSavedObjectsAssets } from './remove';
 import { PackageOutdatedError } from '../../../errors';
 import { getPackageSavedObjects } from './get';
 import { installTransformForDataset } from '../elasticsearch/transform/install';
+import { appContextService } from '../../app_context';
 
 export async function installLatestPackage(options: {
   savedObjectsClient: SavedObjectsClientContract;
@@ -196,7 +197,8 @@ export async function installPackage({
     registryPackageInfo,
     paths,
     callCluster,
-    savedObjectsClient
+    savedObjectsClient,
+    appContextService.getLogger()
   );
 
   // if this is an update or retrying an update, delete the previous version's pipelines

From 8bfdefe4e0dcb11a7c055557f5efd859482d1e7e Mon Sep 17 00:00:00 2001
From: nnamdifrankie <56440728+nnamdifrankie@users.noreply.github.com>
Date: Wed, 16 Sep 2020 21:27:06 -0400
Subject: [PATCH 13/19] EMT-179: implement metadata query versioning based on
 ingest manager installed ES assets (#77252)

* EMT-179: initial refactor for versioning

* EMT-179: move things before pulling from master

* EMT-179: fix build

* EMT-179: clean up

* EMT-179: add ingest hook, and improve all tests

* EMT-179: fix build

* EMT-179: clean up

* EMT-179: fix build

* EMT-179: fix build

* EMT-179: clean up

* EMT-179: more clean up

* EMT-179: clean up

* EMT-179: fix build

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
---
 x-pack/plugins/ingest_manager/server/index.ts |   2 +-
 .../plugins/ingest_manager/server/plugin.ts   |  15 +-
 .../ingest_manager/server/services/index.ts   |  13 +-
 .../common/endpoint/constants.ts              |   1 +
 .../common/endpoint/types/index.ts            |   9 +
 .../store/mock_endpoint_result_list.ts        |   5 +
 .../pages/endpoint_hosts/view/index.test.tsx  |   6 +
 .../endpoint/endpoint_app_context_services.ts |  62 +-
 .../server/endpoint/mocks.ts                  |  13 +
 .../endpoint/routes/metadata/handlers.ts      | 290 ++++++++
 .../server/endpoint/routes/metadata/index.ts  | 325 ++-------
 .../endpoint/routes/metadata/metadata.test.ts | 660 ++++++++++--------
 .../routes/metadata/metadata_v1.test.ts       | 412 +++++++++++
 .../routes/metadata/query_builders.test.ts    |  11 +-
 .../routes/metadata/query_builders.ts         |  39 +-
 .../routes/metadata/query_builders_v1.test.ts | 300 ++++++++
 .../routes/metadata/route_schema_test.ts      |  53 ++
 .../metadata/support/query_strategies.ts      | 115 +++
 .../routes/metadata/support/test_support.ts   | 103 +++
 .../server/endpoint/types.ts                  |  33 +
 .../lib/hosts/elasticsearch_adapter.test.ts   |  21 +-
 .../server/lib/hosts/elasticsearch_adapter.ts |  10 +-
 .../security_solution/server/plugin.ts        |   1 +
 .../apis/index.ts                             |   1 +
 .../apis/metadata.ts                          |  38 +-
 .../apis/metadata_v1.ts                       | 284 ++++++++
 26 files changed, 2196 insertions(+), 626 deletions(-)
 create mode 100644 x-pack/plugins/security_solution/server/endpoint/routes/metadata/handlers.ts
 create mode 100644 x-pack/plugins/security_solution/server/endpoint/routes/metadata/metadata_v1.test.ts
 create mode 100644 x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders_v1.test.ts
 create mode 100644 x-pack/plugins/security_solution/server/endpoint/routes/metadata/route_schema_test.ts
 create mode 100644 x-pack/plugins/security_solution/server/endpoint/routes/metadata/support/query_strategies.ts
 create mode 100644 x-pack/plugins/security_solution/server/endpoint/routes/metadata/support/test_support.ts
 create mode 100644 x-pack/test/security_solution_endpoint_api_int/apis/metadata_v1.ts

diff --git a/x-pack/plugins/ingest_manager/server/index.ts b/x-pack/plugins/ingest_manager/server/index.ts
index e8ea886cbf9f5..f87ebb3d2c404 100644
--- a/x-pack/plugins/ingest_manager/server/index.ts
+++ b/x-pack/plugins/ingest_manager/server/index.ts
@@ -11,7 +11,7 @@ import {
   AGENT_POLICY_ROLLOUT_RATE_LIMIT_REQUEST_PER_INTERVAL,
   AGENT_POLLING_REQUEST_TIMEOUT_MS,
 } from '../common';
-export { AgentService, ESIndexPatternService, getRegistryUrl } from './services';
+export { AgentService, ESIndexPatternService, getRegistryUrl, PackageService } from './services';
 export {
   IngestManagerSetupContract,
   IngestManagerSetupDeps,
diff --git a/x-pack/plugins/ingest_manager/server/plugin.ts b/x-pack/plugins/ingest_manager/server/plugin.ts
index b10f3527a0459..47900415466b9 100644
--- a/x-pack/plugins/ingest_manager/server/plugin.ts
+++ b/x-pack/plugins/ingest_manager/server/plugin.ts
@@ -13,6 +13,7 @@ import {
   PluginInitializerContext,
   SavedObjectsServiceStart,
   HttpServiceSetup,
+  SavedObjectsClientContract,
 } from 'kibana/server';
 import { UsageCollectionSetup } from 'src/plugins/usage_collection/server';
 import { LicensingPluginSetup, ILicense } from '../../licensing/server';
@@ -47,7 +48,7 @@ import {
   registerSettingsRoutes,
   registerAppRoutes,
 } from './routes';
-import { IngestManagerConfigType, NewPackagePolicy } from '../common';
+import { EsAssetReference, IngestManagerConfigType, NewPackagePolicy } from '../common';
 import {
   appContextService,
   licenseService,
@@ -55,6 +56,7 @@ import {
   ESIndexPatternService,
   AgentService,
   packagePolicyService,
+  PackageService,
 } from './services';
 import {
   getAgentStatusById,
@@ -65,6 +67,7 @@ import {
 import { CloudSetup } from '../../cloud/server';
 import { agentCheckinState } from './services/agents/checkin/state';
 import { registerIngestManagerUsageCollector } from './collectors/register';
+import { getInstallation } from './services/epm/packages';
 
 export interface IngestManagerSetupDeps {
   licensing: LicensingPluginSetup;
@@ -118,6 +121,7 @@ export type ExternalCallbacksStorage = Map<ExternalCallback[0], Set<ExternalCall
  */
 export interface IngestManagerStartContract {
   esIndexPatternService: ESIndexPatternService;
+  packageService: PackageService;
   agentService: AgentService;
   /**
    * Services for Ingest's package policies
@@ -273,6 +277,15 @@ export class IngestManagerPlugin
 
     return {
       esIndexPatternService: new ESIndexPatternSavedObjectService(),
+      packageService: {
+        getInstalledEsAssetReferences: async (
+          savedObjectsClient: SavedObjectsClientContract,
+          pkgName: string
+        ): Promise<EsAssetReference[]> => {
+          const installation = await getInstallation({ savedObjectsClient, pkgName });
+          return installation?.installed_es || [];
+        },
+      },
       agentService: {
         getAgent,
         listAgents,
diff --git a/x-pack/plugins/ingest_manager/server/services/index.ts b/x-pack/plugins/ingest_manager/server/services/index.ts
index e768862d2dee1..5942277e90824 100644
--- a/x-pack/plugins/ingest_manager/server/services/index.ts
+++ b/x-pack/plugins/ingest_manager/server/services/index.ts
@@ -5,7 +5,7 @@
  */
 
 import { SavedObjectsClientContract, KibanaRequest } from 'kibana/server';
-import { AgentStatus, Agent } from '../types';
+import { AgentStatus, Agent, EsAssetReference } from '../types';
 import * as settingsService from './settings';
 export { ESIndexPatternSavedObjectService } from './es_index_pattern';
 
@@ -22,6 +22,17 @@ export interface ESIndexPatternService {
   ): Promise<string | undefined>;
 }
 
+/**
+ * Service that provides exported function that return information about EPM packages
+ */
+
+export interface PackageService {
+  getInstalledEsAssetReferences(
+    savedObjectsClient: SavedObjectsClientContract,
+    pkgName: string
+  ): Promise<EsAssetReference[]>;
+}
+
 /**
  * A service that provides exported functions that return information about an Agent
  */
diff --git a/x-pack/plugins/security_solution/common/endpoint/constants.ts b/x-pack/plugins/security_solution/common/endpoint/constants.ts
index cd59c2518794c..74ccf9105ba6b 100644
--- a/x-pack/plugins/security_solution/common/endpoint/constants.ts
+++ b/x-pack/plugins/security_solution/common/endpoint/constants.ts
@@ -8,6 +8,7 @@ export const eventsIndexPattern = 'logs-endpoint.events.*';
 export const alertsIndexPattern = 'logs-endpoint.alerts-*';
 export const metadataIndexPattern = 'metrics-endpoint.metadata-*';
 export const metadataCurrentIndexPattern = 'metrics-endpoint.metadata_current-*';
+export const metadataTransformPrefix = 'metrics-endpoint.metadata-current-default';
 export const policyIndexPattern = 'metrics-endpoint.policy-*';
 export const telemetryIndexPattern = 'metrics-endpoint.telemetry-*';
 export const LIMITED_CONCURRENCY_ENDPOINT_ROUTE_TAG = 'endpoint:limited-concurrency';
diff --git a/x-pack/plugins/security_solution/common/endpoint/types/index.ts b/x-pack/plugins/security_solution/common/endpoint/types/index.ts
index cc40225ec1a10..6afec75903477 100644
--- a/x-pack/plugins/security_solution/common/endpoint/types/index.ts
+++ b/x-pack/plugins/security_solution/common/endpoint/types/index.ts
@@ -297,6 +297,8 @@ export interface HostResultList {
   request_page_size: number;
   /* the page index requested */
   request_page_index: number;
+  /* the version of the query strategy */
+  query_strategy_version: MetadataQueryStrategyVersions;
 }
 
 /**
@@ -504,9 +506,16 @@ export enum HostStatus {
   UNENROLLING = 'unenrolling',
 }
 
+export enum MetadataQueryStrategyVersions {
+  VERSION_1 = 'v1',
+  VERSION_2 = 'v2',
+}
+
 export type HostInfo = Immutable<{
   metadata: HostMetadata;
   host_status: HostStatus;
+  /* the version of the query strategy */
+  query_strategy_version: MetadataQueryStrategyVersions;
 }>;
 
 export type HostMetadataDetails = Immutable<{
diff --git a/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/store/mock_endpoint_result_list.ts b/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/store/mock_endpoint_result_list.ts
index c5363a5ae9522..3b05afb975d47 100644
--- a/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/store/mock_endpoint_result_list.ts
+++ b/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/store/mock_endpoint_result_list.ts
@@ -11,6 +11,7 @@ import {
   HostPolicyResponse,
   HostResultList,
   HostStatus,
+  MetadataQueryStrategyVersions,
 } from '../../../../../common/endpoint/types';
 import { EndpointDocGenerator } from '../../../../../common/endpoint/generate_data';
 import {
@@ -49,6 +50,7 @@ export const mockEndpointResultList: (options?: {
     hosts.push({
       metadata: generator.generateHostMetadata(),
       host_status: HostStatus.ERROR,
+      query_strategy_version: MetadataQueryStrategyVersions.VERSION_2,
     });
   }
   const mock: HostResultList = {
@@ -56,6 +58,7 @@ export const mockEndpointResultList: (options?: {
     total,
     request_page_size: requestPageSize,
     request_page_index: requestPageIndex,
+    query_strategy_version: MetadataQueryStrategyVersions.VERSION_2,
   };
   return mock;
 };
@@ -67,6 +70,7 @@ export const mockEndpointDetailsApiResult = (): HostInfo => {
   return {
     metadata: generator.generateHostMetadata(),
     host_status: HostStatus.ERROR,
+    query_strategy_version: MetadataQueryStrategyVersions.VERSION_2,
   };
 };
 
@@ -103,6 +107,7 @@ const endpointListApiPathHandlerMocks = ({
         request_page_size: 10,
         request_page_index: 0,
         total: endpointsResults?.length || 0,
+        query_strategy_version: MetadataQueryStrategyVersions.VERSION_2,
       };
     },
 
diff --git a/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/view/index.test.tsx b/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/view/index.test.tsx
index 2bdf17b806079..bd8344f41fe3a 100644
--- a/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/view/index.test.tsx
+++ b/x-pack/plugins/security_solution/public/management/pages/endpoint_hosts/view/index.test.tsx
@@ -20,6 +20,7 @@ import {
   HostPolicyResponseActionStatus,
   HostPolicyResponseAppliedAction,
   HostStatus,
+  MetadataQueryStrategyVersions,
 } from '../../../../../common/endpoint/types';
 import { EndpointDocGenerator } from '../../../../../common/endpoint/generate_data';
 import { POLICY_STATUS_TO_HEALTH_COLOR, POLICY_STATUS_TO_TEXT } from './host_constants';
@@ -131,6 +132,7 @@ describe('when on the list page', () => {
               hostListData[index] = {
                 metadata: hostListData[index].metadata,
                 host_status: status,
+                query_strategy_version: MetadataQueryStrategyVersions.VERSION_2,
               };
             }
           );
@@ -301,6 +303,8 @@ describe('when on the list page', () => {
         // eslint-disable-next-line @typescript-eslint/naming-convention
         host_status,
         metadata: { host, ...details },
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        query_strategy_version,
       } = mockEndpointDetailsApiResult();
 
       hostDetails = {
@@ -312,6 +316,7 @@ describe('when on the list page', () => {
             id: '1',
           },
         },
+        query_strategy_version,
       };
 
       agentId = hostDetails.metadata.elastic.agent.id;
@@ -681,6 +686,7 @@ describe('when on the list page', () => {
       hostInfo = {
         host_status: hosts[0].host_status,
         metadata: hosts[0].metadata,
+        query_strategy_version: MetadataQueryStrategyVersions.VERSION_2,
       };
       const packagePolicy = docGenerator.generatePolicyPackagePolicy();
       packagePolicy.id = hosts[0].metadata.Endpoint.policy.applied.id;
diff --git a/x-pack/plugins/security_solution/server/endpoint/endpoint_app_context_services.ts b/x-pack/plugins/security_solution/server/endpoint/endpoint_app_context_services.ts
index 0ec0db9f32776..3fc41550a1fc4 100644
--- a/x-pack/plugins/security_solution/server/endpoint/endpoint_app_context_services.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/endpoint_app_context_services.ts
@@ -9,12 +9,64 @@ import {
   SavedObjectsServiceStart,
   SavedObjectsClientContract,
 } from 'src/core/server';
-import { AgentService, IngestManagerStartContract } from '../../../ingest_manager/server';
+import {
+  AgentService,
+  IngestManagerStartContract,
+  PackageService,
+} from '../../../ingest_manager/server';
 import { getPackagePolicyCreateCallback } from './ingest_integration';
 import { ManifestManager } from './services/artifacts';
+import { MetadataQueryStrategy } from './types';
+import { MetadataQueryStrategyVersions } from '../../common/endpoint/types';
+import {
+  metadataQueryStrategyV1,
+  metadataQueryStrategyV2,
+} from './routes/metadata/support/query_strategies';
+import { ElasticsearchAssetType } from '../../../ingest_manager/common/types/models';
+import { metadataTransformPrefix } from '../../common/endpoint/constants';
+
+export interface MetadataService {
+  queryStrategy(
+    savedObjectsClient: SavedObjectsClientContract,
+    version?: MetadataQueryStrategyVersions
+  ): Promise<MetadataQueryStrategy>;
+}
+
+export const createMetadataService = (packageService: PackageService): MetadataService => {
+  return {
+    async queryStrategy(
+      savedObjectsClient: SavedObjectsClientContract,
+      version?: MetadataQueryStrategyVersions
+    ): Promise<MetadataQueryStrategy> {
+      if (version === MetadataQueryStrategyVersions.VERSION_1) {
+        return metadataQueryStrategyV1();
+      }
+      if (!packageService) {
+        throw new Error('package service is uninitialized');
+      }
+
+      if (version === MetadataQueryStrategyVersions.VERSION_2 || !version) {
+        const assets = await packageService.getInstalledEsAssetReferences(
+          savedObjectsClient,
+          'endpoint'
+        );
+        const expectedTransformAssets = assets.filter(
+          (ref) =>
+            ref.type === ElasticsearchAssetType.transform &&
+            ref.id.startsWith(metadataTransformPrefix)
+        );
+        if (expectedTransformAssets && expectedTransformAssets.length === 1) {
+          return metadataQueryStrategyV2();
+        }
+        return metadataQueryStrategyV1();
+      }
+      return metadataQueryStrategyV1();
+    },
+  };
+};
 
 export type EndpointAppContextServiceStartContract = Partial<
-  Pick<IngestManagerStartContract, 'agentService'>
+  Pick<IngestManagerStartContract, 'agentService' | 'packageService'>
 > & {
   logger: Logger;
   manifestManager?: ManifestManager;
@@ -30,11 +82,13 @@ export class EndpointAppContextService {
   private agentService: AgentService | undefined;
   private manifestManager: ManifestManager | undefined;
   private savedObjectsStart: SavedObjectsServiceStart | undefined;
+  private metadataService: MetadataService | undefined;
 
   public start(dependencies: EndpointAppContextServiceStartContract) {
     this.agentService = dependencies.agentService;
     this.manifestManager = dependencies.manifestManager;
     this.savedObjectsStart = dependencies.savedObjectsStart;
+    this.metadataService = createMetadataService(dependencies.packageService!);
 
     if (this.manifestManager && dependencies.registerIngestCallback) {
       dependencies.registerIngestCallback(
@@ -50,6 +104,10 @@ export class EndpointAppContextService {
     return this.agentService;
   }
 
+  public getMetadataService(): MetadataService | undefined {
+    return this.metadataService;
+  }
+
   public getManifestManager(): ManifestManager | undefined {
     return this.manifestManager;
   }
diff --git a/x-pack/plugins/security_solution/server/endpoint/mocks.ts b/x-pack/plugins/security_solution/server/endpoint/mocks.ts
index b5f35a198fa9e..9fd1fb26b1c58 100644
--- a/x-pack/plugins/security_solution/server/endpoint/mocks.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/mocks.ts
@@ -11,6 +11,7 @@ import {
   AgentService,
   IngestManagerStartContract,
   ExternalCallback,
+  PackageService,
 } from '../../../ingest_manager/server';
 import { createPackagePolicyServiceMock } from '../../../ingest_manager/server/mocks';
 import { createMockConfig } from '../lib/detection_engine/routes/__mocks__';
@@ -58,6 +59,7 @@ export const createMockEndpointAppContextServiceStartContract = (): jest.Mocked<
 > => {
   return {
     agentService: createMockAgentService(),
+    packageService: createMockPackageService(),
     logger: loggingSystemMock.create().get('mock_endpoint_app_context'),
     savedObjectsStart: savedObjectsServiceMock.createStartContract(),
     manifestManager: getManifestManagerMock(),
@@ -68,6 +70,16 @@ export const createMockEndpointAppContextServiceStartContract = (): jest.Mocked<
   };
 };
 
+/**
+ * Create mock PackageService
+ */
+
+export const createMockPackageService = (): jest.Mocked<PackageService> => {
+  return {
+    getInstalledEsAssetReferences: jest.fn(),
+  };
+};
+
 /**
  * Creates a mock AgentService
  */
@@ -95,6 +107,7 @@ export const createMockIngestManagerStartContract = (
       getESIndexPattern: jest.fn().mockResolvedValue(indexPattern),
     },
     agentService: createMockAgentService(),
+    packageService: createMockPackageService(),
     registerExternalCallback: jest.fn((...args: ExternalCallback) => {}),
     packagePolicyService: createPackagePolicyServiceMock(),
   };
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/handlers.ts b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/handlers.ts
new file mode 100644
index 0000000000000..cc371f9120ba0
--- /dev/null
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/handlers.ts
@@ -0,0 +1,290 @@
+/*
+ * 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 Boom from 'boom';
+import { RequestHandlerContext, Logger, RequestHandler } from 'kibana/server';
+import { TypeOf } from '@kbn/config-schema';
+import {
+  HostInfo,
+  HostMetadata,
+  HostResultList,
+  HostStatus,
+  MetadataQueryStrategyVersions,
+} from '../../../../common/endpoint/types';
+import { getESQueryHostMetadataByID, kibanaRequestToMetadataListESQuery } from './query_builders';
+import { Agent, AgentStatus } from '../../../../../ingest_manager/common/types/models';
+import { EndpointAppContext, HostListQueryResult } from '../../types';
+import { GetMetadataListRequestSchema, GetMetadataRequestSchema } from './index';
+import { findAllUnenrolledAgentIds } from './support/unenroll';
+import { findAgentIDsByStatus } from './support/agent_status';
+import { EndpointAppContextService } from '../../endpoint_app_context_services';
+
+export interface MetadataRequestContext {
+  endpointAppContextService: EndpointAppContextService;
+  logger: Logger;
+  requestHandlerContext: RequestHandlerContext;
+}
+
+const HOST_STATUS_MAPPING = new Map<AgentStatus, HostStatus>([
+  ['online', HostStatus.ONLINE],
+  ['offline', HostStatus.OFFLINE],
+  ['unenrolling', HostStatus.UNENROLLING],
+]);
+
+/**
+ * 00000000-0000-0000-0000-000000000000 is initial Elastic Agent id sent by Endpoint before policy is configured
+ * 11111111-1111-1111-1111-111111111111 is Elastic Agent id sent by Endpoint when policy does not contain an id
+ */
+
+const IGNORED_ELASTIC_AGENT_IDS = [
+  '00000000-0000-0000-0000-000000000000',
+  '11111111-1111-1111-1111-111111111111',
+];
+
+export const getLogger = (endpointAppContext: EndpointAppContext): Logger => {
+  return endpointAppContext.logFactory.get('metadata');
+};
+
+export const getMetadataListRequestHandler = function (
+  endpointAppContext: EndpointAppContext,
+  logger: Logger,
+  queryStrategyVersion?: MetadataQueryStrategyVersions
+): RequestHandler<undefined, undefined, TypeOf<typeof GetMetadataListRequestSchema.body>> {
+  return async (context, request, response) => {
+    try {
+      const agentService = endpointAppContext.service.getAgentService();
+      if (agentService === undefined) {
+        throw new Error('agentService not available');
+      }
+
+      const metadataRequestContext: MetadataRequestContext = {
+        endpointAppContextService: endpointAppContext.service,
+        logger,
+        requestHandlerContext: context,
+      };
+
+      const unenrolledAgentIds = await findAllUnenrolledAgentIds(
+        agentService,
+        context.core.savedObjects.client
+      );
+
+      const statusIDs = request?.body?.filters?.host_status?.length
+        ? await findAgentIDsByStatus(
+            agentService,
+            context.core.savedObjects.client,
+            request.body?.filters?.host_status
+          )
+        : undefined;
+
+      const queryStrategy = await endpointAppContext.service
+        ?.getMetadataService()
+        ?.queryStrategy(context.core.savedObjects.client, queryStrategyVersion);
+
+      const queryParams = await kibanaRequestToMetadataListESQuery(
+        request,
+        endpointAppContext,
+        queryStrategy!,
+        {
+          unenrolledAgentIds: unenrolledAgentIds.concat(IGNORED_ELASTIC_AGENT_IDS),
+          statusAgentIDs: statusIDs,
+        }
+      );
+
+      const hostListQueryResult = queryStrategy!.queryResponseToHostListResult(
+        await context.core.elasticsearch.legacy.client.callAsCurrentUser('search', queryParams)
+      );
+      return response.ok({
+        body: await mapToHostResultList(queryParams, hostListQueryResult, metadataRequestContext),
+      });
+    } catch (err) {
+      logger.warn(JSON.stringify(err, null, 2));
+      return response.internalError({ body: err });
+    }
+  };
+};
+
+export const getMetadataRequestHandler = function (
+  endpointAppContext: EndpointAppContext,
+  logger: Logger,
+  queryStrategyVersion?: MetadataQueryStrategyVersions
+): RequestHandler<TypeOf<typeof GetMetadataRequestSchema.params>, undefined, undefined> {
+  return async (context, request, response) => {
+    const agentService = endpointAppContext.service.getAgentService();
+    if (agentService === undefined) {
+      return response.internalError({ body: 'agentService not available' });
+    }
+
+    const metadataRequestContext: MetadataRequestContext = {
+      endpointAppContextService: endpointAppContext.service,
+      logger,
+      requestHandlerContext: context,
+    };
+
+    try {
+      const doc = await getHostData(
+        metadataRequestContext,
+        request?.params?.id,
+        queryStrategyVersion
+      );
+      if (doc) {
+        return response.ok({ body: doc });
+      }
+      return response.notFound({ body: 'Endpoint Not Found' });
+    } catch (err) {
+      logger.warn(JSON.stringify(err, null, 2));
+      if (err.isBoom) {
+        return response.customError({
+          statusCode: err.output.statusCode,
+          body: { message: err.message },
+        });
+      }
+      return response.internalError({ body: err });
+    }
+  };
+};
+
+export async function getHostData(
+  metadataRequestContext: MetadataRequestContext,
+  id: string,
+  queryStrategyVersion?: MetadataQueryStrategyVersions
+): Promise<HostInfo | undefined> {
+  const queryStrategy = await metadataRequestContext.endpointAppContextService
+    ?.getMetadataService()
+    ?.queryStrategy(
+      metadataRequestContext.requestHandlerContext.core.savedObjects.client,
+      queryStrategyVersion
+    );
+
+  const query = getESQueryHostMetadataByID(id, queryStrategy!);
+  const hostResult = queryStrategy!.queryResponseToHostResult(
+    await metadataRequestContext.requestHandlerContext.core.elasticsearch.legacy.client.callAsCurrentUser(
+      'search',
+      query
+    )
+  );
+  const hostMetadata = hostResult.result;
+  if (!hostMetadata) {
+    return undefined;
+  }
+
+  const agent = await findAgent(metadataRequestContext, hostMetadata);
+
+  if (agent && !agent.active) {
+    throw Boom.badRequest('the requested endpoint is unenrolled');
+  }
+
+  const metadata = await enrichHostMetadata(
+    hostMetadata,
+    metadataRequestContext,
+    hostResult.queryStrategyVersion
+  );
+  return { ...metadata, query_strategy_version: hostResult.queryStrategyVersion };
+}
+
+async function findAgent(
+  metadataRequestContext: MetadataRequestContext,
+  hostMetadata: HostMetadata
+): Promise<Agent | undefined> {
+  try {
+    return await metadataRequestContext.endpointAppContextService
+      ?.getAgentService()
+      ?.getAgent(
+        metadataRequestContext.requestHandlerContext.core.savedObjects.client,
+        hostMetadata.elastic.agent.id
+      );
+  } catch (e) {
+    if (
+      metadataRequestContext.requestHandlerContext.core.savedObjects.client.errors.isNotFoundError(
+        e
+      )
+    ) {
+      metadataRequestContext.logger.warn(
+        `agent with id ${hostMetadata.elastic.agent.id} not found`
+      );
+      return undefined;
+    } else {
+      throw e;
+    }
+  }
+}
+
+export async function mapToHostResultList(
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  queryParams: Record<string, any>,
+  hostListQueryResult: HostListQueryResult,
+  metadataRequestContext: MetadataRequestContext
+): Promise<HostResultList> {
+  const totalNumberOfHosts = hostListQueryResult.resultLength;
+  if (hostListQueryResult.resultList.length > 0) {
+    return {
+      request_page_size: queryParams.size,
+      request_page_index: queryParams.from,
+      hosts: await Promise.all(
+        hostListQueryResult.resultList.map(async (entry) =>
+          enrichHostMetadata(
+            entry,
+            metadataRequestContext,
+            hostListQueryResult.queryStrategyVersion
+          )
+        )
+      ),
+      total: totalNumberOfHosts,
+      query_strategy_version: hostListQueryResult.queryStrategyVersion,
+    };
+  } else {
+    return {
+      request_page_size: queryParams.size,
+      request_page_index: queryParams.from,
+      total: totalNumberOfHosts,
+      hosts: [],
+      query_strategy_version: hostListQueryResult.queryStrategyVersion,
+    };
+  }
+}
+
+async function enrichHostMetadata(
+  hostMetadata: HostMetadata,
+  metadataRequestContext: MetadataRequestContext,
+  metadataQueryStrategyVersion: MetadataQueryStrategyVersions
+): Promise<HostInfo> {
+  let hostStatus = HostStatus.ERROR;
+  let elasticAgentId = hostMetadata?.elastic?.agent?.id;
+  const log = metadataRequestContext.logger;
+  try {
+    /**
+     * Get agent status by elastic agent id if available or use the host id.
+     */
+
+    if (!elasticAgentId) {
+      elasticAgentId = hostMetadata.host.id;
+      log.warn(`Missing elastic agent id, using host id instead ${elasticAgentId}`);
+    }
+
+    const status = await metadataRequestContext.endpointAppContextService
+      ?.getAgentService()
+      ?.getAgentStatusById(
+        metadataRequestContext.requestHandlerContext.core.savedObjects.client,
+        elasticAgentId
+      );
+    hostStatus = HOST_STATUS_MAPPING.get(status!) || HostStatus.ERROR;
+  } catch (e) {
+    if (
+      metadataRequestContext.requestHandlerContext.core.savedObjects.client.errors.isNotFoundError(
+        e
+      )
+    ) {
+      log.warn(`agent with id ${elasticAgentId} not found`);
+    } else {
+      log.error(e);
+      throw e;
+    }
+  }
+  return {
+    metadata: hostMetadata,
+    host_status: hostStatus,
+    query_strategy_version: metadataQueryStrategyVersion,
+  };
+}
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/index.ts b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/index.ts
index 144c536b4e45f..bfb2a6a828e68 100644
--- a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/index.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/index.ts
@@ -4,51 +4,18 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { IRouter, Logger, RequestHandlerContext } from 'kibana/server';
-import { SearchResponse } from 'elasticsearch';
+import { IRouter } from 'kibana/server';
 import { schema } from '@kbn/config-schema';
-import Boom from 'boom';
 
-import { metadataCurrentIndexPattern } from '../../../../common/endpoint/constants';
-import { getESQueryHostMetadataByID, kibanaRequestToMetadataListESQuery } from './query_builders';
-import {
-  HostInfo,
-  HostMetadata,
-  HostMetadataDetails,
-  HostResultList,
-  HostStatus,
-} from '../../../../common/endpoint/types';
+import { HostStatus, MetadataQueryStrategyVersions } from '../../../../common/endpoint/types';
 import { EndpointAppContext } from '../../types';
-import { AgentService } from '../../../../../ingest_manager/server';
-import { Agent, AgentStatus } from '../../../../../ingest_manager/common/types/models';
-import { findAllUnenrolledAgentIds } from './support/unenroll';
-import { findAgentIDsByStatus } from './support/agent_status';
+import { getLogger, getMetadataListRequestHandler, getMetadataRequestHandler } from './handlers';
 
-interface MetadataRequestContext {
-  agentService: AgentService;
-  logger: Logger;
-  requestHandlerContext: RequestHandlerContext;
-}
-
-const HOST_STATUS_MAPPING = new Map<AgentStatus, HostStatus>([
-  ['online', HostStatus.ONLINE],
-  ['offline', HostStatus.OFFLINE],
-  ['unenrolling', HostStatus.UNENROLLING],
-]);
-
-/**
- * 00000000-0000-0000-0000-000000000000 is initial Elastic Agent id sent by Endpoint before policy is configured
- * 11111111-1111-1111-1111-111111111111 is Elastic Agent id sent by Endpoint when policy does not contain an id
- */
-
-const IGNORED_ELASTIC_AGENT_IDS = [
-  '00000000-0000-0000-0000-000000000000',
-  '11111111-1111-1111-1111-111111111111',
-];
-
-const getLogger = (endpointAppContext: EndpointAppContext): Logger => {
-  return endpointAppContext.logFactory.get('metadata');
-};
+export const BASE_ENDPOINT_ROUTE = '/api/endpoint';
+export const METADATA_REQUEST_V1_ROUTE = `${BASE_ENDPOINT_ROUTE}/v1/metadata`;
+export const GET_METADATA_REQUEST_V1_ROUTE = `${METADATA_REQUEST_V1_ROUTE}/{id}`;
+export const METADATA_REQUEST_ROUTE = `${BASE_ENDPOINT_ROUTE}/metadata`;
+export const GET_METADATA_REQUEST_ROUTE = `${METADATA_REQUEST_ROUTE}/{id}`;
 
 /* Filters that can be applied to the endpoint fetch route */
 export const endpointFilters = schema.object({
@@ -65,241 +32,73 @@ export const endpointFilters = schema.object({
   ),
 });
 
+export const GetMetadataRequestSchema = {
+  params: schema.object({ id: schema.string() }),
+};
+
+export const GetMetadataListRequestSchema = {
+  body: schema.nullable(
+    schema.object({
+      paging_properties: schema.nullable(
+        schema.arrayOf(
+          schema.oneOf([
+            /**
+             * the number of results to return for this request per page
+             */
+            schema.object({
+              page_size: schema.number({ defaultValue: 10, min: 1, max: 10000 }),
+            }),
+            /**
+             * the zero based page index of the the total number of pages of page size
+             */
+            schema.object({ page_index: schema.number({ defaultValue: 0, min: 0 }) }),
+          ])
+        )
+      ),
+      filters: endpointFilters,
+    })
+  ),
+};
+
 export function registerEndpointRoutes(router: IRouter, endpointAppContext: EndpointAppContext) {
   const logger = getLogger(endpointAppContext);
   router.post(
     {
-      path: '/api/endpoint/metadata',
-      validate: {
-        body: schema.nullable(
-          schema.object({
-            paging_properties: schema.nullable(
-              schema.arrayOf(
-                schema.oneOf([
-                  /**
-                   * the number of results to return for this request per page
-                   */
-                  schema.object({
-                    page_size: schema.number({ defaultValue: 10, min: 1, max: 10000 }),
-                  }),
-                  /**
-                   * the zero based page index of the the total number of pages of page size
-                   */
-                  schema.object({ page_index: schema.number({ defaultValue: 0, min: 0 }) }),
-                ])
-              )
-            ),
-            filters: endpointFilters,
-          })
-        ),
-      },
+      path: `${METADATA_REQUEST_V1_ROUTE}`,
+      validate: GetMetadataListRequestSchema,
       options: { authRequired: true, tags: ['access:securitySolution'] },
     },
-    async (context, req, res) => {
-      try {
-        const agentService = endpointAppContext.service.getAgentService();
-        if (agentService === undefined) {
-          throw new Error('agentService not available');
-        }
-
-        const metadataRequestContext: MetadataRequestContext = {
-          agentService,
-          logger,
-          requestHandlerContext: context,
-        };
-
-        const unenrolledAgentIds = await findAllUnenrolledAgentIds(
-          agentService,
-          context.core.savedObjects.client
-        );
-
-        const statusIDs = req.body?.filters?.host_status?.length
-          ? await findAgentIDsByStatus(
-              agentService,
-              context.core.savedObjects.client,
-              req.body?.filters?.host_status
-            )
-          : undefined;
-
-        const queryParams = await kibanaRequestToMetadataListESQuery(
-          req,
-          endpointAppContext,
-          metadataCurrentIndexPattern,
-          {
-            unenrolledAgentIds: unenrolledAgentIds.concat(IGNORED_ELASTIC_AGENT_IDS),
-            statusAgentIDs: statusIDs,
-          }
-        );
-
-        const response = (await context.core.elasticsearch.legacy.client.callAsCurrentUser(
-          'search',
-          queryParams
-        )) as SearchResponse<HostMetadataDetails>;
+    getMetadataListRequestHandler(
+      endpointAppContext,
+      logger,
+      MetadataQueryStrategyVersions.VERSION_1
+    )
+  );
 
-        return res.ok({
-          body: await mapToHostResultList(queryParams, response, metadataRequestContext),
-        });
-      } catch (err) {
-        logger.warn(JSON.stringify(err, null, 2));
-        return res.internalError({ body: err });
-      }
-    }
+  router.post(
+    {
+      path: `${METADATA_REQUEST_ROUTE}`,
+      validate: GetMetadataListRequestSchema,
+      options: { authRequired: true, tags: ['access:securitySolution'] },
+    },
+    getMetadataListRequestHandler(endpointAppContext, logger)
   );
 
   router.get(
     {
-      path: '/api/endpoint/metadata/{id}',
-      validate: {
-        params: schema.object({ id: schema.string() }),
-      },
+      path: `${GET_METADATA_REQUEST_V1_ROUTE}`,
+      validate: GetMetadataRequestSchema,
       options: { authRequired: true, tags: ['access:securitySolution'] },
     },
-    async (context, req, res) => {
-      const agentService = endpointAppContext.service.getAgentService();
-      if (agentService === undefined) {
-        return res.internalError({ body: 'agentService not available' });
-      }
-
-      const metadataRequestContext: MetadataRequestContext = {
-        agentService,
-        logger,
-        requestHandlerContext: context,
-      };
-
-      try {
-        const doc = await getHostData(metadataRequestContext, req.params.id);
-        if (doc) {
-          return res.ok({ body: doc });
-        }
-        return res.notFound({ body: 'Endpoint Not Found' });
-      } catch (err) {
-        logger.warn(JSON.stringify(err, null, 2));
-        if (err.isBoom) {
-          return res.customError({
-            statusCode: err.output.statusCode,
-            body: { message: err.message },
-          });
-        }
-        return res.internalError({ body: err });
-      }
-    }
+    getMetadataRequestHandler(endpointAppContext, logger, MetadataQueryStrategyVersions.VERSION_1)
   );
-}
-
-export async function getHostData(
-  metadataRequestContext: MetadataRequestContext,
-  id: string
-): Promise<HostInfo | undefined> {
-  const query = getESQueryHostMetadataByID(id, metadataCurrentIndexPattern);
-  const response = (await metadataRequestContext.requestHandlerContext.core.elasticsearch.legacy.client.callAsCurrentUser(
-    'search',
-    query
-  )) as SearchResponse<HostMetadataDetails>;
-
-  if (response.hits.hits.length === 0) {
-    return undefined;
-  }
-
-  const hostMetadata: HostMetadata = response.hits.hits[0]._source.HostDetails;
-  const agent = await findAgent(metadataRequestContext, hostMetadata);
-
-  if (agent && !agent.active) {
-    throw Boom.badRequest('the requested endpoint is unenrolled');
-  }
-
-  return enrichHostMetadata(hostMetadata, metadataRequestContext);
-}
-
-async function findAgent(
-  metadataRequestContext: MetadataRequestContext,
-  hostMetadata: HostMetadata
-): Promise<Agent | undefined> {
-  try {
-    return await metadataRequestContext.agentService.getAgent(
-      metadataRequestContext.requestHandlerContext.core.savedObjects.client,
-      hostMetadata.elastic.agent.id
-    );
-  } catch (e) {
-    if (
-      metadataRequestContext.requestHandlerContext.core.savedObjects.client.errors.isNotFoundError(
-        e
-      )
-    ) {
-      metadataRequestContext.logger.warn(
-        `agent with id ${hostMetadata.elastic.agent.id} not found`
-      );
-      return undefined;
-    } else {
-      throw e;
-    }
-  }
-}
 
-async function mapToHostResultList(
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  queryParams: Record<string, any>,
-  searchResponse: SearchResponse<HostMetadataDetails>,
-  metadataRequestContext: MetadataRequestContext
-): Promise<HostResultList> {
-  const totalNumberOfHosts =
-    ((searchResponse.hits?.total as unknown) as { value: number; relation: string }).value || 0;
-  if (searchResponse.hits.hits.length > 0) {
-    return {
-      request_page_size: queryParams.size,
-      request_page_index: queryParams.from,
-      hosts: await Promise.all(
-        searchResponse.hits.hits.map(async (entry) =>
-          enrichHostMetadata(entry._source.HostDetails, metadataRequestContext)
-        )
-      ),
-      total: totalNumberOfHosts,
-    };
-  } else {
-    return {
-      request_page_size: queryParams.size,
-      request_page_index: queryParams.from,
-      total: totalNumberOfHosts,
-      hosts: [],
-    };
-  }
-}
-
-async function enrichHostMetadata(
-  hostMetadata: HostMetadata,
-  metadataRequestContext: MetadataRequestContext
-): Promise<HostInfo> {
-  let hostStatus = HostStatus.ERROR;
-  let elasticAgentId = hostMetadata?.elastic?.agent?.id;
-  const log = metadataRequestContext.logger;
-  try {
-    /**
-     * Get agent status by elastic agent id if available or use the host id.
-     */
-
-    if (!elasticAgentId) {
-      elasticAgentId = hostMetadata.host.id;
-      log.warn(`Missing elastic agent id, using host id instead ${elasticAgentId}`);
-    }
-
-    const status = await metadataRequestContext.agentService.getAgentStatusById(
-      metadataRequestContext.requestHandlerContext.core.savedObjects.client,
-      elasticAgentId
-    );
-    hostStatus = HOST_STATUS_MAPPING.get(status) || HostStatus.ERROR;
-  } catch (e) {
-    if (
-      metadataRequestContext.requestHandlerContext.core.savedObjects.client.errors.isNotFoundError(
-        e
-      )
-    ) {
-      log.warn(`agent with id ${elasticAgentId} not found`);
-    } else {
-      log.error(e);
-      throw e;
-    }
-  }
-  return {
-    metadata: hostMetadata,
-    host_status: hostStatus,
-  };
+  router.get(
+    {
+      path: `${GET_METADATA_REQUEST_ROUTE}`,
+      validate: GetMetadataRequestSchema,
+      options: { authRequired: true, tags: ['access:securitySolution'] },
+    },
+    getMetadataRequestHandler(endpointAppContext, logger)
+  );
 }
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/metadata.test.ts b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/metadata.test.ts
index f784941f3539a..299939eb92444 100644
--- a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/metadata.test.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/metadata.test.ts
@@ -22,21 +22,26 @@ import {
 } from '../../../../../../../src/core/server/mocks';
 import {
   HostInfo,
-  HostMetadata,
-  HostMetadataDetails,
   HostResultList,
   HostStatus,
+  MetadataQueryStrategyVersions,
 } from '../../../../common/endpoint/types';
-import { SearchResponse } from 'elasticsearch';
-import { registerEndpointRoutes, endpointFilters } from './index';
+import { registerEndpointRoutes, METADATA_REQUEST_ROUTE } from './index';
 import {
   createMockEndpointAppContextServiceStartContract,
+  createMockPackageService,
   createRouteHandlerContext,
 } from '../../mocks';
 import { EndpointAppContextService } from '../../endpoint_app_context_services';
 import { createMockConfig } from '../../../lib/detection_engine/routes/__mocks__';
 import { EndpointDocGenerator } from '../../../../common/endpoint/generate_data';
-import { Agent } from '../../../../../ingest_manager/common/types/models';
+import {
+  Agent,
+  ElasticsearchAssetType,
+  EsAssetReference,
+} from '../../../../../ingest_manager/common/types/models';
+import { createV1SearchResponse, createV2SearchResponse } from './support/test_support';
+import { PackageService } from '../../../../../ingest_manager/server/services';
 
 describe('test endpoint route', () => {
   let routerMock: jest.Mocked<IRouter>;
@@ -44,6 +49,7 @@ describe('test endpoint route', () => {
   let mockClusterClient: jest.Mocked<ILegacyClusterClient>;
   let mockScopedClient: jest.Mocked<ILegacyScopedClusterClient>;
   let mockSavedObjectClient: jest.Mocked<SavedObjectsClientContract>;
+  let mockPackageService: jest.Mocked<PackageService>;
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   let routeHandler: RequestHandler<any, any, any>;
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -61,195 +67,45 @@ describe('test endpoint route', () => {
   };
 
   beforeEach(() => {
+    mockScopedClient = elasticsearchServiceMock.createLegacyScopedClusterClient();
     mockClusterClient = elasticsearchServiceMock.createLegacyClusterClient() as jest.Mocked<
       ILegacyClusterClient
     >;
-    mockScopedClient = elasticsearchServiceMock.createLegacyScopedClusterClient();
     mockSavedObjectClient = savedObjectsClientMock.create();
     mockClusterClient.asScoped.mockReturnValue(mockScopedClient);
     routerMock = httpServiceMock.createRouter();
     mockResponse = httpServerMock.createResponseFactory();
-    endpointAppContextService = new EndpointAppContextService();
-    const startContract = createMockEndpointAppContextServiceStartContract();
-    endpointAppContextService.start(startContract);
-    mockAgentService = startContract.agentService!;
-
-    registerEndpointRoutes(routerMock, {
-      logFactory: loggingSystemMock.create(),
-      service: endpointAppContextService,
-      config: () => Promise.resolve(createMockConfig()),
-    });
-  });
-
-  afterEach(() => endpointAppContextService.stop());
-
-  it('test find the latest of all endpoints', async () => {
-    const mockRequest = httpServerMock.createKibanaRequest({});
-    const response = createSearchResponse(new EndpointDocGenerator().generateHostMetadata());
-    mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
-    [routeConfig, routeHandler] = routerMock.post.mock.calls.find(([{ path }]) =>
-      path.startsWith('/api/endpoint/metadata')
-    )!;
-    mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
-    mockAgentService.listAgents = jest.fn().mockReturnValue(noUnenrolledAgent);
-    await routeHandler(
-      createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
-      mockRequest,
-      mockResponse
-    );
-
-    expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
-    expect(routeConfig.options).toEqual({ authRequired: true, tags: ['access:securitySolution'] });
-    expect(mockResponse.ok).toBeCalled();
-    const endpointResultList = mockResponse.ok.mock.calls[0][0]?.body as HostResultList;
-    expect(endpointResultList.hosts.length).toEqual(1);
-    expect(endpointResultList.total).toEqual(1);
-    expect(endpointResultList.request_page_index).toEqual(0);
-    expect(endpointResultList.request_page_size).toEqual(10);
-  });
-
-  it('test find the latest of all endpoints with paging properties', async () => {
-    const mockRequest = httpServerMock.createKibanaRequest({
-      body: {
-        paging_properties: [
-          {
-            page_size: 10,
-          },
-          {
-            page_index: 1,
-          },
-        ],
-      },
-    });
-
-    mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
-    mockAgentService.listAgents = jest.fn().mockReturnValue(noUnenrolledAgent);
-    mockScopedClient.callAsCurrentUser.mockImplementationOnce(() =>
-      Promise.resolve(createSearchResponse(new EndpointDocGenerator().generateHostMetadata()))
-    );
-    [routeConfig, routeHandler] = routerMock.post.mock.calls.find(([{ path }]) =>
-      path.startsWith('/api/endpoint/metadata')
-    )!;
-
-    await routeHandler(
-      createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
-      mockRequest,
-      mockResponse
-    );
-
-    expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
-    expect(mockScopedClient.callAsCurrentUser.mock.calls[0][1]?.body?.query).toEqual({
-      bool: {
-        must_not: {
-          terms: {
-            'HostDetails.elastic.agent.id': [
-              '00000000-0000-0000-0000-000000000000',
-              '11111111-1111-1111-1111-111111111111',
-            ],
-          },
-        },
-      },
-    });
-    expect(routeConfig.options).toEqual({ authRequired: true, tags: ['access:securitySolution'] });
-    expect(mockResponse.ok).toBeCalled();
-    const endpointResultList = mockResponse.ok.mock.calls[0][0]?.body as HostResultList;
-    expect(endpointResultList.hosts.length).toEqual(1);
-    expect(endpointResultList.total).toEqual(1);
-    expect(endpointResultList.request_page_index).toEqual(10);
-    expect(endpointResultList.request_page_size).toEqual(10);
   });
 
-  it('test find the latest of all endpoints with paging and filters properties', async () => {
-    const mockRequest = httpServerMock.createKibanaRequest({
-      body: {
-        paging_properties: [
-          {
-            page_size: 10,
-          },
-          {
-            page_index: 1,
-          },
-        ],
-
-        filters: { kql: 'not host.ip:10.140.73.246' },
-      },
-    });
+  describe('with no transform package', () => {
+    beforeEach(() => {
+      endpointAppContextService = new EndpointAppContextService();
+      const startContract = createMockEndpointAppContextServiceStartContract();
+      mockPackageService = createMockPackageService();
+      mockPackageService.getInstalledEsAssetReferences.mockReturnValue(
+        Promise.resolve(([] as unknown) as EsAssetReference[])
+      );
+      endpointAppContextService.start({ ...startContract, packageService: mockPackageService });
+      mockAgentService = startContract.agentService!;
 
-    mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
-    mockAgentService.listAgents = jest.fn().mockReturnValue(noUnenrolledAgent);
-    mockScopedClient.callAsCurrentUser.mockImplementationOnce(() =>
-      Promise.resolve(createSearchResponse(new EndpointDocGenerator().generateHostMetadata()))
-    );
-    [routeConfig, routeHandler] = routerMock.post.mock.calls.find(([{ path }]) =>
-      path.startsWith('/api/endpoint/metadata')
-    )!;
-
-    await routeHandler(
-      createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
-      mockRequest,
-      mockResponse
-    );
-
-    expect(mockScopedClient.callAsCurrentUser).toBeCalled();
-    expect(mockScopedClient.callAsCurrentUser.mock.calls[0][1]?.body?.query).toEqual({
-      bool: {
-        must: [
-          {
-            bool: {
-              must_not: {
-                terms: {
-                  'HostDetails.elastic.agent.id': [
-                    '00000000-0000-0000-0000-000000000000',
-                    '11111111-1111-1111-1111-111111111111',
-                  ],
-                },
-              },
-            },
-          },
-          {
-            bool: {
-              must_not: {
-                bool: {
-                  should: [
-                    {
-                      match: {
-                        'host.ip': '10.140.73.246',
-                      },
-                    },
-                  ],
-                  minimum_should_match: 1,
-                },
-              },
-            },
-          },
-        ],
-      },
+      registerEndpointRoutes(routerMock, {
+        logFactory: loggingSystemMock.create(),
+        service: endpointAppContextService,
+        config: () => Promise.resolve(createMockConfig()),
+      });
     });
-    expect(routeConfig.options).toEqual({ authRequired: true, tags: ['access:securitySolution'] });
-    expect(mockResponse.ok).toBeCalled();
-    const endpointResultList = mockResponse.ok.mock.calls[0][0]?.body as HostResultList;
-    expect(endpointResultList.hosts.length).toEqual(1);
-    expect(endpointResultList.total).toEqual(1);
-    expect(endpointResultList.request_page_index).toEqual(10);
-    expect(endpointResultList.request_page_size).toEqual(10);
-  });
-
-  describe('Endpoint Details route', () => {
-    it('should return 404 on no results', async () => {
-      const mockRequest = httpServerMock.createKibanaRequest({ params: { id: 'BADID' } });
-
-      mockScopedClient.callAsCurrentUser.mockImplementationOnce(() =>
-        Promise.resolve(createSearchResponse())
-      );
 
-      mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
-      mockAgentService.getAgent = jest.fn().mockReturnValue(({
-        active: true,
-      } as unknown) as Agent);
+    afterEach(() => endpointAppContextService.stop());
 
-      [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
-        path.startsWith('/api/endpoint/metadata')
+    it('test find the latest of all endpoints', async () => {
+      const mockRequest = httpServerMock.createKibanaRequest({});
+      const response = createV1SearchResponse(new EndpointDocGenerator().generateHostMetadata());
+      mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
+      [routeConfig, routeHandler] = routerMock.post.mock.calls.find(([{ path }]) =>
+        path.startsWith(`${METADATA_REQUEST_ROUTE}`)
       )!;
+      mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
+      mockAgentService.listAgents = jest.fn().mockReturnValue(noUnenrolledAgent);
       await routeHandler(
         createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
         mockRequest,
@@ -261,13 +117,19 @@ describe('test endpoint route', () => {
         authRequired: true,
         tags: ['access:securitySolution'],
       });
-      expect(mockResponse.notFound).toBeCalled();
-      const message = mockResponse.notFound.mock.calls[0][0]?.body;
-      expect(message).toEqual('Endpoint Not Found');
+      expect(mockResponse.ok).toBeCalled();
+      const endpointResultList = mockResponse.ok.mock.calls[0][0]?.body as HostResultList;
+      expect(endpointResultList.hosts.length).toEqual(1);
+      expect(endpointResultList.total).toEqual(1);
+      expect(endpointResultList.request_page_index).toEqual(0);
+      expect(endpointResultList.request_page_size).toEqual(10);
+      expect(endpointResultList.query_strategy_version).toEqual(
+        MetadataQueryStrategyVersions.VERSION_1
+      );
     });
 
     it('should return a single endpoint with status online', async () => {
-      const response = createSearchResponse(new EndpointDocGenerator().generateHostMetadata());
+      const response = createV1SearchResponse(new EndpointDocGenerator().generateHostMetadata());
       const mockRequest = httpServerMock.createKibanaRequest({
         params: { id: response.hits.hits[0]._id },
       });
@@ -279,7 +141,7 @@ describe('test endpoint route', () => {
       mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
 
       [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
-        path.startsWith('/api/endpoint/metadata')
+        path.startsWith(`${METADATA_REQUEST_ROUTE}`)
       )!;
 
       await routeHandler(
@@ -297,29 +159,48 @@ describe('test endpoint route', () => {
       const result = mockResponse.ok.mock.calls[0][0]?.body as HostInfo;
       expect(result).toHaveProperty('metadata.Endpoint');
       expect(result.host_status).toEqual(HostStatus.ONLINE);
+      expect(result.query_strategy_version).toEqual(MetadataQueryStrategyVersions.VERSION_1);
     });
+  });
 
-    it('should return a single endpoint with status error when AgentService throw 404', async () => {
-      const response = createSearchResponse(new EndpointDocGenerator().generateHostMetadata());
-
-      const mockRequest = httpServerMock.createKibanaRequest({
-        params: { id: response.hits.hits[0]._id },
-      });
+  describe('with new transform package', () => {
+    beforeEach(() => {
+      endpointAppContextService = new EndpointAppContextService();
+      const startContract = createMockEndpointAppContextServiceStartContract();
+      mockPackageService = createMockPackageService();
+      mockPackageService.getInstalledEsAssetReferences.mockReturnValue(
+        Promise.resolve([
+          {
+            id: 'logs-endpoint.events.security',
+            type: ElasticsearchAssetType.indexTemplate,
+          },
+          {
+            id: 'metrics-endpoint.metadata-current-default-0.16.0-dev.0',
+            type: ElasticsearchAssetType.transform,
+          },
+        ])
+      );
+      endpointAppContextService.start({ ...startContract, packageService: mockPackageService });
+      mockAgentService = startContract.agentService!;
 
-      mockAgentService.getAgentStatusById = jest.fn().mockImplementation(() => {
-        SavedObjectsErrorHelpers.createGenericNotFoundError();
+      registerEndpointRoutes(routerMock, {
+        logFactory: loggingSystemMock.create(),
+        service: endpointAppContextService,
+        config: () => Promise.resolve(createMockConfig()),
       });
+    });
 
-      mockAgentService.getAgent = jest.fn().mockImplementation(() => {
-        SavedObjectsErrorHelpers.createGenericNotFoundError();
-      });
+    afterEach(() => endpointAppContextService.stop());
 
+    it('test find the latest of all endpoints', async () => {
+      const mockRequest = httpServerMock.createKibanaRequest({});
+      const response = createV2SearchResponse(new EndpointDocGenerator().generateHostMetadata());
       mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
-
-      [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
-        path.startsWith('/api/endpoint/metadata')
+      [routeConfig, routeHandler] = routerMock.post.mock.calls.find(([{ path }]) =>
+        path.startsWith(`${METADATA_REQUEST_ROUTE}`)
       )!;
-
+      mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
+      mockAgentService.listAgents = jest.fn().mockReturnValue(noUnenrolledAgent);
       await routeHandler(
         createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
         mockRequest,
@@ -332,25 +213,37 @@ describe('test endpoint route', () => {
         tags: ['access:securitySolution'],
       });
       expect(mockResponse.ok).toBeCalled();
-      const result = mockResponse.ok.mock.calls[0][0]?.body as HostInfo;
-      expect(result.host_status).toEqual(HostStatus.ERROR);
+      const endpointResultList = mockResponse.ok.mock.calls[0][0]?.body as HostResultList;
+      expect(endpointResultList.hosts.length).toEqual(1);
+      expect(endpointResultList.total).toEqual(1);
+      expect(endpointResultList.request_page_index).toEqual(0);
+      expect(endpointResultList.request_page_size).toEqual(10);
+      expect(endpointResultList.query_strategy_version).toEqual(
+        MetadataQueryStrategyVersions.VERSION_2
+      );
     });
 
-    it('should return a single endpoint with status error when status is not offline, online or enrolling', async () => {
-      const response = createSearchResponse(new EndpointDocGenerator().generateHostMetadata());
-
+    it('test find the latest of all endpoints with paging properties', async () => {
       const mockRequest = httpServerMock.createKibanaRequest({
-        params: { id: response.hits.hits[0]._id },
+        body: {
+          paging_properties: [
+            {
+              page_size: 10,
+            },
+            {
+              page_index: 1,
+            },
+          ],
+        },
       });
 
-      mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('warning');
-      mockAgentService.getAgent = jest.fn().mockReturnValue(({
-        active: true,
-      } as unknown) as Agent);
-      mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
-
-      [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
-        path.startsWith('/api/endpoint/metadata')
+      mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
+      mockAgentService.listAgents = jest.fn().mockReturnValue(noUnenrolledAgent);
+      mockScopedClient.callAsCurrentUser.mockImplementationOnce(() =>
+        Promise.resolve(createV2SearchResponse(new EndpointDocGenerator().generateHostMetadata()))
+      );
+      [routeConfig, routeHandler] = routerMock.post.mock.calls.find(([{ path }]) =>
+        path.startsWith(`${METADATA_REQUEST_ROUTE}`)
       )!;
 
       await routeHandler(
@@ -360,28 +253,56 @@ describe('test endpoint route', () => {
       );
 
       expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+      expect(mockScopedClient.callAsCurrentUser.mock.calls[0][1]?.body?.query).toEqual({
+        bool: {
+          must_not: {
+            terms: {
+              'HostDetails.elastic.agent.id': [
+                '00000000-0000-0000-0000-000000000000',
+                '11111111-1111-1111-1111-111111111111',
+              ],
+            },
+          },
+        },
+      });
       expect(routeConfig.options).toEqual({
         authRequired: true,
         tags: ['access:securitySolution'],
       });
       expect(mockResponse.ok).toBeCalled();
-      const result = mockResponse.ok.mock.calls[0][0]?.body as HostInfo;
-      expect(result.host_status).toEqual(HostStatus.ERROR);
+      const endpointResultList = mockResponse.ok.mock.calls[0][0]?.body as HostResultList;
+      expect(endpointResultList.hosts.length).toEqual(1);
+      expect(endpointResultList.total).toEqual(1);
+      expect(endpointResultList.request_page_index).toEqual(10);
+      expect(endpointResultList.request_page_size).toEqual(10);
+      expect(endpointResultList.query_strategy_version).toEqual(
+        MetadataQueryStrategyVersions.VERSION_2
+      );
     });
 
-    it('should throw error when endpoint agent is not active', async () => {
-      const response = createSearchResponse(new EndpointDocGenerator().generateHostMetadata());
-
+    it('test find the latest of all endpoints with paging and filters properties', async () => {
       const mockRequest = httpServerMock.createKibanaRequest({
-        params: { id: response.hits.hits[0]._id },
+        body: {
+          paging_properties: [
+            {
+              page_size: 10,
+            },
+            {
+              page_index: 1,
+            },
+          ],
+
+          filters: { kql: 'not host.ip:10.140.73.246' },
+        },
       });
-      mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
-      mockAgentService.getAgent = jest.fn().mockReturnValue(({
-        active: false,
-      } as unknown) as Agent);
 
-      [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
-        path.startsWith('/api/endpoint/metadata')
+      mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
+      mockAgentService.listAgents = jest.fn().mockReturnValue(noUnenrolledAgent);
+      mockScopedClient.callAsCurrentUser.mockImplementationOnce(() =>
+        Promise.resolve(createV2SearchResponse(new EndpointDocGenerator().generateHostMetadata()))
+      );
+      [routeConfig, routeHandler] = routerMock.post.mock.calls.find(([{ path }]) =>
+        path.startsWith(`${METADATA_REQUEST_ROUTE}`)
       )!;
 
       await routeHandler(
@@ -390,93 +311,216 @@ describe('test endpoint route', () => {
         mockResponse
       );
 
-      expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
-      expect(mockResponse.customError).toBeCalled();
+      expect(mockScopedClient.callAsCurrentUser).toBeCalled();
+      expect(mockScopedClient.callAsCurrentUser.mock.calls[0][1]?.body?.query).toEqual({
+        bool: {
+          must: [
+            {
+              bool: {
+                must_not: {
+                  terms: {
+                    'HostDetails.elastic.agent.id': [
+                      '00000000-0000-0000-0000-000000000000',
+                      '11111111-1111-1111-1111-111111111111',
+                    ],
+                  },
+                },
+              },
+            },
+            {
+              bool: {
+                must_not: {
+                  bool: {
+                    should: [
+                      {
+                        match: {
+                          'host.ip': '10.140.73.246',
+                        },
+                      },
+                    ],
+                    minimum_should_match: 1,
+                  },
+                },
+              },
+            },
+          ],
+        },
+      });
+      expect(routeConfig.options).toEqual({
+        authRequired: true,
+        tags: ['access:securitySolution'],
+      });
+      expect(mockResponse.ok).toBeCalled();
+      const endpointResultList = mockResponse.ok.mock.calls[0][0]?.body as HostResultList;
+      expect(endpointResultList.hosts.length).toEqual(1);
+      expect(endpointResultList.total).toEqual(1);
+      expect(endpointResultList.request_page_index).toEqual(10);
+      expect(endpointResultList.request_page_size).toEqual(10);
+      expect(endpointResultList.query_strategy_version).toEqual(
+        MetadataQueryStrategyVersions.VERSION_2
+      );
     });
-  });
-});
 
-describe('Filters Schema Test', () => {
-  it('accepts a single host status', () => {
-    expect(
-      endpointFilters.validate({
-        host_status: ['error'],
-      })
-    ).toBeTruthy();
-  });
-
-  it('accepts multiple host status filters', () => {
-    expect(
-      endpointFilters.validate({
-        host_status: ['offline', 'unenrolling'],
-      })
-    ).toBeTruthy();
-  });
+    describe('Endpoint Details route', () => {
+      it('should return 404 on no results', async () => {
+        const mockRequest = httpServerMock.createKibanaRequest({ params: { id: 'BADID' } });
+
+        mockScopedClient.callAsCurrentUser.mockImplementationOnce(() =>
+          Promise.resolve(createV2SearchResponse())
+        );
+
+        mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
+        mockAgentService.getAgent = jest.fn().mockReturnValue(({
+          active: true,
+        } as unknown) as Agent);
+
+        [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
+          path.startsWith(`${METADATA_REQUEST_ROUTE}`)
+        )!;
+        await routeHandler(
+          createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+          mockRequest,
+          mockResponse
+        );
+
+        expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+        expect(routeConfig.options).toEqual({
+          authRequired: true,
+          tags: ['access:securitySolution'],
+        });
+        expect(mockResponse.notFound).toBeCalled();
+        const message = mockResponse.notFound.mock.calls[0][0]?.body;
+        expect(message).toEqual('Endpoint Not Found');
+      });
 
-  it('rejects invalid statuses', () => {
-    expect(() =>
-      endpointFilters.validate({
-        host_status: ['foobar'],
-      })
-    ).toThrowError();
-  });
+      it('should return a single endpoint with status online', async () => {
+        const response = createV2SearchResponse(new EndpointDocGenerator().generateHostMetadata());
+        const mockRequest = httpServerMock.createKibanaRequest({
+          params: { id: response.hits.hits[0]._id },
+        });
+
+        mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('online');
+        mockAgentService.getAgent = jest.fn().mockReturnValue(({
+          active: true,
+        } as unknown) as Agent);
+        mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
+
+        [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
+          path.startsWith(`${METADATA_REQUEST_ROUTE}`)
+        )!;
+
+        await routeHandler(
+          createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+          mockRequest,
+          mockResponse
+        );
+
+        expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+        expect(routeConfig.options).toEqual({
+          authRequired: true,
+          tags: ['access:securitySolution'],
+        });
+        expect(mockResponse.ok).toBeCalled();
+        const result = mockResponse.ok.mock.calls[0][0]?.body as HostInfo;
+        expect(result).toHaveProperty('metadata.Endpoint');
+        expect(result.host_status).toEqual(HostStatus.ONLINE);
+        expect(result.query_strategy_version).toEqual(MetadataQueryStrategyVersions.VERSION_2);
+      });
 
-  it('accepts a KQL string', () => {
-    expect(
-      endpointFilters.validate({
-        kql: 'whatever.field',
-      })
-    ).toBeTruthy();
-  });
+      it('should return a single endpoint with status error when AgentService throw 404', async () => {
+        const response = createV2SearchResponse(new EndpointDocGenerator().generateHostMetadata());
+
+        const mockRequest = httpServerMock.createKibanaRequest({
+          params: { id: response.hits.hits[0]._id },
+        });
+
+        mockAgentService.getAgentStatusById = jest.fn().mockImplementation(() => {
+          SavedObjectsErrorHelpers.createGenericNotFoundError();
+        });
+
+        mockAgentService.getAgent = jest.fn().mockImplementation(() => {
+          SavedObjectsErrorHelpers.createGenericNotFoundError();
+        });
+
+        mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
+
+        [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
+          path.startsWith(`${METADATA_REQUEST_ROUTE}`)
+        )!;
+
+        await routeHandler(
+          createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+          mockRequest,
+          mockResponse
+        );
+
+        expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+        expect(routeConfig.options).toEqual({
+          authRequired: true,
+          tags: ['access:securitySolution'],
+        });
+        expect(mockResponse.ok).toBeCalled();
+        const result = mockResponse.ok.mock.calls[0][0]?.body as HostInfo;
+        expect(result.host_status).toEqual(HostStatus.ERROR);
+      });
 
-  it('accepts KQL + status', () => {
-    expect(
-      endpointFilters.validate({
-        kql: 'thing.var',
-        host_status: ['online'],
-      })
-    ).toBeTruthy();
-  });
+      it('should return a single endpoint with status error when status is not offline, online or enrolling', async () => {
+        const response = createV2SearchResponse(new EndpointDocGenerator().generateHostMetadata());
+
+        const mockRequest = httpServerMock.createKibanaRequest({
+          params: { id: response.hits.hits[0]._id },
+        });
+
+        mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('warning');
+        mockAgentService.getAgent = jest.fn().mockReturnValue(({
+          active: true,
+        } as unknown) as Agent);
+        mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
+
+        [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
+          path.startsWith(`${METADATA_REQUEST_ROUTE}`)
+        )!;
+
+        await routeHandler(
+          createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+          mockRequest,
+          mockResponse
+        );
+
+        expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+        expect(routeConfig.options).toEqual({
+          authRequired: true,
+          tags: ['access:securitySolution'],
+        });
+        expect(mockResponse.ok).toBeCalled();
+        const result = mockResponse.ok.mock.calls[0][0]?.body as HostInfo;
+        expect(result.host_status).toEqual(HostStatus.ERROR);
+      });
 
-  it('accepts no filters', () => {
-    expect(endpointFilters.validate({})).toBeTruthy();
+      it('should throw error when endpoint agent is not active', async () => {
+        const response = createV2SearchResponse(new EndpointDocGenerator().generateHostMetadata());
+
+        const mockRequest = httpServerMock.createKibanaRequest({
+          params: { id: response.hits.hits[0]._id },
+        });
+        mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
+        mockAgentService.getAgent = jest.fn().mockReturnValue(({
+          active: false,
+        } as unknown) as Agent);
+
+        [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
+          path.startsWith(`${METADATA_REQUEST_ROUTE}`)
+        )!;
+
+        await routeHandler(
+          createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+          mockRequest,
+          mockResponse
+        );
+
+        expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+        expect(mockResponse.customError).toBeCalled();
+      });
+    });
   });
 });
-
-function createSearchResponse(hostMetadata?: HostMetadata): SearchResponse<HostMetadataDetails> {
-  return ({
-    took: 15,
-    timed_out: false,
-    _shards: {
-      total: 1,
-      successful: 1,
-      skipped: 0,
-      failed: 0,
-    },
-    hits: {
-      total: {
-        value: 1,
-        relation: 'eq',
-      },
-      max_score: null,
-      hits: hostMetadata
-        ? [
-            {
-              _index: 'metrics-endpoint.metadata-default',
-              _id: '8FhM0HEBYyRTvb6lOQnw',
-              _score: null,
-              _source: {
-                agent: {
-                  id: '1e3472bb-5c20-4946-b469-b5af1a809e4f',
-                },
-                HostDetails: {
-                  ...hostMetadata,
-                },
-              },
-              sort: [1588337587997],
-            },
-          ]
-        : [],
-    },
-  } as unknown) as SearchResponse<HostMetadataDetails>;
-}
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/metadata_v1.test.ts b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/metadata_v1.test.ts
new file mode 100644
index 0000000000000..568917c804733
--- /dev/null
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/metadata_v1.test.ts
@@ -0,0 +1,412 @@
+/*
+ * 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 {
+  ILegacyClusterClient,
+  IRouter,
+  ILegacyScopedClusterClient,
+  KibanaResponseFactory,
+  RequestHandler,
+  RouteConfig,
+  SavedObjectsClientContract,
+} from 'kibana/server';
+import { SavedObjectsErrorHelpers } from '../../../../../../../src/core/server/';
+import {
+  elasticsearchServiceMock,
+  httpServerMock,
+  httpServiceMock,
+  loggingSystemMock,
+  savedObjectsClientMock,
+} from '../../../../../../../src/core/server/mocks';
+import {
+  HostInfo,
+  HostResultList,
+  HostStatus,
+  MetadataQueryStrategyVersions,
+} from '../../../../common/endpoint/types';
+import { registerEndpointRoutes, METADATA_REQUEST_V1_ROUTE } from './index';
+import {
+  createMockEndpointAppContextServiceStartContract,
+  createMockPackageService,
+  createRouteHandlerContext,
+} from '../../mocks';
+import { EndpointAppContextService } from '../../endpoint_app_context_services';
+import { createMockConfig } from '../../../lib/detection_engine/routes/__mocks__';
+import { EndpointDocGenerator } from '../../../../common/endpoint/generate_data';
+import { Agent, EsAssetReference } from '../../../../../ingest_manager/common/types/models';
+import { createV1SearchResponse } from './support/test_support';
+import { PackageService } from '../../../../../ingest_manager/server/services';
+
+describe('test endpoint route v1', () => {
+  let routerMock: jest.Mocked<IRouter>;
+  let mockResponse: jest.Mocked<KibanaResponseFactory>;
+  let mockClusterClient: jest.Mocked<ILegacyClusterClient>;
+  let mockScopedClient: jest.Mocked<ILegacyScopedClusterClient>;
+  let mockSavedObjectClient: jest.Mocked<SavedObjectsClientContract>;
+  let mockPackageService: jest.Mocked<PackageService>;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  let routeHandler: RequestHandler<any, any, any>;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  let routeConfig: RouteConfig<any, any, any, any>;
+  // tests assume that ingestManager is enabled, and thus agentService is available
+  let mockAgentService: Required<
+    ReturnType<typeof createMockEndpointAppContextServiceStartContract>
+  >['agentService'];
+  let endpointAppContextService: EndpointAppContextService;
+  const noUnenrolledAgent = {
+    agents: [],
+    total: 0,
+    page: 1,
+    perPage: 1,
+  };
+
+  beforeEach(() => {
+    mockClusterClient = elasticsearchServiceMock.createLegacyClusterClient() as jest.Mocked<
+      ILegacyClusterClient
+    >;
+    mockScopedClient = elasticsearchServiceMock.createLegacyScopedClusterClient();
+    mockSavedObjectClient = savedObjectsClientMock.create();
+    mockClusterClient.asScoped.mockReturnValue(mockScopedClient);
+    routerMock = httpServiceMock.createRouter();
+    mockResponse = httpServerMock.createResponseFactory();
+    endpointAppContextService = new EndpointAppContextService();
+    mockPackageService = createMockPackageService();
+    mockPackageService.getInstalledEsAssetReferences.mockReturnValue(
+      Promise.resolve(([] as unknown) as EsAssetReference[])
+    );
+    const startContract = createMockEndpointAppContextServiceStartContract();
+    endpointAppContextService.start({ ...startContract, packageService: mockPackageService });
+    mockAgentService = startContract.agentService!;
+
+    registerEndpointRoutes(routerMock, {
+      logFactory: loggingSystemMock.create(),
+      service: endpointAppContextService,
+      config: () => Promise.resolve(createMockConfig()),
+    });
+  });
+
+  afterEach(() => endpointAppContextService.stop());
+
+  it('test find the latest of all endpoints', async () => {
+    const mockRequest = httpServerMock.createKibanaRequest({});
+    const response = createV1SearchResponse(new EndpointDocGenerator().generateHostMetadata());
+    mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
+    [routeConfig, routeHandler] = routerMock.post.mock.calls.find(([{ path }]) =>
+      path.startsWith(`${METADATA_REQUEST_V1_ROUTE}`)
+    )!;
+    mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
+    mockAgentService.listAgents = jest.fn().mockReturnValue(noUnenrolledAgent);
+    await routeHandler(
+      createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+      mockRequest,
+      mockResponse
+    );
+
+    expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+    expect(routeConfig.options).toEqual({ authRequired: true, tags: ['access:securitySolution'] });
+    expect(mockResponse.ok).toBeCalled();
+    const endpointResultList = mockResponse.ok.mock.calls[0][0]?.body as HostResultList;
+    expect(endpointResultList.hosts.length).toEqual(1);
+    expect(endpointResultList.total).toEqual(1);
+    expect(endpointResultList.request_page_index).toEqual(0);
+    expect(endpointResultList.request_page_size).toEqual(10);
+    expect(endpointResultList.query_strategy_version).toEqual(
+      MetadataQueryStrategyVersions.VERSION_1
+    );
+  });
+
+  it('test find the latest of all endpoints with paging properties', async () => {
+    const mockRequest = httpServerMock.createKibanaRequest({
+      body: {
+        paging_properties: [
+          {
+            page_size: 10,
+          },
+          {
+            page_index: 1,
+          },
+        ],
+      },
+    });
+
+    mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
+    mockAgentService.listAgents = jest.fn().mockReturnValue(noUnenrolledAgent);
+    mockScopedClient.callAsCurrentUser.mockImplementationOnce(() =>
+      Promise.resolve(createV1SearchResponse(new EndpointDocGenerator().generateHostMetadata()))
+    );
+    [routeConfig, routeHandler] = routerMock.post.mock.calls.find(([{ path }]) =>
+      path.startsWith(`${METADATA_REQUEST_V1_ROUTE}`)
+    )!;
+
+    await routeHandler(
+      createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+      mockRequest,
+      mockResponse
+    );
+
+    expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+    expect(mockScopedClient.callAsCurrentUser.mock.calls[0][1]?.body?.query).toEqual({
+      bool: {
+        must_not: {
+          terms: {
+            'elastic.agent.id': [
+              '00000000-0000-0000-0000-000000000000',
+              '11111111-1111-1111-1111-111111111111',
+            ],
+          },
+        },
+      },
+    });
+    expect(routeConfig.options).toEqual({ authRequired: true, tags: ['access:securitySolution'] });
+    expect(mockResponse.ok).toBeCalled();
+    const endpointResultList = mockResponse.ok.mock.calls[0][0]?.body as HostResultList;
+    expect(endpointResultList.hosts.length).toEqual(1);
+    expect(endpointResultList.total).toEqual(1);
+    expect(endpointResultList.request_page_index).toEqual(10);
+    expect(endpointResultList.request_page_size).toEqual(10);
+    expect(endpointResultList.query_strategy_version).toEqual(
+      MetadataQueryStrategyVersions.VERSION_1
+    );
+  });
+
+  it('test find the latest of all endpoints with paging and filters properties', async () => {
+    const mockRequest = httpServerMock.createKibanaRequest({
+      body: {
+        paging_properties: [
+          {
+            page_size: 10,
+          },
+          {
+            page_index: 1,
+          },
+        ],
+
+        filters: { kql: 'not host.ip:10.140.73.246' },
+      },
+    });
+
+    mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
+    mockAgentService.listAgents = jest.fn().mockReturnValue(noUnenrolledAgent);
+    mockScopedClient.callAsCurrentUser.mockImplementationOnce(() =>
+      Promise.resolve(createV1SearchResponse(new EndpointDocGenerator().generateHostMetadata()))
+    );
+    [routeConfig, routeHandler] = routerMock.post.mock.calls.find(([{ path }]) =>
+      path.startsWith(`${METADATA_REQUEST_V1_ROUTE}`)
+    )!;
+
+    await routeHandler(
+      createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+      mockRequest,
+      mockResponse
+    );
+
+    expect(mockScopedClient.callAsCurrentUser).toBeCalled();
+    expect(mockScopedClient.callAsCurrentUser.mock.calls[0][1]?.body?.query).toEqual({
+      bool: {
+        must: [
+          {
+            bool: {
+              must_not: {
+                terms: {
+                  'elastic.agent.id': [
+                    '00000000-0000-0000-0000-000000000000',
+                    '11111111-1111-1111-1111-111111111111',
+                  ],
+                },
+              },
+            },
+          },
+          {
+            bool: {
+              must_not: {
+                bool: {
+                  should: [
+                    {
+                      match: {
+                        'host.ip': '10.140.73.246',
+                      },
+                    },
+                  ],
+                  minimum_should_match: 1,
+                },
+              },
+            },
+          },
+        ],
+      },
+    });
+    expect(routeConfig.options).toEqual({ authRequired: true, tags: ['access:securitySolution'] });
+    expect(mockResponse.ok).toBeCalled();
+    const endpointResultList = mockResponse.ok.mock.calls[0][0]?.body as HostResultList;
+    expect(endpointResultList.hosts.length).toEqual(1);
+    expect(endpointResultList.total).toEqual(1);
+    expect(endpointResultList.request_page_index).toEqual(10);
+    expect(endpointResultList.request_page_size).toEqual(10);
+    expect(endpointResultList.query_strategy_version).toEqual(
+      MetadataQueryStrategyVersions.VERSION_1
+    );
+  });
+
+  describe('Endpoint Details route', () => {
+    it('should return 404 on no results', async () => {
+      const mockRequest = httpServerMock.createKibanaRequest({ params: { id: 'BADID' } });
+
+      mockScopedClient.callAsCurrentUser.mockImplementationOnce(() =>
+        Promise.resolve(createV1SearchResponse())
+      );
+
+      mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('error');
+      mockAgentService.getAgent = jest.fn().mockReturnValue(({
+        active: true,
+      } as unknown) as Agent);
+
+      [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
+        path.startsWith(`${METADATA_REQUEST_V1_ROUTE}`)
+      )!;
+      await routeHandler(
+        createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+        mockRequest,
+        mockResponse
+      );
+
+      expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+      expect(routeConfig.options).toEqual({
+        authRequired: true,
+        tags: ['access:securitySolution'],
+      });
+      expect(mockResponse.notFound).toBeCalled();
+      const message = mockResponse.notFound.mock.calls[0][0]?.body;
+      expect(message).toEqual('Endpoint Not Found');
+    });
+
+    it('should return a single endpoint with status online', async () => {
+      const response = createV1SearchResponse(new EndpointDocGenerator().generateHostMetadata());
+      const mockRequest = httpServerMock.createKibanaRequest({
+        params: { id: response.hits.hits[0]._id },
+      });
+
+      mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('online');
+      mockAgentService.getAgent = jest.fn().mockReturnValue(({
+        active: true,
+      } as unknown) as Agent);
+      mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
+
+      [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
+        path.startsWith(`${METADATA_REQUEST_V1_ROUTE}`)
+      )!;
+
+      await routeHandler(
+        createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+        mockRequest,
+        mockResponse
+      );
+
+      expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+      expect(routeConfig.options).toEqual({
+        authRequired: true,
+        tags: ['access:securitySolution'],
+      });
+      expect(mockResponse.ok).toBeCalled();
+      const result = mockResponse.ok.mock.calls[0][0]?.body as HostInfo;
+      expect(result).toHaveProperty('metadata.Endpoint');
+      expect(result.host_status).toEqual(HostStatus.ONLINE);
+    });
+
+    it('should return a single endpoint with status error when AgentService throw 404', async () => {
+      const response = createV1SearchResponse(new EndpointDocGenerator().generateHostMetadata());
+
+      const mockRequest = httpServerMock.createKibanaRequest({
+        params: { id: response.hits.hits[0]._id },
+      });
+
+      mockAgentService.getAgentStatusById = jest.fn().mockImplementation(() => {
+        SavedObjectsErrorHelpers.createGenericNotFoundError();
+      });
+
+      mockAgentService.getAgent = jest.fn().mockImplementation(() => {
+        SavedObjectsErrorHelpers.createGenericNotFoundError();
+      });
+
+      mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
+
+      [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
+        path.startsWith(`${METADATA_REQUEST_V1_ROUTE}`)
+      )!;
+
+      await routeHandler(
+        createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+        mockRequest,
+        mockResponse
+      );
+
+      expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+      expect(routeConfig.options).toEqual({
+        authRequired: true,
+        tags: ['access:securitySolution'],
+      });
+      expect(mockResponse.ok).toBeCalled();
+      const result = mockResponse.ok.mock.calls[0][0]?.body as HostInfo;
+      expect(result.host_status).toEqual(HostStatus.ERROR);
+    });
+
+    it('should return a single endpoint with status error when status is not offline, online or enrolling', async () => {
+      const response = createV1SearchResponse(new EndpointDocGenerator().generateHostMetadata());
+
+      const mockRequest = httpServerMock.createKibanaRequest({
+        params: { id: response.hits.hits[0]._id },
+      });
+
+      mockAgentService.getAgentStatusById = jest.fn().mockReturnValue('warning');
+      mockAgentService.getAgent = jest.fn().mockReturnValue(({
+        active: true,
+      } as unknown) as Agent);
+      mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
+
+      [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
+        path.startsWith(`${METADATA_REQUEST_V1_ROUTE}`)
+      )!;
+
+      await routeHandler(
+        createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+        mockRequest,
+        mockResponse
+      );
+
+      expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+      expect(routeConfig.options).toEqual({
+        authRequired: true,
+        tags: ['access:securitySolution'],
+      });
+      expect(mockResponse.ok).toBeCalled();
+      const result = mockResponse.ok.mock.calls[0][0]?.body as HostInfo;
+      expect(result.host_status).toEqual(HostStatus.ERROR);
+    });
+
+    it('should throw error when endpoint agent is not active', async () => {
+      const response = createV1SearchResponse(new EndpointDocGenerator().generateHostMetadata());
+
+      const mockRequest = httpServerMock.createKibanaRequest({
+        params: { id: response.hits.hits[0]._id },
+      });
+      mockScopedClient.callAsCurrentUser.mockImplementationOnce(() => Promise.resolve(response));
+      mockAgentService.getAgent = jest.fn().mockReturnValue(({
+        active: false,
+      } as unknown) as Agent);
+
+      [routeConfig, routeHandler] = routerMock.get.mock.calls.find(([{ path }]) =>
+        path.startsWith(`${METADATA_REQUEST_V1_ROUTE}`)
+      )!;
+
+      await routeHandler(
+        createRouteHandlerContext(mockScopedClient, mockSavedObjectClient),
+        mockRequest,
+        mockResponse
+      );
+
+      expect(mockScopedClient.callAsCurrentUser).toHaveBeenCalledTimes(1);
+      expect(mockResponse.customError).toBeCalled();
+    });
+  });
+});
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders.test.ts b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders.test.ts
index 84da4a0960820..cb79263ef6b3c 100644
--- a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders.test.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders.test.ts
@@ -8,6 +8,7 @@ import { kibanaRequestToMetadataListESQuery, getESQueryHostMetadataByID } from '
 import { EndpointAppContextService } from '../../endpoint_app_context_services';
 import { createMockConfig } from '../../../lib/detection_engine/routes/__mocks__';
 import { metadataCurrentIndexPattern } from '../../../../common/endpoint/constants';
+import { metadataQueryStrategyV2 } from './support/query_strategies';
 
 describe('query builder', () => {
   describe('MetadataListESQuery', () => {
@@ -22,7 +23,7 @@ describe('query builder', () => {
           service: new EndpointAppContextService(),
           config: () => Promise.resolve(createMockConfig()),
         },
-        metadataCurrentIndexPattern
+        metadataQueryStrategyV2()
       );
       expect(query).toEqual({
         body: {
@@ -59,7 +60,7 @@ describe('query builder', () => {
             service: new EndpointAppContextService(),
             config: () => Promise.resolve(createMockConfig()),
           },
-          metadataCurrentIndexPattern,
+          metadataQueryStrategyV2(),
           {
             unenrolledAgentIds: [unenrolledElasticAgentId],
           }
@@ -107,7 +108,7 @@ describe('query builder', () => {
           service: new EndpointAppContextService(),
           config: () => Promise.resolve(createMockConfig()),
         },
-        metadataCurrentIndexPattern
+        metadataQueryStrategyV2()
       );
 
       expect(query).toEqual({
@@ -166,7 +167,7 @@ describe('query builder', () => {
             service: new EndpointAppContextService(),
             config: () => Promise.resolve(createMockConfig()),
           },
-          metadataCurrentIndexPattern,
+          metadataQueryStrategyV2(),
           {
             unenrolledAgentIds: [unenrolledElasticAgentId],
           }
@@ -225,7 +226,7 @@ describe('query builder', () => {
   describe('MetadataGetQuery', () => {
     it('searches for the correct ID', () => {
       const mockID = 'AABBCCDD-0011-2233-AA44-DEADBEEF8899';
-      const query = getESQueryHostMetadataByID(mockID, metadataCurrentIndexPattern);
+      const query = getESQueryHostMetadataByID(mockID, metadataQueryStrategyV2());
 
       expect(query).toEqual({
         body: {
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders.ts b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders.ts
index 9002d328efbe3..0b166e097af94 100644
--- a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders.ts
@@ -5,7 +5,7 @@
  */
 import { KibanaRequest } from 'kibana/server';
 import { esKuery } from '../../../../../../../src/plugins/data/server';
-import { EndpointAppContext } from '../../types';
+import { EndpointAppContext, MetadataQueryStrategy } from '../../types';
 
 export interface QueryBuilderOptions {
   unenrolledAgentIds?: string[];
@@ -16,29 +16,26 @@ export async function kibanaRequestToMetadataListESQuery(
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   request: KibanaRequest<any, any, any>,
   endpointAppContext: EndpointAppContext,
-  index: string,
+  metadataQueryStrategy: MetadataQueryStrategy,
   queryBuilderOptions?: QueryBuilderOptions
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
 ): Promise<Record<string, any>> {
   const pagingProperties = await getPagingProperties(request, endpointAppContext);
+
   return {
     body: {
       query: buildQueryBody(
         request,
+        metadataQueryStrategy,
         queryBuilderOptions?.unenrolledAgentIds!,
         queryBuilderOptions?.statusAgentIDs!
       ),
-      sort: [
-        {
-          'HostDetails.event.created': {
-            order: 'desc',
-          },
-        },
-      ],
+      ...metadataQueryStrategy.extraBodyProperties,
+      sort: metadataQueryStrategy.sortProperty,
     },
     from: pagingProperties.pageIndex * pagingProperties.pageSize,
     size: pagingProperties.pageSize,
-    index,
+    index: metadataQueryStrategy.index,
   };
 }
 
@@ -66,6 +63,7 @@ async function getPagingProperties(
 function buildQueryBody(
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   request: KibanaRequest<any, any, any>,
+  metadataQueryStrategy: MetadataQueryStrategy,
   unerolledAgentIds: string[] | undefined,
   statusAgentIDs: string[] | undefined
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -75,7 +73,7 @@ function buildQueryBody(
       ? {
           must_not: {
             terms: {
-              'HostDetails.elastic.agent.id': unerolledAgentIds,
+              [metadataQueryStrategy.elasticAgentIdProperty]: unerolledAgentIds,
             },
           },
         }
@@ -84,7 +82,7 @@ function buildQueryBody(
     ? {
         must: {
           terms: {
-            'HostDetails.elastic.agent.id': statusAgentIDs,
+            [metadataQueryStrategy.elasticAgentIdProperty]: statusAgentIDs,
           },
         },
       }
@@ -117,23 +115,20 @@ function buildQueryBody(
       };
 }
 
-export function getESQueryHostMetadataByID(hostID: string, index: string) {
+export function getESQueryHostMetadataByID(
+  hostID: string,
+  metadataQueryStrategy: MetadataQueryStrategy
+) {
   return {
     body: {
       query: {
         match: {
-          'HostDetails.host.id': hostID,
+          [metadataQueryStrategy.hostIdProperty]: hostID,
         },
       },
-      sort: [
-        {
-          'HostDetails.event.created': {
-            order: 'desc',
-          },
-        },
-      ],
+      sort: metadataQueryStrategy.sortProperty,
       size: 1,
     },
-    index,
+    index: metadataQueryStrategy.index,
   };
 }
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders_v1.test.ts b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders_v1.test.ts
new file mode 100644
index 0000000000000..899fe4b880acd
--- /dev/null
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/query_builders_v1.test.ts
@@ -0,0 +1,300 @@
+/*
+ * 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 { httpServerMock, loggingSystemMock } from '../../../../../../../src/core/server/mocks';
+import { kibanaRequestToMetadataListESQuery, getESQueryHostMetadataByID } from './query_builders';
+import { EndpointAppContextService } from '../../endpoint_app_context_services';
+import { createMockConfig } from '../../../lib/detection_engine/routes/__mocks__';
+import { metadataIndexPattern } from '../../../../common/endpoint/constants';
+import { metadataQueryStrategyV1 } from './support/query_strategies';
+
+describe('query builder v1', () => {
+  describe('MetadataListESQuery', () => {
+    it('test default query params for all endpoints metadata when no params or body is provided', async () => {
+      const mockRequest = httpServerMock.createKibanaRequest({
+        body: {},
+      });
+      const query = await kibanaRequestToMetadataListESQuery(
+        mockRequest,
+        {
+          logFactory: loggingSystemMock.create(),
+          service: new EndpointAppContextService(),
+          config: () => Promise.resolve(createMockConfig()),
+        },
+        metadataQueryStrategyV1()
+      );
+      expect(query).toEqual({
+        body: {
+          query: {
+            match_all: {},
+          },
+          collapse: {
+            field: 'host.id',
+            inner_hits: {
+              name: 'most_recent',
+              size: 1,
+              sort: [{ 'event.created': 'desc' }],
+            },
+          },
+          aggs: {
+            total: {
+              cardinality: {
+                field: 'host.id',
+              },
+            },
+          },
+          sort: [
+            {
+              'event.created': {
+                order: 'desc',
+              },
+            },
+          ],
+        },
+        from: 0,
+        size: 10,
+        index: metadataIndexPattern,
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      } as Record<string, any>);
+    });
+
+    it(
+      'test default query params for all endpoints metadata when no params or body is provided ' +
+        'with unenrolled host ids excluded',
+      async () => {
+        const unenrolledElasticAgentId = '1fdca33f-799f-49f4-939c-ea4383c77672';
+        const mockRequest = httpServerMock.createKibanaRequest({
+          body: {},
+        });
+        const query = await kibanaRequestToMetadataListESQuery(
+          mockRequest,
+          {
+            logFactory: loggingSystemMock.create(),
+            service: new EndpointAppContextService(),
+            config: () => Promise.resolve(createMockConfig()),
+          },
+          metadataQueryStrategyV1(),
+          {
+            unenrolledAgentIds: [unenrolledElasticAgentId],
+          }
+        );
+        expect(query).toEqual({
+          body: {
+            query: {
+              bool: {
+                must_not: {
+                  terms: {
+                    'elastic.agent.id': [unenrolledElasticAgentId],
+                  },
+                },
+              },
+            },
+            collapse: {
+              field: 'host.id',
+              inner_hits: {
+                name: 'most_recent',
+                size: 1,
+                sort: [{ 'event.created': 'desc' }],
+              },
+            },
+            aggs: {
+              total: {
+                cardinality: {
+                  field: 'host.id',
+                },
+              },
+            },
+            sort: [
+              {
+                'event.created': {
+                  order: 'desc',
+                },
+              },
+            ],
+          },
+          from: 0,
+          size: 10,
+          index: metadataIndexPattern,
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        } as Record<string, any>);
+      }
+    );
+  });
+
+  describe('test query builder with kql filter', () => {
+    it('test default query params for all endpoints metadata when body filter is provided', async () => {
+      const mockRequest = httpServerMock.createKibanaRequest({
+        body: {
+          filters: { kql: 'not host.ip:10.140.73.246' },
+        },
+      });
+      const query = await kibanaRequestToMetadataListESQuery(
+        mockRequest,
+        {
+          logFactory: loggingSystemMock.create(),
+          service: new EndpointAppContextService(),
+          config: () => Promise.resolve(createMockConfig()),
+        },
+        metadataQueryStrategyV1()
+      );
+
+      expect(query).toEqual({
+        body: {
+          query: {
+            bool: {
+              must: [
+                {
+                  bool: {
+                    must_not: {
+                      bool: {
+                        should: [
+                          {
+                            match: {
+                              'host.ip': '10.140.73.246',
+                            },
+                          },
+                        ],
+                        minimum_should_match: 1,
+                      },
+                    },
+                  },
+                },
+              ],
+            },
+          },
+          collapse: {
+            field: 'host.id',
+            inner_hits: {
+              name: 'most_recent',
+              size: 1,
+              sort: [{ 'event.created': 'desc' }],
+            },
+          },
+          aggs: {
+            total: {
+              cardinality: {
+                field: 'host.id',
+              },
+            },
+          },
+          sort: [
+            {
+              'event.created': {
+                order: 'desc',
+              },
+            },
+          ],
+        },
+        from: 0,
+        size: 10,
+        index: metadataIndexPattern,
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      } as Record<string, any>);
+    });
+
+    it(
+      'test default query params for all endpoints endpoint metadata excluding unerolled endpoint ' +
+        'and when body filter is provided',
+      async () => {
+        const unenrolledElasticAgentId = '1fdca33f-799f-49f4-939c-ea4383c77672';
+        const mockRequest = httpServerMock.createKibanaRequest({
+          body: {
+            filters: { kql: 'not host.ip:10.140.73.246' },
+          },
+        });
+        const query = await kibanaRequestToMetadataListESQuery(
+          mockRequest,
+          {
+            logFactory: loggingSystemMock.create(),
+            service: new EndpointAppContextService(),
+            config: () => Promise.resolve(createMockConfig()),
+          },
+          metadataQueryStrategyV1(),
+          {
+            unenrolledAgentIds: [unenrolledElasticAgentId],
+          }
+        );
+
+        expect(query).toEqual({
+          body: {
+            query: {
+              bool: {
+                must: [
+                  {
+                    bool: {
+                      must_not: {
+                        terms: {
+                          'elastic.agent.id': [unenrolledElasticAgentId],
+                        },
+                      },
+                    },
+                  },
+                  {
+                    bool: {
+                      must_not: {
+                        bool: {
+                          should: [
+                            {
+                              match: {
+                                'host.ip': '10.140.73.246',
+                              },
+                            },
+                          ],
+                          minimum_should_match: 1,
+                        },
+                      },
+                    },
+                  },
+                ],
+              },
+            },
+            collapse: {
+              field: 'host.id',
+              inner_hits: {
+                name: 'most_recent',
+                size: 1,
+                sort: [{ 'event.created': 'desc' }],
+              },
+            },
+            aggs: {
+              total: {
+                cardinality: {
+                  field: 'host.id',
+                },
+              },
+            },
+            sort: [
+              {
+                'event.created': {
+                  order: 'desc',
+                },
+              },
+            ],
+          },
+          from: 0,
+          size: 10,
+          index: metadataIndexPattern,
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        } as Record<string, any>);
+      }
+    );
+  });
+
+  describe('MetadataGetQuery', () => {
+    it('searches for the correct ID', () => {
+      const mockID = 'AABBCCDD-0011-2233-AA44-DEADBEEF8899';
+      const query = getESQueryHostMetadataByID(mockID, metadataQueryStrategyV1());
+
+      expect(query).toEqual({
+        body: {
+          query: { match: { 'host.id': mockID } },
+          sort: [{ 'event.created': { order: 'desc' } }],
+          size: 1,
+        },
+        index: metadataIndexPattern,
+      });
+    });
+  });
+});
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/route_schema_test.ts b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/route_schema_test.ts
new file mode 100644
index 0000000000000..851c51618c79b
--- /dev/null
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/route_schema_test.ts
@@ -0,0 +1,53 @@
+/*
+ * 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 { endpointFilters } from './index';
+
+describe('Filters Schema Test', () => {
+  it('accepts a single host status', () => {
+    expect(
+      endpointFilters.validate({
+        host_status: ['error'],
+      })
+    ).toBeTruthy();
+  });
+
+  it('accepts multiple host status filters', () => {
+    expect(
+      endpointFilters.validate({
+        host_status: ['offline', 'unenrolling'],
+      })
+    ).toBeTruthy();
+  });
+
+  it('rejects invalid statuses', () => {
+    expect(() =>
+      endpointFilters.validate({
+        host_status: ['foobar'],
+      })
+    ).toThrowError();
+  });
+
+  it('accepts a KQL string', () => {
+    expect(
+      endpointFilters.validate({
+        kql: 'whatever.field',
+      })
+    ).toBeTruthy();
+  });
+
+  it('accepts KQL + status', () => {
+    expect(
+      endpointFilters.validate({
+        kql: 'thing.var',
+        host_status: ['online'],
+      })
+    ).toBeTruthy();
+  });
+
+  it('accepts no filters', () => {
+    expect(endpointFilters.validate({})).toBeTruthy();
+  });
+});
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/support/query_strategies.ts b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/support/query_strategies.ts
new file mode 100644
index 0000000000000..df4c377262466
--- /dev/null
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/support/query_strategies.ts
@@ -0,0 +1,115 @@
+/*
+ * 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 { SearchResponse } from 'elasticsearch';
+import {
+  metadataCurrentIndexPattern,
+  metadataIndexPattern,
+} from '../../../../../common/endpoint/constants';
+import {
+  HostMetadata,
+  HostMetadataDetails,
+  MetadataQueryStrategyVersions,
+} from '../../../../../common/endpoint/types';
+import { HostListQueryResult, HostQueryResult, MetadataQueryStrategy } from '../../../types';
+
+interface HitSource {
+  _source: HostMetadata;
+}
+
+export function metadataQueryStrategyV1(): MetadataQueryStrategy {
+  return {
+    index: metadataIndexPattern,
+    elasticAgentIdProperty: 'elastic.agent.id',
+    hostIdProperty: 'host.id',
+    sortProperty: [
+      {
+        'event.created': {
+          order: 'desc',
+        },
+      },
+    ],
+    extraBodyProperties: {
+      collapse: {
+        field: 'host.id',
+        inner_hits: {
+          name: 'most_recent',
+          size: 1,
+          sort: [{ 'event.created': 'desc' }],
+        },
+      },
+      aggs: {
+        total: {
+          cardinality: {
+            field: 'host.id',
+          },
+        },
+      },
+    },
+    queryResponseToHostListResult: (
+      searchResponse: SearchResponse<HostMetadata | HostMetadataDetails>
+    ): HostListQueryResult => {
+      const response = searchResponse as SearchResponse<HostMetadata>;
+      return {
+        resultLength: response?.aggregations?.total?.value || 0,
+        resultList: response.hits.hits
+          .map((hit) => hit.inner_hits.most_recent.hits.hits)
+          .flatMap((data) => data as HitSource)
+          .map((entry) => entry._source),
+        queryStrategyVersion: MetadataQueryStrategyVersions.VERSION_1,
+      };
+    },
+    queryResponseToHostResult: (
+      searchResponse: SearchResponse<HostMetadata | HostMetadataDetails>
+    ): HostQueryResult => {
+      const response = searchResponse as SearchResponse<HostMetadata>;
+      return {
+        resultLength: response.hits.hits.length,
+        result: response.hits.hits.length > 0 ? response.hits.hits[0]._source : undefined,
+        queryStrategyVersion: MetadataQueryStrategyVersions.VERSION_1,
+      };
+    },
+  };
+}
+
+export function metadataQueryStrategyV2(): MetadataQueryStrategy {
+  return {
+    index: metadataCurrentIndexPattern,
+    elasticAgentIdProperty: 'HostDetails.elastic.agent.id',
+    hostIdProperty: 'HostDetails.host.id',
+    sortProperty: [
+      {
+        'HostDetails.event.created': {
+          order: 'desc',
+        },
+      },
+    ],
+    queryResponseToHostListResult: (
+      searchResponse: SearchResponse<HostMetadata | HostMetadataDetails>
+    ): HostListQueryResult => {
+      const response = searchResponse as SearchResponse<HostMetadataDetails>;
+      return {
+        resultLength:
+          ((response.hits?.total as unknown) as { value: number; relation: string }).value || 0,
+        resultList:
+          response.hits.hits.length > 0
+            ? response.hits.hits.map((entry) => entry._source.HostDetails)
+            : [],
+        queryStrategyVersion: MetadataQueryStrategyVersions.VERSION_2,
+      };
+    },
+    queryResponseToHostResult: (
+      searchResponse: SearchResponse<HostMetadata | HostMetadataDetails>
+    ): HostQueryResult => {
+      const response = searchResponse as SearchResponse<HostMetadataDetails>;
+      return {
+        resultLength: response.hits.hits.length,
+        result:
+          response.hits.hits.length > 0 ? response.hits.hits[0]._source.HostDetails : undefined,
+        queryStrategyVersion: MetadataQueryStrategyVersions.VERSION_2,
+      };
+    },
+  };
+}
diff --git a/x-pack/plugins/security_solution/server/endpoint/routes/metadata/support/test_support.ts b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/support/test_support.ts
new file mode 100644
index 0000000000000..ac6ee380c8b06
--- /dev/null
+++ b/x-pack/plugins/security_solution/server/endpoint/routes/metadata/support/test_support.ts
@@ -0,0 +1,103 @@
+/*
+ * 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 { SearchResponse } from 'elasticsearch';
+import { HostMetadata, HostMetadataDetails } from '../../../../../common/endpoint/types';
+
+export function createV1SearchResponse(hostMetadata?: HostMetadata): SearchResponse<HostMetadata> {
+  return ({
+    took: 15,
+    timed_out: false,
+    _shards: {
+      total: 1,
+      successful: 1,
+      skipped: 0,
+      failed: 0,
+    },
+    hits: {
+      total: {
+        value: 5,
+        relation: 'eq',
+      },
+      max_score: null,
+      hits: hostMetadata
+        ? [
+            {
+              _index: 'metrics-endpoint.metadata-default',
+              _id: '8FhM0HEBYyRTvb6lOQnw',
+              _score: null,
+              _source: hostMetadata,
+              sort: [1588337587997],
+              inner_hits: {
+                most_recent: {
+                  hits: {
+                    total: {
+                      value: 2,
+                      relation: 'eq',
+                    },
+                    max_score: null,
+                    hits: [
+                      {
+                        _index: 'metrics-endpoint.metadata-default',
+                        _id: 'W6Vo1G8BYQH1gtPUgYkC',
+                        _score: null,
+                        _source: hostMetadata,
+                        sort: [1579816615336],
+                      },
+                    ],
+                  },
+                },
+              },
+            },
+          ]
+        : [],
+    },
+    aggregations: {
+      total: {
+        value: 1,
+      },
+    },
+  } as unknown) as SearchResponse<HostMetadata>;
+}
+
+export function createV2SearchResponse(
+  hostMetadata?: HostMetadata
+): SearchResponse<HostMetadataDetails> {
+  return ({
+    took: 15,
+    timed_out: false,
+    _shards: {
+      total: 1,
+      successful: 1,
+      skipped: 0,
+      failed: 0,
+    },
+    hits: {
+      total: {
+        value: 1,
+        relation: 'eq',
+      },
+      max_score: null,
+      hits: hostMetadata
+        ? [
+            {
+              _index: 'metrics-endpoint.metadata-default',
+              _id: '8FhM0HEBYyRTvb6lOQnw',
+              _score: null,
+              _source: {
+                agent: {
+                  id: '1e3472bb-5c20-4946-b469-b5af1a809e4f',
+                },
+                HostDetails: {
+                  ...hostMetadata,
+                },
+              },
+              sort: [1588337587997],
+            },
+          ]
+        : [],
+    },
+  } as unknown) as SearchResponse<HostMetadataDetails>;
+}
diff --git a/x-pack/plugins/security_solution/server/endpoint/types.ts b/x-pack/plugins/security_solution/server/endpoint/types.ts
index 3c6630db8ebd8..2328c86f78a35 100644
--- a/x-pack/plugins/security_solution/server/endpoint/types.ts
+++ b/x-pack/plugins/security_solution/server/endpoint/types.ts
@@ -4,8 +4,15 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 import { LoggerFactory } from 'kibana/server';
+import { SearchResponse } from 'elasticsearch';
 import { ConfigType } from '../config';
 import { EndpointAppContextService } from './endpoint_app_context_services';
+import { JsonObject } from '../../../infra/common/typed_json';
+import {
+  HostMetadata,
+  HostMetadataDetails,
+  MetadataQueryStrategyVersions,
+} from '../../common/endpoint/types';
 
 /**
  * The context for Endpoint apps.
@@ -19,3 +26,29 @@ export interface EndpointAppContext {
    */
   service: EndpointAppContextService;
 }
+
+export interface HostListQueryResult {
+  resultLength: number;
+  resultList: HostMetadata[];
+  queryStrategyVersion: MetadataQueryStrategyVersions;
+}
+
+export interface HostQueryResult {
+  resultLength: number;
+  result: HostMetadata | undefined;
+  queryStrategyVersion: MetadataQueryStrategyVersions;
+}
+
+export interface MetadataQueryStrategy {
+  index: string;
+  elasticAgentIdProperty: string;
+  hostIdProperty: string;
+  sortProperty: JsonObject[];
+  extraBodyProperties?: JsonObject;
+  queryResponseToHostListResult: (
+    searchResponse: SearchResponse<HostMetadata | HostMetadataDetails>
+  ) => HostListQueryResult;
+  queryResponseToHostResult: (
+    searchResponse: SearchResponse<HostMetadata | HostMetadataDetails>
+  ) => HostQueryResult;
+}
diff --git a/x-pack/plugins/security_solution/server/lib/hosts/elasticsearch_adapter.test.ts b/x-pack/plugins/security_solution/server/lib/hosts/elasticsearch_adapter.test.ts
index 766fbd5dca031..6abff93d6cd5c 100644
--- a/x-pack/plugins/security_solution/server/lib/hosts/elasticsearch_adapter.test.ts
+++ b/x-pack/plugins/security_solution/server/lib/hosts/elasticsearch_adapter.test.ts
@@ -30,7 +30,12 @@ import { HostAggEsItem } from './types';
 import { EndpointAppContext } from '../../endpoint/types';
 import { mockLogger } from '../detection_engine/signals/__mocks__/es_results';
 import { EndpointAppContextService } from '../../endpoint/endpoint_app_context_services';
-import { createMockEndpointAppContextServiceStartContract } from '../../endpoint/mocks';
+import {
+  createMockEndpointAppContextServiceStartContract,
+  createMockPackageService,
+} from '../../endpoint/mocks';
+import { PackageService } from '../../../../ingest_manager/server/services';
+import { ElasticsearchAssetType } from '../../../../ingest_manager/common/types/models';
 
 jest.mock('./query.hosts.dsl', () => {
   return {
@@ -49,7 +54,7 @@ jest.mock('./query.last_first_seen_host.dsl', () => {
     buildLastFirstSeenHostQuery: jest.fn(() => mockGetHostLastFirstSeenDsl),
   };
 });
-jest.mock('../../endpoint/routes/metadata', () => {
+jest.mock('../../endpoint/routes/metadata/handlers', () => {
   return {
     getHostData: jest.fn(() => mockEndpointMetadata),
   };
@@ -167,8 +172,16 @@ describe('hosts elasticsearch_adapter', () => {
 
   const endpointAppContextService = new EndpointAppContextService();
   const startContract = createMockEndpointAppContextServiceStartContract();
-  endpointAppContextService.start(startContract);
-
+  const mockPackageService: jest.Mocked<PackageService> = createMockPackageService();
+  mockPackageService.getInstalledEsAssetReferences.mockReturnValue(
+    Promise.resolve([
+      {
+        id: 'metrics-endpoint.metadata-current-default-0.16.0-dev.0',
+        type: ElasticsearchAssetType.transform,
+      },
+    ])
+  );
+  endpointAppContextService.start({ ...startContract, packageService: mockPackageService });
   const endpointContext: EndpointAppContext = {
     logFactory: mockLogger,
     service: endpointAppContextService,
diff --git a/x-pack/plugins/security_solution/server/lib/hosts/elasticsearch_adapter.ts b/x-pack/plugins/security_solution/server/lib/hosts/elasticsearch_adapter.ts
index 142d2a68faed0..ff2796e6852d0 100644
--- a/x-pack/plugins/security_solution/server/lib/hosts/elasticsearch_adapter.ts
+++ b/x-pack/plugins/security_solution/server/lib/hosts/elasticsearch_adapter.ts
@@ -8,11 +8,11 @@ import { set } from '@elastic/safer-lodash-set/fp';
 import { get, getOr, has, head } from 'lodash/fp';
 
 import {
+  EndpointFields,
   FirstLastSeenHost,
   HostItem,
   HostsData,
   HostsEdges,
-  EndpointFields,
 } from '../../graphql/types';
 import { inspectStringifyObject } from '../../utils/build_query';
 import { hostFieldsMap } from '../ecs_fields';
@@ -25,16 +25,16 @@ import {
   HostAggEsData,
   HostAggEsItem,
   HostBuckets,
-  HostOverviewRequestOptions,
   HostEsData,
   HostLastFirstSeenRequestOptions,
+  HostOverviewRequestOptions,
   HostsAdapter,
   HostsRequestOptions,
   HostValue,
 } from './types';
 import { DEFAULT_MAX_TABLE_QUERY_SIZE } from '../../../common/constants';
 import { EndpointAppContext } from '../../endpoint/types';
-import { getHostData } from '../../endpoint/routes/metadata';
+import { getHostData } from '../../endpoint/routes/metadata/handlers';
 
 export class ElasticsearchHostsAdapter implements HostsAdapter {
   constructor(
@@ -116,12 +116,12 @@ export class ElasticsearchHostsAdapter implements HostsAdapter {
         throw new Error('agentService not available');
       }
       const metadataRequestContext = {
-        agentService,
+        endpointAppContextService: this.endpointContext.service,
         logger,
         requestHandlerContext: request.context,
       };
       const endpointData =
-        hostId != null && metadataRequestContext.agentService != null
+        hostId != null && metadataRequestContext.endpointAppContextService.getAgentService() != null
           ? await getHostData(metadataRequestContext, hostId)
           : null;
       return endpointData != null && endpointData.metadata
diff --git a/x-pack/plugins/security_solution/server/plugin.ts b/x-pack/plugins/security_solution/server/plugin.ts
index d203c6dcc48c4..f0e7372a208fb 100644
--- a/x-pack/plugins/security_solution/server/plugin.ts
+++ b/x-pack/plugins/security_solution/server/plugin.ts
@@ -315,6 +315,7 @@ export class Plugin implements IPlugin<PluginSetup, PluginStart, SetupPlugins, S
 
     this.endpointAppContextService.start({
       agentService: plugins.ingestManager?.agentService,
+      packageService: plugins.ingestManager?.packageService,
       logger: this.logger,
       manifestManager,
       registerIngestCallback,
diff --git a/x-pack/test/security_solution_endpoint_api_int/apis/index.ts b/x-pack/test/security_solution_endpoint_api_int/apis/index.ts
index 8b4a73b7eb848..3d344c1b3b51b 100644
--- a/x-pack/test/security_solution_endpoint_api_int/apis/index.ts
+++ b/x-pack/test/security_solution_endpoint_api_int/apis/index.ts
@@ -28,6 +28,7 @@ export default function endpointAPIIntegrationTests(providerContext: FtrProvider
     });
     loadTestFile(require.resolve('./resolver/index'));
     loadTestFile(require.resolve('./metadata'));
+    loadTestFile(require.resolve('./metadata_v1'));
     loadTestFile(require.resolve('./policy'));
     loadTestFile(require.resolve('./artifacts'));
     loadTestFile(require.resolve('./package'));
diff --git a/x-pack/test/security_solution_endpoint_api_int/apis/metadata.ts b/x-pack/test/security_solution_endpoint_api_int/apis/metadata.ts
index 2286320ed7a88..b157c3159ccc0 100644
--- a/x-pack/test/security_solution_endpoint_api_int/apis/metadata.ts
+++ b/x-pack/test/security_solution_endpoint_api_int/apis/metadata.ts
@@ -11,6 +11,8 @@ import {
   deleteAllDocsFromMetadataIndex,
   deleteMetadataStream,
 } from './data_stream_helper';
+import { METADATA_REQUEST_ROUTE } from '../../../plugins/security_solution/server/endpoint/routes/metadata';
+import { MetadataQueryStrategyVersions } from '../../../plugins/security_solution/common/endpoint/types';
 
 /**
  * The number of host documents in the es archive.
@@ -22,14 +24,14 @@ export default function ({ getService }: FtrProviderContext) {
   const supertest = getService('supertest');
 
   describe('test metadata api', () => {
-    describe('POST /api/endpoint/metadata when index is empty', () => {
+    describe(`POST ${METADATA_REQUEST_ROUTE} when index is empty`, () => {
       it('metadata api should return empty result when index is empty', async () => {
         await deleteMetadataStream(getService);
         await deleteAllDocsFromMetadataIndex(getService);
         await deleteMetadataCurrentStream(getService);
         await deleteAllDocsFromMetadataCurrentIndex(getService);
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send()
           .expect(200);
@@ -40,7 +42,7 @@ export default function ({ getService }: FtrProviderContext) {
       });
     });
 
-    describe('POST /api/endpoint/metadata when index is not empty', () => {
+    describe(`POST ${METADATA_REQUEST_ROUTE} when index is not empty`, () => {
       before(async () => {
         await esArchiver.load('endpoint/metadata/api_feature', { useCreate: true });
         // wait for transform
@@ -56,7 +58,7 @@ export default function ({ getService }: FtrProviderContext) {
       });
       it('metadata api should return one entry for each host with default paging', async () => {
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send()
           .expect(200);
@@ -68,7 +70,7 @@ export default function ({ getService }: FtrProviderContext) {
 
       it('metadata api should return page based on paging properties passed.', async () => {
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send({
             paging_properties: [
@@ -85,6 +87,7 @@ export default function ({ getService }: FtrProviderContext) {
         expect(body.hosts.length).to.eql(1);
         expect(body.request_page_size).to.eql(1);
         expect(body.request_page_index).to.eql(1);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_2);
       });
 
       /* test that when paging properties produces no result, the total should reflect the actual number of metadata
@@ -92,7 +95,7 @@ export default function ({ getService }: FtrProviderContext) {
        */
       it('metadata api should return accurate total metadata if page index produces no result', async () => {
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send({
             paging_properties: [
@@ -109,11 +112,12 @@ export default function ({ getService }: FtrProviderContext) {
         expect(body.hosts.length).to.eql(0);
         expect(body.request_page_size).to.eql(10);
         expect(body.request_page_index).to.eql(30);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_2);
       });
 
       it('metadata api should return 400 when pagingProperties is below boundaries.', async () => {
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send({
             paging_properties: [
@@ -131,7 +135,7 @@ export default function ({ getService }: FtrProviderContext) {
 
       it('metadata api should return page based on filters passed.', async () => {
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send({
             filters: {
@@ -143,12 +147,13 @@ export default function ({ getService }: FtrProviderContext) {
         expect(body.hosts.length).to.eql(2);
         expect(body.request_page_size).to.eql(10);
         expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_2);
       });
 
       it('metadata api should return page based on filters and paging passed.', async () => {
         const notIncludedIp = '10.46.229.234';
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send({
             paging_properties: [
@@ -180,12 +185,13 @@ export default function ({ getService }: FtrProviderContext) {
         expect(body.hosts.length).to.eql(2);
         expect(body.request_page_size).to.eql(10);
         expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_2);
       });
 
       it('metadata api should return page based on host.os.Ext.variant filter.', async () => {
         const variantValue = 'Windows Pro';
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send({
             filters: {
@@ -201,12 +207,13 @@ export default function ({ getService }: FtrProviderContext) {
         expect(body.hosts.length).to.eql(2);
         expect(body.request_page_size).to.eql(10);
         expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_2);
       });
 
       it('metadata api should return the latest event for all the events for an endpoint', async () => {
         const targetEndpointIp = '10.46.229.234';
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send({
             filters: {
@@ -223,11 +230,12 @@ export default function ({ getService }: FtrProviderContext) {
         expect(body.hosts.length).to.eql(1);
         expect(body.request_page_size).to.eql(10);
         expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_2);
       });
 
       it('metadata api should return the latest event for all the events where policy status is not success', async () => {
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send({
             filters: {
@@ -248,7 +256,7 @@ export default function ({ getService }: FtrProviderContext) {
         const targetEndpointId = 'fc0ff548-feba-41b6-8367-65e8790d0eaf';
         const targetElasticAgentId = '023fa40c-411d-4188-a941-4147bfadd095';
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send({
             filters: {
@@ -266,11 +274,12 @@ export default function ({ getService }: FtrProviderContext) {
         expect(body.hosts.length).to.eql(1);
         expect(body.request_page_size).to.eql(10);
         expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_2);
       });
 
       it('metadata api should return all hosts when filter is empty string', async () => {
         const { body } = await supertest
-          .post('/api/endpoint/metadata')
+          .post(`${METADATA_REQUEST_ROUTE}`)
           .set('kbn-xsrf', 'xxx')
           .send({
             filters: {
@@ -282,6 +291,7 @@ export default function ({ getService }: FtrProviderContext) {
         expect(body.hosts.length).to.eql(numberOfHostsInFixture);
         expect(body.request_page_size).to.eql(10);
         expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_2);
       });
     });
   });
diff --git a/x-pack/test/security_solution_endpoint_api_int/apis/metadata_v1.ts b/x-pack/test/security_solution_endpoint_api_int/apis/metadata_v1.ts
new file mode 100644
index 0000000000000..548e5f6c768da
--- /dev/null
+++ b/x-pack/test/security_solution_endpoint_api_int/apis/metadata_v1.ts
@@ -0,0 +1,284 @@
+/*
+ * 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 expect from '@kbn/expect/expect.js';
+import { FtrProviderContext } from '../ftr_provider_context';
+import { deleteMetadataStream } from './data_stream_helper';
+import { METADATA_REQUEST_V1_ROUTE } from '../../../plugins/security_solution/server/endpoint/routes/metadata';
+import { MetadataQueryStrategyVersions } from '../../../plugins/security_solution/common/endpoint/types';
+
+/**
+ * The number of host documents in the es archive.
+ */
+const numberOfHostsInFixture = 3;
+
+export default function ({ getService }: FtrProviderContext) {
+  const esArchiver = getService('esArchiver');
+  const supertest = getService('supertest');
+  describe('test metadata api v1', () => {
+    describe(`POST ${METADATA_REQUEST_V1_ROUTE} when index is empty`, () => {
+      it('metadata api should return empty result when index is empty', async () => {
+        // the endpoint uses data streams and es archiver does not support deleting them at the moment so we need
+        // to do it manually
+        await deleteMetadataStream(getService);
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send()
+          .expect(200);
+        expect(body.total).to.eql(0);
+        expect(body.hosts.length).to.eql(0);
+        expect(body.request_page_size).to.eql(10);
+        expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_1);
+      });
+    });
+
+    describe(`POST ${METADATA_REQUEST_V1_ROUTE} when index is not empty`, () => {
+      before(
+        async () => await esArchiver.load('endpoint/metadata/api_feature', { useCreate: true })
+      );
+      // the endpoint uses data streams and es archiver does not support deleting them at the moment so we need
+      // to do it manually
+      after(async () => await deleteMetadataStream(getService));
+      it('metadata api should return one entry for each host with default paging', async () => {
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send()
+          .expect(200);
+        expect(body.total).to.eql(numberOfHostsInFixture);
+        expect(body.hosts.length).to.eql(numberOfHostsInFixture);
+        expect(body.request_page_size).to.eql(10);
+        expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_1);
+      });
+
+      it('metadata api should return page based on paging properties passed.', async () => {
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send({
+            paging_properties: [
+              {
+                page_size: 1,
+              },
+              {
+                page_index: 1,
+              },
+            ],
+          })
+          .expect(200);
+        expect(body.total).to.eql(numberOfHostsInFixture);
+        expect(body.hosts.length).to.eql(1);
+        expect(body.request_page_size).to.eql(1);
+        expect(body.request_page_index).to.eql(1);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_1);
+      });
+
+      /* test that when paging properties produces no result, the total should reflect the actual number of metadata
+      in the index.
+       */
+      it('metadata api should return accurate total metadata if page index produces no result', async () => {
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send({
+            paging_properties: [
+              {
+                page_size: 10,
+              },
+              {
+                page_index: 3,
+              },
+            ],
+          })
+          .expect(200);
+        expect(body.total).to.eql(numberOfHostsInFixture);
+        expect(body.hosts.length).to.eql(0);
+        expect(body.request_page_size).to.eql(10);
+        expect(body.request_page_index).to.eql(30);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_1);
+      });
+
+      it('metadata api should return 400 when pagingProperties is below boundaries.', async () => {
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send({
+            paging_properties: [
+              {
+                page_size: 0,
+              },
+              {
+                page_index: 1,
+              },
+            ],
+          })
+          .expect(400);
+        expect(body.message).to.contain('Value must be equal to or greater than [1]');
+      });
+
+      it('metadata api should return page based on filters passed.', async () => {
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send({
+            filters: {
+              kql: 'not host.ip:10.46.229.234',
+            },
+          })
+          .expect(200);
+        expect(body.total).to.eql(2);
+        expect(body.hosts.length).to.eql(2);
+        expect(body.request_page_size).to.eql(10);
+        expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_1);
+      });
+
+      it('metadata api should return page based on filters and paging passed.', async () => {
+        const notIncludedIp = '10.46.229.234';
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send({
+            paging_properties: [
+              {
+                page_size: 10,
+              },
+              {
+                page_index: 0,
+              },
+            ],
+            filters: {
+              kql: `not host.ip:${notIncludedIp}`,
+            },
+          })
+          .expect(200);
+        expect(body.total).to.eql(2);
+        const resultIps: string[] = [].concat(
+          ...body.hosts.map((hostInfo: Record<string, any>) => hostInfo.metadata.host.ip)
+        );
+        expect(resultIps).to.eql([
+          '10.192.213.130',
+          '10.70.28.129',
+          '10.101.149.26',
+          '2606:a000:ffc0:39:11ef:37b9:3371:578c',
+        ]);
+        expect(resultIps).not.include.eql(notIncludedIp);
+        expect(body.hosts.length).to.eql(2);
+        expect(body.request_page_size).to.eql(10);
+        expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_1);
+      });
+
+      it('metadata api should return page based on host.os.Ext.variant filter.', async () => {
+        const variantValue = 'Windows Pro';
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send({
+            filters: {
+              kql: `host.os.Ext.variant:${variantValue}`,
+            },
+          })
+          .expect(200);
+        expect(body.total).to.eql(2);
+        const resultOsVariantValue: Set<string> = new Set(
+          body.hosts.map((hostInfo: Record<string, any>) => hostInfo.metadata.host.os.Ext.variant)
+        );
+        expect(Array.from(resultOsVariantValue)).to.eql([variantValue]);
+        expect(body.hosts.length).to.eql(2);
+        expect(body.request_page_size).to.eql(10);
+        expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_1);
+      });
+
+      it('metadata api should return the latest event for all the events for an endpoint', async () => {
+        const targetEndpointIp = '10.46.229.234';
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send({
+            filters: {
+              kql: `host.ip:${targetEndpointIp}`,
+            },
+          })
+          .expect(200);
+        expect(body.total).to.eql(1);
+        const resultIp: string = body.hosts[0].metadata.host.ip.filter(
+          (ip: string) => ip === targetEndpointIp
+        );
+        expect(resultIp).to.eql([targetEndpointIp]);
+        expect(body.hosts[0].metadata.event.created).to.eql(1579881969541);
+        expect(body.hosts.length).to.eql(1);
+        expect(body.request_page_size).to.eql(10);
+        expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_1);
+      });
+
+      it('metadata api should return the latest event for all the events where policy status is not success', async () => {
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send({
+            filters: {
+              kql: `not Endpoint.policy.applied.status:success`,
+            },
+          })
+          .expect(200);
+        const statuses: Set<string> = new Set(
+          body.hosts.map(
+            (hostInfo: Record<string, any>) => hostInfo.metadata.Endpoint.policy.applied.status
+          )
+        );
+        expect(statuses.size).to.eql(1);
+        expect(Array.from(statuses)).to.eql(['failure']);
+      });
+
+      it('metadata api should return the endpoint based on the elastic agent id, and status should be error', async () => {
+        const targetEndpointId = 'fc0ff548-feba-41b6-8367-65e8790d0eaf';
+        const targetElasticAgentId = '023fa40c-411d-4188-a941-4147bfadd095';
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send({
+            filters: {
+              kql: `elastic.agent.id:${targetElasticAgentId}`,
+            },
+          })
+          .expect(200);
+        expect(body.total).to.eql(1);
+        const resultHostId: string = body.hosts[0].metadata.host.id;
+        const resultElasticAgentId: string = body.hosts[0].metadata.elastic.agent.id;
+        expect(resultHostId).to.eql(targetEndpointId);
+        expect(resultElasticAgentId).to.eql(targetElasticAgentId);
+        expect(body.hosts[0].metadata.event.created).to.eql(1579881969541);
+        expect(body.hosts[0].host_status).to.eql('error');
+        expect(body.hosts.length).to.eql(1);
+        expect(body.request_page_size).to.eql(10);
+        expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_1);
+      });
+
+      it('metadata api should return all hosts when filter is empty string', async () => {
+        const { body } = await supertest
+          .post(`${METADATA_REQUEST_V1_ROUTE}`)
+          .set('kbn-xsrf', 'xxx')
+          .send({
+            filters: {
+              kql: '',
+            },
+          })
+          .expect(200);
+        expect(body.total).to.eql(numberOfHostsInFixture);
+        expect(body.hosts.length).to.eql(numberOfHostsInFixture);
+        expect(body.request_page_size).to.eql(10);
+        expect(body.request_page_index).to.eql(0);
+        expect(body.query_strategy_version).to.eql(MetadataQueryStrategyVersions.VERSION_1);
+      });
+    });
+  });
+}

From dd8db102534e2970e0460429caa685984d867b64 Mon Sep 17 00:00:00 2001
From: Tyler Smalley <tylersmalley@me.com>
Date: Wed, 16 Sep 2020 21:22:19 -0700
Subject: [PATCH 14/19] skip flaky suite (#77701)

---
 .../security_solution_endpoint/apps/endpoint/endpoint_list.ts  | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/x-pack/test/security_solution_endpoint/apps/endpoint/endpoint_list.ts b/x-pack/test/security_solution_endpoint/apps/endpoint/endpoint_list.ts
index 99689ca03603d..f58862ff4c725 100644
--- a/x-pack/test/security_solution_endpoint/apps/endpoint/endpoint_list.ts
+++ b/x-pack/test/security_solution_endpoint/apps/endpoint/endpoint_list.ts
@@ -65,7 +65,8 @@ export default ({ getPageObjects, getService }: FtrProviderContext) => {
     ],
   ];
 
-  describe('endpoint list', function () {
+  // Failing: See https://github.com/elastic/kibana/issues/77701
+  describe.skip('endpoint list', function () {
     this.tags('ciGroup7');
     const sleep = (ms = 100) => new Promise((resolve) => setTimeout(resolve, ms));
 

From 0dc0f1f34ceaab6f16a78054206b27238acae2d0 Mon Sep 17 00:00:00 2001
From: Matthias Wilhelm <matthias.wilhelm@elastic.co>
Date: Thu, 17 Sep 2020 07:51:31 +0200
Subject: [PATCH 15/19] [Discover] Migrate discover.html Angular template to
 React (#75784)

Co-authored-by: Andrea Del Rio <delrio.andre@gmail.com>
---
 .../public/application/_discover.scss         |  51 ++-
 .../__snapshots__/no_results.test.js.snap     | 126 -------
 .../angular/directives/_index.scss            |   1 -
 .../_collapsible_sidebar.scss                 |  44 ---
 .../collapsible_sidebar/_depth.scss           |  13 -
 .../collapsible_sidebar/_index.scss           |   2 -
 .../collapsible_sidebar.ts                    |  88 -----
 .../angular/directives/debounce/debounce.js   |   6 +-
 .../directives/debounce/debounce.test.ts      |  54 +--
 .../angular/directives/debounce/index.js      |   4 +-
 .../angular/directives/fixed_scroll.js        | 224 ++++++------
 .../angular/directives/fixed_scroll.test.js   |  11 +-
 .../angular/directives/no_results.js          |  65 +---
 .../angular/directives/no_results.test.js     |  29 --
 .../public/application/angular/discover.html  | 160 ---------
 .../public/application/angular/discover.js    |  26 +-
 .../application/angular/discover_legacy.html  |  36 ++
 .../application/angular/discover_state.ts     |   4 +
 .../doc_table/create_doc_table_react.tsx      | 131 +++++++
 .../angular/doc_table/doc_table.ts            |   6 +-
 .../create_discover_legacy_directive.ts       |  56 +++
 .../components/discover_legacy.tsx            | 324 ++++++++++++++++++
 .../components/fetch_error/fetch_error.tsx    |  24 +-
 .../fetch_error/{index.js => index.ts}        |   0
 .../hits_counter/hits_counter_directive.ts    |  27 --
 .../components/hits_counter/index.ts          |   1 -
 .../loading_spinner/loading_spinner.tsx       |  26 +-
 .../components/sidebar/discover_sidebar.tsx   |   2 +-
 .../sidebar/discover_sidebar_directive.ts     |  33 --
 .../application/components/sidebar/index.ts   |   1 -
 .../components/sidebar/lib/get_details.ts     |   5 +-
 .../lib/get_index_pattern_field_list.ts       |   4 +-
 .../components/skip_bottom_button/index.ts    |   1 -
 .../skip_bottom_button_directive.ts           |  23 --
 .../components/timechart_header/index.ts      |   1 -
 .../timechart_header.test.tsx                 |  18 +-
 .../timechart_header/timechart_header.tsx     |  66 ++--
 .../timechart_header_directive.ts             |  32 --
 src/plugins/discover/public/build_services.ts |   8 +-
 .../discover/public/get_inner_angular.ts      |  34 +-
 src/plugins/discover/public/plugin.ts         |  14 +-
 .../discover/public/saved_searches/types.ts   |   1 +
 test/functional/page_objects/discover_page.ts |   2 +-
 .../server/lib/layouts/preserve_layout.css    |   2 +-
 .../reporting/server/lib/layouts/print.css    |   2 +-
 .../translations/translations/ja-JP.json      |   4 -
 .../translations/translations/zh-CN.json      |   4 -
 47 files changed, 834 insertions(+), 962 deletions(-)
 delete mode 100644 src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_collapsible_sidebar.scss
 delete mode 100644 src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_depth.scss
 delete mode 100644 src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_index.scss
 delete mode 100644 src/plugins/discover/public/application/angular/directives/collapsible_sidebar/collapsible_sidebar.ts
 delete mode 100644 src/plugins/discover/public/application/angular/discover.html
 create mode 100644 src/plugins/discover/public/application/angular/discover_legacy.html
 create mode 100644 src/plugins/discover/public/application/angular/doc_table/create_doc_table_react.tsx
 create mode 100644 src/plugins/discover/public/application/components/create_discover_legacy_directive.ts
 create mode 100644 src/plugins/discover/public/application/components/discover_legacy.tsx
 rename src/plugins/discover/public/application/components/fetch_error/{index.js => index.ts} (100%)
 delete mode 100644 src/plugins/discover/public/application/components/hits_counter/hits_counter_directive.ts
 delete mode 100644 src/plugins/discover/public/application/components/sidebar/discover_sidebar_directive.ts
 delete mode 100644 src/plugins/discover/public/application/components/skip_bottom_button/skip_bottom_button_directive.ts
 delete mode 100644 src/plugins/discover/public/application/components/timechart_header/timechart_header_directive.ts

diff --git a/src/plugins/discover/public/application/_discover.scss b/src/plugins/discover/public/application/_discover.scss
index 69df2a75b8d75..bc704439d161b 100644
--- a/src/plugins/discover/public/application/_discover.scss
+++ b/src/plugins/discover/public/application/_discover.scss
@@ -5,6 +5,11 @@
   overflow: hidden;
 }
 
+.dscAppContainer {
+  > * {
+    position: relative;
+  }
+}
 discover-app {
   flex-grow: 1;
 }
@@ -17,9 +22,12 @@ discover-app {
 
 // SASSTODO: replace the z-index value with a variable
 .dscWrapper {
+  padding-left: $euiSizeXL;
   padding-right: $euiSizeS;
-  padding-left: 21px;
   z-index: 1;
+  @include euiBreakpoint('xs', 's', 'm') {
+    padding-left: $euiSizeS;
+  }
 }
 
 @include euiPanel('.dscWrapper__content');
@@ -104,14 +112,51 @@ discover-app {
   top: $euiSizeXS;
 }
 
-[fixed-scroll] {
+.dscTableFixedScroll {
   overflow-x: auto;
   padding-bottom: 0;
 
-  + .fixed-scroll-scroller {
+  + .dscTableFixedScroll__scroller {
     position: fixed;
     bottom: 0;
     overflow-x: auto;
     overflow-y: hidden;
   }
 }
+
+.dscCollapsibleSidebar {
+  position: relative;
+  z-index: $euiZLevel1;
+
+  .dscCollapsibleSidebar__collapseButton {
+    position: absolute;
+    top: 0;
+    right: -$euiSizeXL + 4;
+    cursor: pointer;
+    z-index: -1;
+    min-height: $euiSizeM;
+    min-width: $euiSizeM;
+    padding: $euiSizeXS * .5;
+  }
+
+  &.closed {
+    width: 0 !important;
+    border-right-width: 0;
+    border-left-width: 0;
+    .dscCollapsibleSidebar__collapseButton {
+      right: -$euiSizeL + 4;
+    }
+  }
+}
+
+@include euiBreakpoint('xs', 's', 'm') {
+  .dscCollapsibleSidebar {
+    &.closed {
+      display: none;
+    }
+
+    .dscCollapsibleSidebar__collapseButton {
+      display: none;
+    }
+  }
+}
diff --git a/src/plugins/discover/public/application/angular/directives/__snapshots__/no_results.test.js.snap b/src/plugins/discover/public/application/angular/directives/__snapshots__/no_results.test.js.snap
index e7aea41e2d08e..e69e10e29e801 100644
--- a/src/plugins/discover/public/application/angular/directives/__snapshots__/no_results.test.js.snap
+++ b/src/plugins/discover/public/application/angular/directives/__snapshots__/no_results.test.js.snap
@@ -167,132 +167,6 @@ Array [
 ]
 `;
 
-exports[`DiscoverNoResults props shardFailures doesn't render failures list when there are no failures 1`] = `
-Array [
-  <div
-    class="euiSpacer euiSpacer--xl"
-  />,
-  <div
-    class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--justifyContentCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
-  >
-    <div
-      class="euiFlexItem euiFlexItem--flexGrowZero dscNoResults"
-    >
-      <div
-        class="euiCallOut euiCallOut--warning"
-        data-test-subj="discoverNoResults"
-      >
-        <div
-          class="euiCallOutHeader"
-        >
-          <div
-            aria-hidden="true"
-            class="euiCallOutHeader__icon"
-            data-euiicon-type="help"
-          />
-          <span
-            class="euiCallOutHeader__title"
-          >
-            No results match your search criteria
-          </span>
-        </div>
-      </div>
-    </div>
-  </div>,
-]
-`;
-
-exports[`DiscoverNoResults props shardFailures renders failures list when there are failures 1`] = `
-Array [
-  <div
-    class="euiSpacer euiSpacer--xl"
-  />,
-  <div
-    class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--justifyContentCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
-  >
-    <div
-      class="euiFlexItem euiFlexItem--flexGrowZero dscNoResults"
-    >
-      <div
-        class="euiCallOut euiCallOut--warning"
-        data-test-subj="discoverNoResults"
-      >
-        <div
-          class="euiCallOutHeader"
-        >
-          <div
-            aria-hidden="true"
-            class="euiCallOutHeader__icon"
-            data-euiicon-type="help"
-          />
-          <span
-            class="euiCallOutHeader__title"
-          >
-            No results match your search criteria
-          </span>
-        </div>
-      </div>
-      <div
-        class="euiSpacer euiSpacer--xl"
-      />
-      <div
-        class="euiText euiText--medium"
-      >
-        <h3>
-          Address shard failures
-        </h3>
-        <p>
-          The following shard failures occurred:
-        </p>
-        <div>
-          <div
-            class="euiText euiText--extraSmall"
-          >
-            <strong>
-              Index &lsquo;A&rsquo;
-            </strong>
-            , shard &lsquo;1&rsquo;
-          </div>
-          <div
-            class="euiSpacer euiSpacer--s"
-          />
-          <div>
-            <pre>
-              <code>
-                {"reason":"Awful error"}
-              </code>
-            </pre>
-          </div>
-          <div
-            class="euiSpacer euiSpacer--l"
-          />
-        </div>
-        <div>
-          <div
-            class="euiText euiText--extraSmall"
-          >
-            <strong>
-              Index &lsquo;B&rsquo;
-            </strong>
-            , shard &lsquo;2&rsquo;
-          </div>
-          <div
-            class="euiSpacer euiSpacer--s"
-          />
-          <div>
-            <pre>
-              <code>
-                {"reason":"Bad error"}
-              </code>
-            </pre>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>,
-]
-`;
-
 exports[`DiscoverNoResults props timeFieldName renders time range feedback 1`] = `
 Array [
   <div
diff --git a/src/plugins/discover/public/application/angular/directives/_index.scss b/src/plugins/discover/public/application/angular/directives/_index.scss
index 2bfc74ffa0279..d4b365547b40c 100644
--- a/src/plugins/discover/public/application/angular/directives/_index.scss
+++ b/src/plugins/discover/public/application/angular/directives/_index.scss
@@ -1,3 +1,2 @@
 @import 'no_results';
 @import 'histogram';
-@import './collapsible_sidebar/index';
diff --git a/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_collapsible_sidebar.scss b/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_collapsible_sidebar.scss
deleted file mode 100644
index 68594cbe538cf..0000000000000
--- a/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_collapsible_sidebar.scss
+++ /dev/null
@@ -1,44 +0,0 @@
-// SASSTODO: Can't rename main class
-// because it's also the name of the angular directive
-.collapsible-sidebar {
-  position: relative;
-  z-index: $kbnDiscoverSidebarDepth;
-
-  .kbnCollapsibleSidebar__collapseButton {
-    position: absolute;
-    top: 0;
-    right: -21px;
-    cursor: pointer;
-    z-index: -1;
-  }
-
-  &.closed {
-    width: 0 !important;
-    border-right-width: 0;
-    border-left-width: 0;
-
-    > * {
-      visibility: hidden;
-    }
-
-    .kbnCollapsibleSidebar__collapseButton {
-      visibility: visible;
-
-      .chevron-cont:before {
-        content: "\F138";
-      }
-    }
-  }
-}
-
-@include euiBreakpoint('xs', 's', 'm') {
-  .collapsible-sidebar {
-    &.closed {
-      display: none;
-    }
-
-    .kbnCollapsibleSidebar__collapseButton {
-      display: none;
-    }
-  }
-}
diff --git a/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_depth.scss b/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_depth.scss
deleted file mode 100644
index 4bc59001f9931..0000000000000
--- a/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_depth.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-/**
- * 1. The local nav contains tooltips which should pop over the filter bar.
- * 2. The filter and local nav components should always appear above the dashboard grid items.
- * 3. The filter and local nav components should always appear above the discover content.
- * 4. The sidebar collapser button should appear above the main Discover content but below the top elements.
- * 5. Dragged panels in dashboard should always appear above other panels.
- */
-$kbnFilterBarDepth: 4; /* 1 */
-$kbnLocalNavDepth: 5; /* 1 */
-$kbnDashboardGridDepth: 1; /* 2 */
-$kbnDashboardDraggingGridDepth: 2; /* 5 */
-$kbnDiscoverWrapperDepth: 1; /* 3 */
-$kbnDiscoverSidebarDepth: 2; /* 4 */
diff --git a/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_index.scss b/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_index.scss
deleted file mode 100644
index 1409920d11aa7..0000000000000
--- a/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/_index.scss
+++ /dev/null
@@ -1,2 +0,0 @@
-@import 'depth';
-@import 'collapsible_sidebar';
diff --git a/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/collapsible_sidebar.ts b/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/collapsible_sidebar.ts
deleted file mode 100644
index 16fbb0af9f3fd..0000000000000
--- a/src/plugins/discover/public/application/angular/directives/collapsible_sidebar/collapsible_sidebar.ts
+++ /dev/null
@@ -1,88 +0,0 @@
-/*
- * 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 _ from 'lodash';
-import $ from 'jquery';
-import { IScope } from 'angular';
-
-interface LazyScope extends IScope {
-  [key: string]: any;
-}
-
-export function CollapsibleSidebarProvider() {
-  // simply a list of all of all of angulars .col-md-* classes except 12
-  const listOfWidthClasses = _.times(11, function (i) {
-    return 'col-md-' + i;
-  });
-
-  return {
-    restrict: 'C',
-    link: ($scope: LazyScope, $elem: any) => {
-      let isCollapsed = false;
-      const $collapser = $(
-        `<button
-          data-test-subj="collapseSideBarButton"
-          type="button"
-          aria-expanded="true"
-          aria-label="Toggle sidebar"
-          class="kuiCollapseButton kbnCollapsibleSidebar__collapseButton"
-        ></button>`
-      );
-      // If the collapsable element has an id, also set aria-controls
-      if ($elem.attr('id')) {
-        $collapser.attr('aria-controls', $elem.attr('id'));
-      }
-      const $icon = $('<span class="kuiIcon fa-chevron-circle-left"></span>');
-      $collapser.append($icon);
-      const $siblings = $elem.siblings();
-
-      const siblingsClass = listOfWidthClasses.reduce((prev: string, className: string) => {
-        if (prev) return prev;
-        return $siblings.hasClass(className) && className;
-      }, '');
-
-      // If there is are only two elements we can assume the other one will take 100% of the width.
-      const hasSingleSibling = $siblings.length === 1 && siblingsClass;
-
-      $collapser.on('click', function () {
-        if (isCollapsed) {
-          isCollapsed = false;
-          $elem.removeClass('closed');
-          $icon.addClass('fa-chevron-circle-left');
-          $icon.removeClass('fa-chevron-circle-right');
-          $collapser.attr('aria-expanded', 'true');
-        } else {
-          isCollapsed = true;
-          $elem.addClass('closed');
-          $icon.removeClass('fa-chevron-circle-left');
-          $icon.addClass('fa-chevron-circle-right');
-          $collapser.attr('aria-expanded', 'false');
-        }
-
-        if (hasSingleSibling) {
-          $siblings.toggleClass(siblingsClass + ' col-md-12');
-        }
-
-        if ($scope.toggleSidebar) $scope.toggleSidebar();
-      });
-
-      $collapser.appendTo($elem);
-    },
-  };
-}
diff --git a/src/plugins/discover/public/application/angular/directives/debounce/debounce.js b/src/plugins/discover/public/application/angular/directives/debounce/debounce.js
index 586e8ed4fab59..8ce2b042c0efe 100644
--- a/src/plugins/discover/public/application/angular/directives/debounce/debounce.js
+++ b/src/plugins/discover/public/application/angular/directives/debounce/debounce.js
@@ -21,7 +21,7 @@ import _ from 'lodash';
 // Debounce service, angularized version of lodash debounce
 // borrowed heavily from https://github.com/shahata/angular-debounce
 
-export function DebounceProviderTimeout($timeout) {
+export function createDebounceProviderTimeout($timeout) {
   return function (func, wait, options) {
     let timeout;
     let args;
@@ -66,7 +66,3 @@ export function DebounceProviderTimeout($timeout) {
     return debounce;
   };
 }
-
-export function DebounceProvider(debounce) {
-  return debounce;
-}
diff --git a/src/plugins/discover/public/application/angular/directives/debounce/debounce.test.ts b/src/plugins/discover/public/application/angular/directives/debounce/debounce.test.ts
index ccdee153002e4..0cdc214cf97f5 100644
--- a/src/plugins/discover/public/application/angular/directives/debounce/debounce.test.ts
+++ b/src/plugins/discover/public/application/angular/directives/debounce/debounce.test.ts
@@ -24,7 +24,7 @@ import 'angular-sanitize';
 import 'angular-route';
 
 // @ts-ignore
-import { DebounceProvider } from './index';
+import { createDebounceProviderTimeout } from './debounce';
 import { coreMock } from '../../../../../../../core/public/mocks';
 import { initializeInnerAngularModule } from '../../../../get_inner_angular';
 import { navigationPluginMock } from '../../../../../../navigation/public/mocks';
@@ -33,7 +33,6 @@ import { initAngularBootstrap } from '../../../../../../kibana_legacy/public';
 
 describe('debounce service', function () {
   let debounce: (fn: () => void, timeout: number, options?: any) => any;
-  let debounceFromProvider: (fn: () => void, timeout: number, options?: any) => any;
   let $timeout: ITimeoutService;
   let spy: SinonSpy;
 
@@ -51,22 +50,17 @@ describe('debounce service', function () {
 
     angular.mock.module('app/discover');
 
-    angular.mock.inject(
-      ($injector: auto.IInjectorService, _$timeout_: ITimeoutService, Private: any) => {
-        $timeout = _$timeout_;
+    angular.mock.inject(($injector: auto.IInjectorService, _$timeout_: ITimeoutService) => {
+      $timeout = _$timeout_;
 
-        debounce = $injector.get('debounce');
-        debounceFromProvider = Private(DebounceProvider);
-      }
-    );
+      debounce = createDebounceProviderTimeout($timeout);
+    });
   });
 
   it('should have a cancel method', function () {
     const bouncer = debounce(() => {}, 100);
-    const bouncerFromProvider = debounceFromProvider(() => {}, 100);
 
     expect(bouncer).toHaveProperty('cancel');
-    expect(bouncerFromProvider).toHaveProperty('cancel');
   });
 
   describe('delayed execution', function () {
@@ -77,7 +71,6 @@ describe('debounce service', function () {
 
     it('should delay execution', function () {
       const bouncer = debounce(spy, 100);
-      const bouncerFromProvider = debounceFromProvider(spy, 100);
 
       bouncer();
       sinon.assert.notCalled(spy);
@@ -85,16 +78,10 @@ describe('debounce service', function () {
       sinon.assert.calledOnce(spy);
 
       spy.resetHistory();
-
-      bouncerFromProvider();
-      sinon.assert.notCalled(spy);
-      $timeout.flush();
-      sinon.assert.calledOnce(spy);
     });
 
     it('should fire on leading edge', function () {
       const bouncer = debounce(spy, 100, { leading: true });
-      const bouncerFromProvider = debounceFromProvider(spy, 100, { leading: true });
 
       bouncer();
       sinon.assert.calledOnce(spy);
@@ -102,19 +89,10 @@ describe('debounce service', function () {
       sinon.assert.calledTwice(spy);
 
       spy.resetHistory();
-
-      bouncerFromProvider();
-      sinon.assert.calledOnce(spy);
-      $timeout.flush();
-      sinon.assert.calledTwice(spy);
     });
 
     it('should only fire on leading edge', function () {
       const bouncer = debounce(spy, 100, { leading: true, trailing: false });
-      const bouncerFromProvider = debounceFromProvider(spy, 100, {
-        leading: true,
-        trailing: false,
-      });
 
       bouncer();
       sinon.assert.calledOnce(spy);
@@ -122,17 +100,11 @@ describe('debounce service', function () {
       sinon.assert.calledOnce(spy);
 
       spy.resetHistory();
-
-      bouncerFromProvider();
-      sinon.assert.calledOnce(spy);
-      $timeout.flush();
-      sinon.assert.calledOnce(spy);
     });
 
     it('should reset delayed execution', function () {
       const cancelSpy = sinon.spy($timeout, 'cancel');
       const bouncer = debounce(spy, 100);
-      const bouncerFromProvider = debounceFromProvider(spy, 100);
 
       bouncer();
       sandbox.clock.tick(1);
@@ -145,15 +117,6 @@ describe('debounce service', function () {
 
       spy.resetHistory();
       cancelSpy.resetHistory();
-
-      bouncerFromProvider();
-      sandbox.clock.tick(1);
-
-      bouncerFromProvider();
-      sinon.assert.notCalled(spy);
-      $timeout.flush();
-      sinon.assert.calledOnce(spy);
-      sinon.assert.calledOnce(cancelSpy);
     });
   });
 
@@ -161,7 +124,6 @@ describe('debounce service', function () {
     it('should cancel the $timeout', function () {
       const cancelSpy = sinon.spy($timeout, 'cancel');
       const bouncer = debounce(spy, 100);
-      const bouncerFromProvider = debounceFromProvider(spy, 100);
 
       bouncer();
       bouncer.cancel();
@@ -170,12 +132,6 @@ describe('debounce service', function () {
       $timeout.verifyNoPendingTasks();
 
       cancelSpy.resetHistory();
-
-      bouncerFromProvider();
-      bouncerFromProvider.cancel();
-      sinon.assert.calledOnce(cancelSpy);
-      // throws if pending timeouts
-      $timeout.verifyNoPendingTasks();
     });
   });
 });
diff --git a/src/plugins/discover/public/application/angular/directives/debounce/index.js b/src/plugins/discover/public/application/angular/directives/debounce/index.js
index 35b8339263626..3c51895f19828 100644
--- a/src/plugins/discover/public/application/angular/directives/debounce/index.js
+++ b/src/plugins/discover/public/application/angular/directives/debounce/index.js
@@ -17,6 +17,4 @@
  * under the License.
  */
 
-import './debounce';
-
-export { DebounceProvider } from './debounce';
+export { createDebounceProviderTimeout } from './debounce';
diff --git a/src/plugins/discover/public/application/angular/directives/fixed_scroll.js b/src/plugins/discover/public/application/angular/directives/fixed_scroll.js
index 182b4aeca9a23..e2d5f10a0faf7 100644
--- a/src/plugins/discover/public/application/angular/directives/fixed_scroll.js
+++ b/src/plugins/discover/public/application/angular/directives/fixed_scroll.js
@@ -19,7 +19,7 @@
 
 import $ from 'jquery';
 import _ from 'lodash';
-import { DebounceProvider } from './debounce';
+import { createDebounceProviderTimeout } from './debounce';
 
 const SCROLLER_HEIGHT = 20;
 
@@ -28,124 +28,128 @@ const SCROLLER_HEIGHT = 20;
  * to the target element's real scrollbar. This is useful when the target element's horizontal scrollbar
  * might be waaaay down the page, like the doc table on Discover.
  */
-export function FixedScrollProvider(Private) {
-  const debounce = Private(DebounceProvider);
-
+export function FixedScrollProvider($timeout) {
   return {
     restrict: 'A',
     link: function ($scope, $el) {
-      let $window = $(window);
-      let $scroller = $('<div class="fixed-scroll-scroller">').height(SCROLLER_HEIGHT);
-
-      /**
-       * Remove the listeners bound in listen()
-       * @type {function}
-       */
-      let unlisten = _.noop;
-
-      /**
-       * Listen for scroll events on the $scroller and the $el, sets unlisten()
-       *
-       * unlisten must be called before calling or listen() will throw an Error
-       *
-       * Since the browser emits "scroll" events after setting scrollLeft
-       * the listeners also prevent tug-of-war
-       *
-       * @throws {Error} If unlisten was not called first
-       * @return {undefined}
-       */
-      function listen() {
-        if (unlisten !== _.noop) {
-          throw new Error(
-            'fixedScroll listeners were not cleaned up properly before re-listening!'
-          );
-        }
-
-        let blockTo;
-        function bind($from, $to) {
-          function handler() {
-            if (blockTo === $to) return (blockTo = null);
-            $to.scrollLeft((blockTo = $from).scrollLeft());
-          }
-
-          $from.on('scroll', handler);
-          return function () {
-            $from.off('scroll', handler);
-          };
-        }
-
-        unlisten = _.flow(bind($el, $scroller), bind($scroller, $el), function () {
-          unlisten = _.noop;
-        });
-      }
-
-      /**
-       * Revert DOM changes and event listeners
-       * @return {undefined}
-       */
-      function cleanUp() {
-        unlisten();
-        $scroller.detach();
-        $el.css('padding-bottom', 0);
-      }
-
-      /**
-       * Modify the DOM and attach event listeners based on need.
-       * Is called many times to re-setup, must be idempotent
-       * @return {undefined}
-       */
-      function setup() {
-        cleanUp();
-
-        const containerWidth = $el.width();
-        const contentWidth = $el.prop('scrollWidth');
-        const containerHorizOverflow = contentWidth - containerWidth;
-
-        const elTop = $el.offset().top - $window.scrollTop();
-        const elBottom = elTop + $el.height();
-        const windowVertOverflow = elBottom - $window.height();
-
-        const requireScroller = containerHorizOverflow > 0 && windowVertOverflow > 0;
-        if (!requireScroller) return;
-
-        // push the content away from the scroller
-        $el.css('padding-bottom', SCROLLER_HEIGHT);
-
-        // fill the scroller with a dummy element that mimics the content
-        $scroller
-          .width(containerWidth)
-          .html($('<div>').css({ width: contentWidth, height: SCROLLER_HEIGHT }))
-          .insertAfter($el);
+      return createFixedScroll($scope, $timeout)($el);
+    },
+  };
+}
 
-        // listen for scroll events
-        listen();
+export function createFixedScroll($scope, $timeout) {
+  const debounce = createDebounceProviderTimeout($timeout);
+  return function (el) {
+    const $el = typeof el.css === 'function' ? el : $(el);
+    let $window = $(window);
+    let $scroller = $('<div class="dscTableFixedScroll__scroller">').height(SCROLLER_HEIGHT);
+
+    /**
+     * Remove the listeners bound in listen()
+     * @type {function}
+     */
+    let unlisten = _.noop;
+
+    /**
+     * Listen for scroll events on the $scroller and the $el, sets unlisten()
+     *
+     * unlisten must be called before calling or listen() will throw an Error
+     *
+     * Since the browser emits "scroll" events after setting scrollLeft
+     * the listeners also prevent tug-of-war
+     *
+     * @throws {Error} If unlisten was not called first
+     * @return {undefined}
+     */
+    function listen() {
+      if (unlisten !== _.noop) {
+        throw new Error('fixedScroll listeners were not cleaned up properly before re-listening!');
       }
 
-      let width;
-      let scrollWidth;
-      function checkWidth() {
-        const newScrollWidth = $el.prop('scrollWidth');
-        const newWidth = $el.width();
-
-        if (scrollWidth !== newScrollWidth || width !== newWidth) {
-          $scope.$apply(setup);
-
-          scrollWidth = newScrollWidth;
-          width = newWidth;
+      let blockTo;
+      function bind($from, $to) {
+        function handler() {
+          if (blockTo === $to) return (blockTo = null);
+          $to.scrollLeft((blockTo = $from).scrollLeft());
         }
-      }
 
-      const debouncedCheckWidth = debounce(checkWidth, 100, {
-        invokeApply: false,
-      });
-      $scope.$watch(debouncedCheckWidth);
+        $from.on('scroll', handler);
+        return function () {
+          $from.off('scroll', handler);
+        };
+      }
 
-      // cleanup when the scope is destroyed
-      $scope.$on('$destroy', function () {
-        cleanUp();
-        debouncedCheckWidth.cancel();
-        $scroller = $window = null;
+      unlisten = _.flow(bind($el, $scroller), bind($scroller, $el), function () {
+        unlisten = _.noop;
       });
-    },
+    }
+
+    /**
+     * Revert DOM changes and event listeners
+     * @return {undefined}
+     */
+    function cleanUp() {
+      unlisten();
+      $scroller.detach();
+      $el.css('padding-bottom', 0);
+    }
+
+    /**
+     * Modify the DOM and attach event listeners based on need.
+     * Is called many times to re-setup, must be idempotent
+     * @return {undefined}
+     */
+    function setup() {
+      cleanUp();
+
+      const containerWidth = $el.width();
+      const contentWidth = $el.prop('scrollWidth');
+      const containerHorizOverflow = contentWidth - containerWidth;
+
+      const elTop = $el.offset().top - $window.scrollTop();
+      const elBottom = elTop + $el.height();
+      const windowVertOverflow = elBottom - $window.height();
+
+      const requireScroller = containerHorizOverflow > 0 && windowVertOverflow > 0;
+      if (!requireScroller) return;
+
+      // push the content away from the scroller
+      $el.css('padding-bottom', SCROLLER_HEIGHT);
+
+      // fill the scroller with a dummy element that mimics the content
+      $scroller
+        .width(containerWidth)
+        .html($('<div>').css({ width: contentWidth, height: SCROLLER_HEIGHT }))
+        .insertAfter($el);
+
+      // listen for scroll events
+      listen();
+    }
+
+    let width;
+    let scrollWidth;
+    function checkWidth() {
+      const newScrollWidth = $el.prop('scrollWidth');
+      const newWidth = $el.width();
+
+      if (scrollWidth !== newScrollWidth || width !== newWidth) {
+        $scope.$apply(setup);
+
+        scrollWidth = newScrollWidth;
+        width = newWidth;
+      }
+    }
+
+    const debouncedCheckWidth = debounce(checkWidth, 100, {
+      invokeApply: false,
+    });
+    $scope.$watch(debouncedCheckWidth);
+
+    function destroy() {
+      cleanUp();
+      debouncedCheckWidth.cancel();
+      $scroller = $window = null;
+    }
+    return destroy;
   };
 }
diff --git a/src/plugins/discover/public/application/angular/directives/fixed_scroll.test.js b/src/plugins/discover/public/application/angular/directives/fixed_scroll.test.js
index 65255d6c0c4a4..e44bb45cf2431 100644
--- a/src/plugins/discover/public/application/angular/directives/fixed_scroll.test.js
+++ b/src/plugins/discover/public/application/angular/directives/fixed_scroll.test.js
@@ -23,17 +23,12 @@ import $ from 'jquery';
 
 import sinon from 'sinon';
 
-import { PrivateProvider, initAngularBootstrap } from '../../../../../kibana_legacy/public';
+import { initAngularBootstrap } from '../../../../../kibana_legacy/public';
 import { FixedScrollProvider } from './fixed_scroll';
-import { DebounceProviderTimeout } from './debounce/debounce';
 
 const testModuleName = 'fixedScroll';
 
-angular
-  .module(testModuleName, [])
-  .provider('Private', PrivateProvider)
-  .service('debounce', ['$timeout', DebounceProviderTimeout])
-  .directive('fixedScroll', FixedScrollProvider);
+angular.module(testModuleName, []).directive('fixedScroll', FixedScrollProvider);
 
 describe('FixedScroll directive', function () {
   const sandbox = sinon.createSandbox();
@@ -127,7 +122,7 @@ describe('FixedScroll directive', function () {
         return {
           $container: $el,
           $content: $content,
-          $scroller: $parent.find('.fixed-scroll-scroller'),
+          $scroller: $parent.find('.dscTableFixedScroll__scroller'),
         };
       };
     });
diff --git a/src/plugins/discover/public/application/angular/directives/no_results.js b/src/plugins/discover/public/application/angular/directives/no_results.js
index 965c1271c2f2c..d8a39d9178e93 100644
--- a/src/plugins/discover/public/application/angular/directives/no_results.js
+++ b/src/plugins/discover/public/application/angular/directives/no_results.js
@@ -24,7 +24,6 @@ import PropTypes from 'prop-types';
 import {
   EuiCallOut,
   EuiCode,
-  EuiCodeBlock,
   EuiDescriptionList,
   EuiFlexGroup,
   EuiFlexItem,
@@ -37,72 +36,12 @@ import { getServices } from '../../../kibana_services';
 // eslint-disable-next-line react/prefer-stateless-function
 export class DiscoverNoResults extends Component {
   static propTypes = {
-    shardFailures: PropTypes.array,
     timeFieldName: PropTypes.string,
     queryLanguage: PropTypes.string,
   };
 
   render() {
-    const { shardFailures, timeFieldName, queryLanguage } = this.props;
-
-    let shardFailuresMessage;
-
-    if (shardFailures && shardFailures.length) {
-      const failures = shardFailures.map((failure, index) => (
-        <div key={`${failure.index}${failure.shard}${failure.reason}`}>
-          <EuiText size="xs">
-            <FormattedMessage
-              id="discover.noResults.indexFailureShardText"
-              defaultMessage="{index}, shard {failureShard}"
-              values={{
-                index: (
-                  <strong>
-                    <FormattedMessage
-                      id="discover.noResults.indexFailureIndexText"
-                      defaultMessage="Index {failureIndex}"
-                      values={{
-                        failureIndex: `&lsquo;${failure.index}&rsquo;`,
-                      }}
-                    />
-                  </strong>
-                ),
-                failureShard: `&lsquo;${failure.shard}&rsquo;`,
-              }}
-            />
-          </EuiText>
-
-          <EuiSpacer size="s" />
-
-          <EuiCodeBlock paddingSize="s">{JSON.stringify(failure.reason)}</EuiCodeBlock>
-
-          {index < shardFailures.length - 1 ? <EuiSpacer size="l" /> : undefined}
-        </div>
-      ));
-
-      shardFailuresMessage = (
-        <Fragment>
-          <EuiSpacer size="xl" />
-
-          <EuiText>
-            <h3>
-              <FormattedMessage
-                id="discover.noResults.addressShardFailuresTitle"
-                defaultMessage="Address shard failures"
-              />
-            </h3>
-
-            <p>
-              <FormattedMessage
-                id="discover.noResults.shardFailuresDescription"
-                defaultMessage="The following shard failures occurred:"
-              />
-            </p>
-
-            {failures}
-          </EuiText>
-        </Fragment>
-      );
-    }
+    const { timeFieldName, queryLanguage } = this.props;
 
     let timeFieldMessage;
 
@@ -264,8 +203,6 @@ export class DiscoverNoResults extends Component {
                 iconType="help"
                 data-test-subj="discoverNoResults"
               />
-
-              {shardFailuresMessage}
               {timeFieldMessage}
               {luceneQueryMessage}
             </EuiFlexItem>
diff --git a/src/plugins/discover/public/application/angular/directives/no_results.test.js b/src/plugins/discover/public/application/angular/directives/no_results.test.js
index 7de792c612993..60c50048a39ef 100644
--- a/src/plugins/discover/public/application/angular/directives/no_results.test.js
+++ b/src/plugins/discover/public/application/angular/directives/no_results.test.js
@@ -42,35 +42,6 @@ beforeEach(() => {
 
 describe('DiscoverNoResults', () => {
   describe('props', () => {
-    describe('shardFailures', () => {
-      test('renders failures list when there are failures', () => {
-        const shardFailures = [
-          {
-            index: 'A',
-            shard: '1',
-            reason: { reason: 'Awful error' },
-          },
-          {
-            index: 'B',
-            shard: '2',
-            reason: { reason: 'Bad error' },
-          },
-        ];
-
-        const component = renderWithIntl(<DiscoverNoResults shardFailures={shardFailures} />);
-
-        expect(component).toMatchSnapshot();
-      });
-
-      test(`doesn't render failures list when there are no failures`, () => {
-        const shardFailures = [];
-
-        const component = renderWithIntl(<DiscoverNoResults shardFailures={shardFailures} />);
-
-        expect(component).toMatchSnapshot();
-      });
-    });
-
     describe('timeFieldName', () => {
       test('renders time range feedback', () => {
         const component = renderWithIntl(<DiscoverNoResults timeFieldName="awesome_time_field" />);
diff --git a/src/plugins/discover/public/application/angular/discover.html b/src/plugins/discover/public/application/angular/discover.html
deleted file mode 100644
index e0e452aaa41c5..0000000000000
--- a/src/plugins/discover/public/application/angular/discover.html
+++ /dev/null
@@ -1,160 +0,0 @@
-<discover-app class="app-container" data-fetch-counter="{{fetchCounter}}">
-  <h1 class="euiScreenReaderOnly">{{screenTitle}}</h1>
-
-  <!-- Local nav. -->
-  <kbn-top-nav
-    app-name="'discover'"
-    config="topNavMenu"
-    set-menu-mount-point="setHeaderActionMenu"
-    index-patterns="[indexPattern]"
-    on-query-submit="handleRefresh"
-    on-saved-query-id-change="updateSavedQueryId"
-    saved-query-id="state.savedQuery"
-    screen-title="screenTitle"
-    show-date-picker="indexPattern.isTimeBased()"
-    show-save-query="showSaveQuery"
-    show-search-bar="true"
-    use-default-behaviors="true"
-  >
-  </kbn-top-nav>
-
-  <main class="container-fluid">
-    <div class="row">
-      <div class="col-md-2 dscSidebar__container collapsible-sidebar" id="discover-sidebar" data-test-subj="discover-sidebar">
-        <div class="dscFieldChooser">
-          <discover-sidebar
-            columns="state.columns"
-            field-counts="fieldCounts"
-            hits="rows"
-            index-pattern-list="opts.indexPatternList"
-            on-add-field="addColumn"
-            on-add-filter="filterQuery"
-            on-remove-field="removeColumn"
-            selected-index-pattern="searchSource.getField('index')"
-            set-index-pattern="setIndexPattern"
-          >
-          </discover-sidebar>
-        </div>
-      </div>
-
-      <div class="dscWrapper col-md-10">
-        <discover-no-results
-          ng-show="resultState === 'none'"
-          shard-failures="failures"
-          time-field-name="opts.timefield"
-          query-language="state.query.language"
-          get-doc-link="getDocLink"
-        ></discover-no-results>
-
-        <discover-uninitialized
-          ng-show="resultState === 'uninitialized'"
-          on-refresh="fetch"
-        ></discover-uninitialized>
-
-        <!-- loading -->
-        <div ng-show="resultState === 'loading'">
-          <discover-fetch-error
-            ng-show="fetchError"
-            fetch-error="fetchError"
-          ></discover-fetch-error>
-
-          <loading-spinner ng-hide="fetchError" class="dscOverlay"></loading-spinner>
-        </div>
-
-        <div class="dscWrapper__content" ng-show="resultState === 'ready'">
-          <!-- result -->
-          <div class="dscResults">
-            <skip-bottom-button on-click="onSkipBottomButtonClick"></skip-bottom-button>
-
-            <hits-counter
-              hits="hits || 0"
-              show-reset-button="opts.savedSearch.id"
-              on-reset-query="resetQuery"
-            >
-            </hits-counter>
-
-            <section
-              aria-label="{{::'discover.histogramOfFoundDocumentsAriaLabel' | i18n: {defaultMessage: 'Histogram of found documents'} }}"
-              class="dscTimechart"
-              ng-if="opts.timefield"
-            >
-              <timechart-header
-                from="toMoment(timeRange.from)"
-                to="toMoment(timeRange.to)"
-                options="intervalOptions"
-                on-change-interval="changeInterval"
-                state-interval="state.interval"
-                show-scaled-info="bucketInterval.scaled"
-                bucket-interval-description="bucketInterval.description"
-                bucket-interval-scale="bucketInterval.scale"
-              >
-              </timechart-header>
-
-              <discover-histogram
-                class="dscHistogram"
-                ng-show="vis && rows.length !== 0"
-                chart-data="histogramData"
-                timefilter-update-handler="timefilterUpdateHandler"
-                watch-depth="reference"
-                data-test-subj="discoverChart"
-              ></discover-histogram>
-            </section>
-
-            <section
-              class="dscTable"
-              fixed-scroll
-              aria-labelledby="documentsAriaLabel"
-            >
-              <h2 class="euiScreenReaderOnly"
-                id="documentsAriaLabel"
-                i18n-id="discover.documentsAriaLabel"
-                i18n-default-message="Documents"
-              ></h2>
-              <doc-table
-                hits="rows"
-                index-pattern="indexPattern"
-                sorting="state.sort"
-                columns="state.columns"
-                infinite-scroll="true"
-                filter="filterQuery"
-                data-shared-item
-                data-title="{{opts.savedSearch.lastSavedTitle}}"
-                data-description="{{opts.savedSearch.description}}"
-                data-test-subj="discoverDocTable"
-                minimum-visible-rows="minimumVisibleRows"
-                render-complete
-                on-add-column="addColumn"
-                on-change-sort-order="setSortOrder"
-                on-move-column="moveColumn"
-                on-remove-column="removeColumn"
-              ></doc-table>
-
-              <a tabindex="0" id="discoverBottomMarker">&#8203;</a>
-
-              <div
-                ng-if="rows.length == opts.sampleSize"
-                class="dscTable__footer"
-                data-test-subj="discoverDocTableFooter"
-              >
-                <span
-                  i18n-id="discover.howToSeeOtherMatchingDocumentsDescription"
-                  i18n-default-message="These are the first {sampleSize} documents matching
-                  your search, refine your search to see others. "
-                  i18n-values="{
-                    sampleSize: opts.sampleSize,
-                  }"
-                ></span>
-                <a
-                  kbn-accessible-click
-                  ng-click="scrollToTop()"
-                  i18n-id="discover.backToTopLinkText"
-                  i18n-default-message="Back to top."
-                ></a>
-              </div>
-            </section>
-          </div>
-        </div>
-      </div>
-    </div>
-  </main>
-</discover-app>
diff --git a/src/plugins/discover/public/application/angular/discover.js b/src/plugins/discover/public/application/angular/discover.js
index b75ac75e5f2ed..7871cc4b16464 100644
--- a/src/plugins/discover/public/application/angular/discover.js
+++ b/src/plugins/discover/public/application/angular/discover.js
@@ -29,12 +29,11 @@ import { getState, splitState } from './discover_state';
 import { RequestAdapter } from '../../../../inspector/public';
 import { SavedObjectSaveModal, showSaveModal } from '../../../../saved_objects/public';
 import { getSortArray, getSortForSearchSource } from './doc_table';
+import { createFixedScroll } from './directives/fixed_scroll';
 import * as columnActions from './doc_table/actions/columns';
-
-import indexTemplate from './discover.html';
+import indexTemplateLegacy from './discover_legacy.html';
 import { showOpenSearchPanel } from '../components/top_nav/show_open_search_panel';
 import { addHelpMenuToAppChrome } from '../components/help_menu/help_menu_util';
-import '../components/fetch_error';
 import { getPainlessError } from './get_painless_error';
 import { discoverResponseHandler } from './response_handler';
 import {
@@ -71,7 +70,6 @@ import {
   indexPatterns as indexPatternsUtils,
   connectToQueryState,
   syncQueryStateWithUrl,
-  search,
 } from '../../../../data/public';
 import { getIndexPatternId } from '../helpers/get_index_pattern_id';
 import { addFatalError } from '../../../../kibana_legacy/public';
@@ -115,7 +113,7 @@ app.config(($routeProvider) => {
   };
   const discoverRoute = {
     ...defaults,
-    template: indexTemplate,
+    template: indexTemplateLegacy,
     reloadOnSearch: false,
     resolve: {
       savedObjects: function ($route, Promise) {
@@ -308,18 +306,10 @@ function discoverController($element, $route, $scope, $timeout, $window, Promise
       mode: 'absolute',
     });
   };
-  $scope.intervalOptions = search.aggs.intervalOptions;
   $scope.minimumVisibleRows = 50;
   $scope.fetchStatus = fetchStatuses.UNINITIALIZED;
   $scope.showSaveQuery = uiCapabilities.discover.saveQuery;
 
-  $scope.$watch(
-    () => uiCapabilities.discover.saveQuery,
-    (newCapability) => {
-      $scope.showSaveQuery = newCapability;
-    }
-  );
-
   let abortController;
   $scope.$on('$destroy', () => {
     if (abortController) abortController.abort();
@@ -471,7 +461,6 @@ function discoverController($element, $route, $scope, $timeout, $window, Promise
     ];
   };
   $scope.topNavMenu = getTopNavLinks();
-  $scope.setHeaderActionMenu = getHeaderActionMenuMounter();
 
   $scope.searchSource
     .setField('index', $scope.indexPattern)
@@ -515,8 +504,6 @@ function discoverController($element, $route, $scope, $timeout, $window, Promise
     ]);
   }
 
-  $scope.screenTitle = savedSearch.title;
-
   const getFieldCounts = async () => {
     // the field counts aren't set until we have the data back,
     // so we wait for the fetch to be done before proceeding
@@ -612,6 +599,9 @@ function discoverController($element, $route, $scope, $timeout, $window, Promise
     timefield: getTimeField(),
     savedSearch: savedSearch,
     indexPatternList: $route.current.locals.savedObjects.ip.list,
+    config: config,
+    fixedScroll: createFixedScroll($scope, $timeout),
+    setHeaderActionMenu: getHeaderActionMenuMounter(),
   };
 
   const shouldSearchOnPageLoad = () => {
@@ -771,6 +761,7 @@ function discoverController($element, $route, $scope, $timeout, $window, Promise
     if (!init.complete) return;
     $scope.fetchCounter++;
     $scope.fetchError = undefined;
+    $scope.minimumVisibleRows = 50;
     if (!validateTimeRange(timefilter.getTime(), toastNotifications)) {
       $scope.resultState = 'none';
       return;
@@ -868,9 +859,6 @@ function discoverController($element, $route, $scope, $timeout, $window, Promise
         tabifiedData,
         getDimensions($scope.vis.data.aggs.aggs, $scope.timeRange)
       );
-      if ($scope.vis.data.aggs.aggs[1]) {
-        $scope.bucketInterval = $scope.vis.data.aggs.aggs[1].buckets.getInterval();
-      }
       $scope.updateTime();
     }
 
diff --git a/src/plugins/discover/public/application/angular/discover_legacy.html b/src/plugins/discover/public/application/angular/discover_legacy.html
new file mode 100644
index 0000000000000..8582f71c0cb88
--- /dev/null
+++ b/src/plugins/discover/public/application/angular/discover_legacy.html
@@ -0,0 +1,36 @@
+<discover-app>
+  <discover-legacy
+    add-column="addColumn"
+    fetch="fetch"
+    fetch-counter="fetchCounter"
+    fetch-error="fetchError"
+    field-counts="fieldCounts"
+    histogram-data="histogramData"
+    hits="hits"
+    index-pattern="indexPattern"
+    minimum-visible-rows="minimumVisibleRows"
+    on-add-filter="filterQuery"
+    on-move-column="moveColumn"
+    on-change-interval="changeInterval"
+    on-remove-column="removeColumn"
+    on-set-columns="setColumns"
+    on-skip-bottom-button-click="onSkipBottomButtonClick"
+    on-sort="setSortOrder"
+    opts="opts"
+    reset-query="resetQuery"
+    result-state="resultState"
+    rows="rows"
+    saved-search="savedSearch"
+    search-source="searchSource"
+    set-index-pattern="setIndexPattern"
+    show-save-query="showSaveQuery"
+    state="state"
+    time-filter-update-handler="timefilterUpdateHandler"
+    time-range="timeRange"
+    top-nav-menu="topNavMenu"
+    update-query="handleRefresh"
+    update-saved-query-id="updateSavedQueryId"
+    vis="vis"
+  >
+  </discover-legacy>
+</discover-app>
diff --git a/src/plugins/discover/public/application/angular/discover_state.ts b/src/plugins/discover/public/application/angular/discover_state.ts
index ac0dc054485f0..5ddb6a92b5fd4 100644
--- a/src/plugins/discover/public/application/angular/discover_state.ts
+++ b/src/plugins/discover/public/application/angular/discover_state.ts
@@ -55,6 +55,10 @@ export interface AppState {
    * Array of the used sorting [[field,direction],...]
    */
   sort?: string[][];
+  /**
+   * id of the used saved query
+   */
+  savedQuery?: string;
 }
 
 interface GetStateParams {
diff --git a/src/plugins/discover/public/application/angular/doc_table/create_doc_table_react.tsx b/src/plugins/discover/public/application/angular/doc_table/create_doc_table_react.tsx
new file mode 100644
index 0000000000000..ad2b674af014c
--- /dev/null
+++ b/src/plugins/discover/public/application/angular/doc_table/create_doc_table_react.tsx
@@ -0,0 +1,131 @@
+/*
+ * 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 angular, { auto, ICompileService, IScope } from 'angular';
+import { render } from 'react-dom';
+import React, { useRef, useEffect } from 'react';
+import { getServices, IIndexPattern } from '../../../kibana_services';
+import { IndexPatternField } from '../../../../../data/common/index_patterns';
+export type AngularScope = IScope;
+
+export interface AngularDirective {
+  template: string;
+}
+
+/**
+ * Compiles and injects the give angular template into the given dom node
+ * returns a function to cleanup the injected angular element
+ */
+export async function injectAngularElement(
+  domNode: Element,
+  template: string,
+  scopeProps: any,
+  getInjector: () => Promise<auto.IInjectorService>
+): Promise<() => void> {
+  const $injector = await getInjector();
+  const rootScope: AngularScope = $injector.get('$rootScope');
+  const $compile: ICompileService = $injector.get('$compile');
+  const newScope = Object.assign(rootScope.$new(), scopeProps);
+
+  const $target = angular.element(domNode);
+  const $element = angular.element(template);
+
+  newScope.$apply(() => {
+    const linkFn = $compile($element);
+    $target.empty().append($element);
+    linkFn(newScope);
+  });
+
+  return () => {
+    newScope.$destroy();
+  };
+}
+
+/**
+ * Converts a given legacy angular directive to a render function
+ * for usage in a react component. Note that the rendering is async
+ */
+export function convertDirectiveToRenderFn(
+  directive: AngularDirective,
+  getInjector: () => Promise<auto.IInjectorService>
+) {
+  return (domNode: Element, props: any) => {
+    let rejected = false;
+
+    const cleanupFnPromise = injectAngularElement(domNode, directive.template, props, getInjector);
+    cleanupFnPromise.catch(() => {
+      rejected = true;
+      render(<div>error</div>, domNode);
+    });
+
+    return () => {
+      if (!rejected) {
+        // for cleanup
+        // http://roubenmeschian.com/rubo/?p=51
+        cleanupFnPromise.then((cleanup) => cleanup());
+      }
+    };
+  };
+}
+
+export interface DocTableLegacyProps {
+  columns: string[];
+  searchDescription?: string;
+  searchTitle?: string;
+  onFilter: (field: IndexPatternField | string, value: string, type: '+' | '-') => void;
+  rows: Array<Record<string, unknown>>;
+  indexPattern: IIndexPattern;
+  minimumVisibleRows: number;
+  onAddColumn: (column: string) => void;
+  onSort: (sort: string[][]) => void;
+  onMoveColumn: (columns: string, newIdx: number) => void;
+  onRemoveColumn: (column: string) => void;
+  sort?: string[][];
+}
+
+export function DocTableLegacy(renderProps: DocTableLegacyProps) {
+  const renderFn = convertDirectiveToRenderFn(
+    {
+      template: `<doc-table
+                columns="columns"
+                data-description="{{searchDescription}}"
+                data-shared-item
+                data-test-subj="discoverDocTable"
+                data-title="{{searchTitle}}"
+                filter="onFilter"
+                hits="rows"
+                index-pattern="indexPattern"
+                infinite-scroll="true"
+                minimum-visible-rows="minimumVisibleRows"
+                on-add-column="onAddColumn"
+                on-change-sort-order="onSort"
+                on-move-column="onMoveColumn"
+                on-remove-column="onRemoveColumn"
+                render-complete
+                sorting="sort"></doc_table>`,
+    },
+    () => getServices().getEmbeddableInjector()
+  );
+  const ref = useRef<HTMLDivElement>(null);
+  useEffect(() => {
+    if (ref && ref.current) {
+      return renderFn(ref.current, renderProps);
+    }
+  }, [renderFn, renderProps]);
+  return <div ref={ref} />;
+}
diff --git a/src/plugins/discover/public/application/angular/doc_table/doc_table.ts b/src/plugins/discover/public/application/angular/doc_table/doc_table.ts
index f972c158ff3dd..735ee9f555740 100644
--- a/src/plugins/discover/public/application/angular/doc_table/doc_table.ts
+++ b/src/plugins/discover/public/application/angular/doc_table/doc_table.ts
@@ -50,10 +50,6 @@ export function createDocTableDirective(pagerFactory: any, $filter: any) {
       inspectorAdapters: '=?',
     },
     link: ($scope: LazyScope, $el: JQuery) => {
-      $scope.$watch('minimumVisibleRows', (minimumVisibleRows: number) => {
-        $scope.limit = Math.max(minimumVisibleRows || 50, $scope.limit || 50);
-      });
-
       $scope.persist = {
         sorting: $scope.sorting,
         columns: $scope.columns,
@@ -77,7 +73,7 @@ export function createDocTableDirective(pagerFactory: any, $filter: any) {
         if (!hits) return;
 
         // Reset infinite scroll limit
-        $scope.limit = 50;
+        $scope.limit = $scope.minimumVisibleRows || 50;
 
         if (hits.length === 0) {
           dispatchRenderComplete($el[0]);
diff --git a/src/plugins/discover/public/application/components/create_discover_legacy_directive.ts b/src/plugins/discover/public/application/components/create_discover_legacy_directive.ts
new file mode 100644
index 0000000000000..a3502cbb211fa
--- /dev/null
+++ b/src/plugins/discover/public/application/components/create_discover_legacy_directive.ts
@@ -0,0 +1,56 @@
+/*
+ * 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 { DiscoverLegacy } from './discover_legacy';
+
+export function createDiscoverLegacyDirective(reactDirective: any) {
+  return reactDirective(DiscoverLegacy, [
+    ['addColumn', { watchDepth: 'reference' }],
+    ['fetch', { watchDepth: 'reference' }],
+    ['fetchCounter', { watchDepth: 'reference' }],
+    ['fetchError', { watchDepth: 'reference' }],
+    ['fieldCounts', { watchDepth: 'reference' }],
+    ['histogramData', { watchDepth: 'reference' }],
+    ['hits', { watchDepth: 'reference' }],
+    ['indexPattern', { watchDepth: 'reference' }],
+    ['minimumVisibleRows', { watchDepth: 'reference' }],
+    ['onAddFilter', { watchDepth: 'reference' }],
+    ['onChangeInterval', { watchDepth: 'reference' }],
+    ['onMoveColumn', { watchDepth: 'reference' }],
+    ['onRemoveColumn', { watchDepth: 'reference' }],
+    ['onSetColumns', { watchDepth: 'reference' }],
+    ['onSkipBottomButtonClick', { watchDepth: 'reference' }],
+    ['onSort', { watchDepth: 'reference' }],
+    ['opts', { watchDepth: 'reference' }],
+    ['resetQuery', { watchDepth: 'reference' }],
+    ['resultState', { watchDepth: 'reference' }],
+    ['rows', { watchDepth: 'reference' }],
+    ['savedSearch', { watchDepth: 'reference' }],
+    ['searchSource', { watchDepth: 'reference' }],
+    ['setIndexPattern', { watchDepth: 'reference' }],
+    ['showSaveQuery', { watchDepth: 'reference' }],
+    ['state', { watchDepth: 'reference' }],
+    ['timefilterUpdateHandler', { watchDepth: 'reference' }],
+    ['timeRange', { watchDepth: 'reference' }],
+    ['topNavMenu', { watchDepth: 'reference' }],
+    ['updateQuery', { watchDepth: 'reference' }],
+    ['updateSavedQueryId', { watchDepth: 'reference' }],
+    ['vis', { watchDepth: 'reference' }],
+  ]);
+}
diff --git a/src/plugins/discover/public/application/components/discover_legacy.tsx b/src/plugins/discover/public/application/components/discover_legacy.tsx
new file mode 100644
index 0000000000000..1a98843649259
--- /dev/null
+++ b/src/plugins/discover/public/application/components/discover_legacy.tsx
@@ -0,0 +1,324 @@
+/*
+ * 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 React, { useState, useCallback, useEffect } from 'react';
+import classNames from 'classnames';
+import { EuiButtonEmpty, EuiButtonIcon } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import { FormattedMessage, I18nProvider } from '@kbn/i18n/react';
+import { IUiSettingsClient, MountPoint } from 'kibana/public';
+import { HitsCounter } from './hits_counter';
+import { TimechartHeader } from './timechart_header';
+import { DiscoverSidebar } from './sidebar';
+import { getServices, IIndexPattern } from '../../kibana_services';
+// @ts-ignore
+import { DiscoverNoResults } from '../angular/directives/no_results';
+import { DiscoverUninitialized } from '../angular/directives/uninitialized';
+import { DiscoverHistogram } from '../angular/directives/histogram';
+import { LoadingSpinner } from './loading_spinner/loading_spinner';
+import { DiscoverFetchError, FetchError } from './fetch_error/fetch_error';
+import { DocTableLegacy } from '../angular/doc_table/create_doc_table_react';
+import { SkipBottomButton } from './skip_bottom_button';
+import {
+  IndexPatternField,
+  search,
+  ISearchSource,
+  TimeRange,
+  Query,
+  IndexPatternAttributes,
+} from '../../../../data/public';
+import { Chart } from '../angular/helpers/point_series';
+import { AppState } from '../angular/discover_state';
+import { SavedSearch } from '../../saved_searches';
+
+import { SavedObject } from '../../../../../core/types';
+import { Vis } from '../../../../visualizations/public';
+import { TopNavMenuData } from '../../../../navigation/public';
+
+export interface DiscoverLegacyProps {
+  addColumn: (column: string) => void;
+  fetch: () => void;
+  fetchCounter: number;
+  fetchError: FetchError;
+  fieldCounts: Record<string, number>;
+  histogramData: Chart;
+  hits: number;
+  indexPattern: IIndexPattern;
+  minimumVisibleRows: number;
+  onAddFilter: (field: IndexPatternField | string, value: string, type: '+' | '-') => void;
+  onChangeInterval: (interval: string) => void;
+  onMoveColumn: (columns: string, newIdx: number) => void;
+  onRemoveColumn: (column: string) => void;
+  onSetColumns: (columns: string[]) => void;
+  onSkipBottomButtonClick: () => void;
+  onSort: (sort: string[][]) => void;
+  opts: {
+    savedSearch: SavedSearch;
+    config: IUiSettingsClient;
+    indexPatternList: Array<SavedObject<IndexPatternAttributes>>;
+    timefield: string;
+    sampleSize: number;
+    fixedScroll: (el: HTMLElement) => void;
+    setHeaderActionMenu: (menuMount: MountPoint | undefined) => void;
+  };
+  resetQuery: () => void;
+  resultState: string;
+  rows: Array<Record<string, unknown>>;
+  searchSource: ISearchSource;
+  setIndexPattern: (id: string) => void;
+  showSaveQuery: boolean;
+  state: AppState;
+  timefilterUpdateHandler: (ranges: { from: number; to: number }) => void;
+  timeRange?: { from: string; to: string };
+  topNavMenu: TopNavMenuData[];
+  updateQuery: (payload: { dateRange: TimeRange; query?: Query }, isUpdate?: boolean) => void;
+  updateSavedQueryId: (savedQueryId?: string) => void;
+  vis?: Vis;
+}
+
+export function DiscoverLegacy({
+  addColumn,
+  fetch,
+  fetchCounter,
+  fetchError,
+  fieldCounts,
+  histogramData,
+  hits,
+  indexPattern,
+  minimumVisibleRows,
+  onAddFilter,
+  onChangeInterval,
+  onMoveColumn,
+  onRemoveColumn,
+  onSkipBottomButtonClick,
+  onSort,
+  opts,
+  resetQuery,
+  resultState,
+  rows,
+  searchSource,
+  setIndexPattern,
+  showSaveQuery,
+  state,
+  timefilterUpdateHandler,
+  timeRange,
+  topNavMenu,
+  updateQuery,
+  updateSavedQueryId,
+  vis,
+}: DiscoverLegacyProps) {
+  const [isSidebarClosed, setIsSidebarClosed] = useState(false);
+  const { TopNavMenu } = getServices().navigation.ui;
+  const { savedSearch, indexPatternList } = opts;
+  const bucketAggConfig = vis?.data?.aggs?.aggs[1];
+  const bucketInterval =
+    bucketAggConfig && search.aggs.isDateHistogramBucketAggConfig(bucketAggConfig)
+      ? bucketAggConfig.buckets?.getInterval()
+      : undefined;
+  const [fixedScrollEl, setFixedScrollEl] = useState<HTMLElement | undefined>();
+
+  useEffect(() => (fixedScrollEl ? opts.fixedScroll(fixedScrollEl) : undefined), [
+    fixedScrollEl,
+    opts,
+  ]);
+  const fixedScrollRef = useCallback(
+    (node: HTMLElement) => {
+      if (node !== null) {
+        setFixedScrollEl(node);
+      }
+    },
+    [setFixedScrollEl]
+  );
+  const sidebarClassName = classNames({
+    closed: isSidebarClosed,
+  });
+
+  const mainSectionClassName = classNames({
+    'col-md-10': !isSidebarClosed,
+    'col-md-12': isSidebarClosed,
+  });
+
+  return (
+    <I18nProvider>
+      <div className="dscAppContainer" data-fetch-counter={fetchCounter}>
+        <h1 className="euiScreenReaderOnly">{savedSearch.title}</h1>
+        <TopNavMenu
+          appName="discover"
+          config={topNavMenu}
+          indexPatterns={[indexPattern]}
+          onQuerySubmit={updateQuery}
+          onSavedQueryIdChange={updateSavedQueryId}
+          query={state.query}
+          setMenuMountPoint={opts.setHeaderActionMenu}
+          savedQueryId={state.savedQuery}
+          screenTitle={savedSearch.title}
+          showDatePicker={indexPattern.isTimeBased()}
+          showSaveQuery={showSaveQuery}
+          showSearchBar={true}
+          useDefaultBehaviors={true}
+        />
+        <main className="container-fluid">
+          <div className="row">
+            <div
+              className={`col-md-2 dscSidebar__container dscCollapsibleSidebar ${sidebarClassName}`}
+              id="discover-sidebar"
+              data-test-subj="discover-sidebar"
+            >
+              {!isSidebarClosed && (
+                <div className="dscFieldChooser">
+                  <DiscoverSidebar
+                    columns={state.columns || []}
+                    fieldCounts={fieldCounts}
+                    hits={rows}
+                    indexPatternList={indexPatternList}
+                    onAddField={addColumn}
+                    onAddFilter={onAddFilter}
+                    onRemoveField={onRemoveColumn}
+                    selectedIndexPattern={searchSource && searchSource.getField('index')}
+                    setIndexPattern={setIndexPattern}
+                  />
+                </div>
+              )}
+              <EuiButtonIcon
+                iconType={isSidebarClosed ? 'menuRight' : 'menuLeft'}
+                iconSize="m"
+                size="s"
+                onClick={() => setIsSidebarClosed(!isSidebarClosed)}
+                data-test-subj="collapseSideBarButton"
+                aria-controls="discover-sidebar"
+                aria-expanded={isSidebarClosed ? 'false' : 'true'}
+                aria-label="Toggle sidebar"
+                className="dscCollapsibleSidebar__collapseButton"
+              />
+            </div>
+            <div className={`dscWrapper ${mainSectionClassName}`}>
+              {resultState === 'none' && (
+                <DiscoverNoResults
+                  timeFieldName={opts.timefield}
+                  queryLanguage={state.query ? state.query.language : ''}
+                />
+              )}
+              {resultState === 'uninitialized' && <DiscoverUninitialized onRefresh={fetch} />}
+              {/* @TODO: Solved in the Angular way to satisfy functional test - should be improved*/}
+              <span style={{ display: resultState !== 'loading' ? 'none' : '' }}>
+                {fetchError && <DiscoverFetchError fetchError={fetchError} />}
+                <div className="dscOverlay" style={{ display: fetchError ? 'none' : '' }}>
+                  <LoadingSpinner />
+                </div>
+              </span>
+              {resultState === 'ready' && (
+                <div className="dscWrapper__content">
+                  <SkipBottomButton onClick={onSkipBottomButtonClick} />
+                  <HitsCounter
+                    hits={hits > 0 ? hits : 0}
+                    showResetButton={!!(savedSearch && savedSearch.id)}
+                    onResetQuery={resetQuery}
+                  />
+                  {opts.timefield && (
+                    <TimechartHeader
+                      dateFormat={opts.config.get('dateFormat')}
+                      timeRange={timeRange}
+                      options={search.aggs.intervalOptions}
+                      onChangeInterval={onChangeInterval}
+                      stateInterval={state.interval || ''}
+                      bucketInterval={bucketInterval}
+                    />
+                  )}
+
+                  {opts.timefield && (
+                    <section
+                      aria-label={i18n.translate('discover.histogramOfFoundDocumentsAriaLabel', {
+                        defaultMessage: 'Histogram of found documents',
+                      })}
+                      className="dscTimechart"
+                    >
+                      {vis && rows.length !== 0 && (
+                        <div className="dscHistogram" data-test-subj="discoverChart">
+                          <DiscoverHistogram
+                            chartData={histogramData}
+                            timefilterUpdateHandler={timefilterUpdateHandler}
+                          />
+                        </div>
+                      )}
+                    </section>
+                  )}
+
+                  <div className="dscResults">
+                    <section
+                      className="dscTable dscTableFixedScroll"
+                      aria-labelledby="documentsAriaLabel"
+                      ref={fixedScrollRef}
+                    >
+                      <h2 className="euiScreenReaderOnly" id="documentsAriaLabel">
+                        <FormattedMessage
+                          id="discover.documentsAriaLabel"
+                          defaultMessage="Documents"
+                        />
+                      </h2>
+                      {rows && rows.length && (
+                        <div className="dscDiscover">
+                          <DocTableLegacy
+                            columns={state.columns || []}
+                            indexPattern={indexPattern}
+                            minimumVisibleRows={minimumVisibleRows}
+                            rows={rows}
+                            sort={state.sort || []}
+                            searchDescription={opts.savedSearch.description}
+                            searchTitle={opts.savedSearch.lastSavedTitle}
+                            onAddColumn={addColumn}
+                            onFilter={onAddFilter}
+                            onMoveColumn={onMoveColumn}
+                            onRemoveColumn={onRemoveColumn}
+                            onSort={onSort}
+                          />
+                          <a tabIndex={0} id="discoverBottomMarker">
+                            &#8203;
+                          </a>
+                          {rows.length === opts.sampleSize && (
+                            <div
+                              className="dscTable__footer"
+                              data-test-subj="discoverDocTableFooter"
+                            >
+                              <FormattedMessage
+                                id="discover.howToSeeOtherMatchingDocumentsDescription"
+                                defaultMessage="These are the first {sampleSize} documents matching
+                  your search, refine your search to see others."
+                                values={{ sampleSize: opts.sampleSize }}
+                              />
+
+                              <EuiButtonEmpty onClick={() => window.scrollTo(0, 0)}>
+                                <FormattedMessage
+                                  id="discover.backToTopLinkText"
+                                  defaultMessage="Back to top."
+                                />
+                              </EuiButtonEmpty>
+                            </div>
+                          )}
+                        </div>
+                      )}
+                    </section>
+                  </div>
+                </div>
+              )}
+            </div>
+          </div>
+        </main>
+      </div>
+    </I18nProvider>
+  );
+}
diff --git a/src/plugins/discover/public/application/components/fetch_error/fetch_error.tsx b/src/plugins/discover/public/application/components/fetch_error/fetch_error.tsx
index 880a493983adf..dc8f1238eac6f 100644
--- a/src/plugins/discover/public/application/components/fetch_error/fetch_error.tsx
+++ b/src/plugins/discover/public/application/components/fetch_error/fetch_error.tsx
@@ -20,18 +20,20 @@ import './fetch_error.scss';
 import React, { Fragment } from 'react';
 import { FormattedMessage, I18nProvider } from '@kbn/i18n/react';
 import { EuiFlexGroup, EuiFlexItem, EuiCallOut, EuiCodeBlock, EuiSpacer } from '@elastic/eui';
-import { getAngularModule, getServices } from '../../../kibana_services';
+import { getServices } from '../../../kibana_services';
+
+export interface FetchError {
+  lang: string;
+  script: string;
+  message: string;
+  error: string;
+}
 
 interface Props {
-  fetchError: {
-    lang: string;
-    script: string;
-    message: string;
-    error: string;
-  };
+  fetchError: FetchError;
 }
 
-const DiscoverFetchError = ({ fetchError }: Props) => {
+export const DiscoverFetchError = ({ fetchError }: Props) => {
   if (!fetchError) {
     return null;
   }
@@ -92,9 +94,3 @@ const DiscoverFetchError = ({ fetchError }: Props) => {
     </I18nProvider>
   );
 };
-
-export function createFetchErrorDirective(reactDirective: any) {
-  return reactDirective(DiscoverFetchError);
-}
-
-getAngularModule().directive('discoverFetchError', createFetchErrorDirective);
diff --git a/src/plugins/discover/public/application/components/fetch_error/index.js b/src/plugins/discover/public/application/components/fetch_error/index.ts
similarity index 100%
rename from src/plugins/discover/public/application/components/fetch_error/index.js
rename to src/plugins/discover/public/application/components/fetch_error/index.ts
diff --git a/src/plugins/discover/public/application/components/hits_counter/hits_counter_directive.ts b/src/plugins/discover/public/application/components/hits_counter/hits_counter_directive.ts
deleted file mode 100644
index 8d45e28370cad..0000000000000
--- a/src/plugins/discover/public/application/components/hits_counter/hits_counter_directive.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-/*
- * 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 { HitsCounter } from './hits_counter';
-
-export function createHitsCounterDirective(reactDirective: any) {
-  return reactDirective(HitsCounter, [
-    ['hits', { watchDepth: 'reference' }],
-    ['showResetButton', { watchDepth: 'reference' }],
-    ['onResetQuery', { watchDepth: 'reference' }],
-  ]);
-}
diff --git a/src/plugins/discover/public/application/components/hits_counter/index.ts b/src/plugins/discover/public/application/components/hits_counter/index.ts
index 58e7a9eda7f51..0ce95f061df17 100644
--- a/src/plugins/discover/public/application/components/hits_counter/index.ts
+++ b/src/plugins/discover/public/application/components/hits_counter/index.ts
@@ -18,4 +18,3 @@
  */
 
 export { HitsCounter } from './hits_counter';
-export { createHitsCounterDirective } from './hits_counter_directive';
diff --git a/src/plugins/discover/public/application/components/loading_spinner/loading_spinner.tsx b/src/plugins/discover/public/application/components/loading_spinner/loading_spinner.tsx
index 44b922bf0f708..4e1754638d479 100644
--- a/src/plugins/discover/public/application/components/loading_spinner/loading_spinner.tsx
+++ b/src/plugins/discover/public/application/components/loading_spinner/loading_spinner.tsx
@@ -18,24 +18,18 @@
  */
 import React from 'react';
 import { EuiLoadingSpinner, EuiTitle, EuiSpacer } from '@elastic/eui';
-import { FormattedMessage, I18nProvider } from '@kbn/i18n/react';
+import { FormattedMessage } from '@kbn/i18n/react';
 
 export function LoadingSpinner() {
   return (
-    <I18nProvider>
-      <>
-        <EuiTitle size="s" data-test-subj="loadingSpinnerText">
-          <h2>
-            <FormattedMessage id="discover.searchingTitle" defaultMessage="Searching" />
-          </h2>
-        </EuiTitle>
-        <EuiSpacer size="m" />
-        <EuiLoadingSpinner size="l" data-test-subj="loadingSpinner" />
-      </>
-    </I18nProvider>
+    <>
+      <EuiTitle size="s" data-test-subj="loadingSpinnerText">
+        <h2>
+          <FormattedMessage id="discover.searchingTitle" defaultMessage="Searching" />
+        </h2>
+      </EuiTitle>
+      <EuiSpacer size="m" />
+      <EuiLoadingSpinner size="l" data-test-subj="loadingSpinner" />
+    </>
   );
 }
-
-export function createLoadingSpinnerDirective(reactDirective: any) {
-  return reactDirective(LoadingSpinner);
-}
diff --git a/src/plugins/discover/public/application/components/sidebar/discover_sidebar.tsx b/src/plugins/discover/public/application/components/sidebar/discover_sidebar.tsx
index 850624888b24a..2407cff181901 100644
--- a/src/plugins/discover/public/application/components/sidebar/discover_sidebar.tsx
+++ b/src/plugins/discover/public/application/components/sidebar/discover_sidebar.tsx
@@ -68,7 +68,7 @@ export interface DiscoverSidebarProps {
   /**
    * Currently selected index pattern
    */
-  selectedIndexPattern: IndexPattern;
+  selectedIndexPattern?: IndexPattern;
   /**
    * Callback function to select another index pattern
    */
diff --git a/src/plugins/discover/public/application/components/sidebar/discover_sidebar_directive.ts b/src/plugins/discover/public/application/components/sidebar/discover_sidebar_directive.ts
deleted file mode 100644
index b271c920e5e01..0000000000000
--- a/src/plugins/discover/public/application/components/sidebar/discover_sidebar_directive.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
- * 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 { DiscoverSidebar } from './discover_sidebar';
-
-export function createDiscoverSidebarDirective(reactDirective: any) {
-  return reactDirective(DiscoverSidebar, [
-    ['columns', { watchDepth: 'reference' }],
-    ['fieldCounts', { watchDepth: 'reference' }],
-    ['hits', { watchDepth: 'reference' }],
-    ['indexPatternList', { watchDepth: 'reference' }],
-    ['onAddField', { watchDepth: 'reference' }],
-    ['onAddFilter', { watchDepth: 'reference' }],
-    ['onRemoveField', { watchDepth: 'reference' }],
-    ['selectedIndexPattern', { watchDepth: 'reference' }],
-    ['setIndexPattern', { watchDepth: 'reference' }],
-  ]);
-}
diff --git a/src/plugins/discover/public/application/components/sidebar/index.ts b/src/plugins/discover/public/application/components/sidebar/index.ts
index 1b837840b52f6..aec8dfc86e817 100644
--- a/src/plugins/discover/public/application/components/sidebar/index.ts
+++ b/src/plugins/discover/public/application/components/sidebar/index.ts
@@ -18,4 +18,3 @@
  */
 
 export { DiscoverSidebar } from './discover_sidebar';
-export { createDiscoverSidebarDirective } from './discover_sidebar_directive';
diff --git a/src/plugins/discover/public/application/components/sidebar/lib/get_details.ts b/src/plugins/discover/public/application/components/sidebar/lib/get_details.ts
index 13051f88c9591..22a6e7a628555 100644
--- a/src/plugins/discover/public/application/components/sidebar/lib/get_details.ts
+++ b/src/plugins/discover/public/application/components/sidebar/lib/get_details.ts
@@ -25,8 +25,11 @@ export function getDetails(
   field: IndexPatternField,
   hits: Array<Record<string, unknown>>,
   columns: string[],
-  indexPattern: IndexPattern
+  indexPattern?: IndexPattern
 ) {
+  if (!indexPattern) {
+    return {};
+  }
   const details = {
     ...fieldCalculator.getFieldValueCounts({
       hits,
diff --git a/src/plugins/discover/public/application/components/sidebar/lib/get_index_pattern_field_list.ts b/src/plugins/discover/public/application/components/sidebar/lib/get_index_pattern_field_list.ts
index c96a8f5ce17b9..eff7c2ec3c1c8 100644
--- a/src/plugins/discover/public/application/components/sidebar/lib/get_index_pattern_field_list.ts
+++ b/src/plugins/discover/public/application/components/sidebar/lib/get_index_pattern_field_list.ts
@@ -20,8 +20,8 @@ import { difference } from 'lodash';
 import { IndexPattern, IndexPatternField } from 'src/plugins/data/public';
 
 export function getIndexPatternFieldList(
-  indexPattern: IndexPattern,
-  fieldCounts: Record<string, number>
+  indexPattern?: IndexPattern,
+  fieldCounts?: Record<string, number>
 ) {
   if (!indexPattern || !fieldCounts) return [];
 
diff --git a/src/plugins/discover/public/application/components/skip_bottom_button/index.ts b/src/plugins/discover/public/application/components/skip_bottom_button/index.ts
index 2feaa35e0d61f..b3d93e40be0bd 100644
--- a/src/plugins/discover/public/application/components/skip_bottom_button/index.ts
+++ b/src/plugins/discover/public/application/components/skip_bottom_button/index.ts
@@ -18,4 +18,3 @@
  */
 
 export { SkipBottomButton } from './skip_bottom_button';
-export { createSkipBottomButtonDirective } from './skip_bottom_button_directive';
diff --git a/src/plugins/discover/public/application/components/skip_bottom_button/skip_bottom_button_directive.ts b/src/plugins/discover/public/application/components/skip_bottom_button/skip_bottom_button_directive.ts
deleted file mode 100644
index 27f17b25fd447..0000000000000
--- a/src/plugins/discover/public/application/components/skip_bottom_button/skip_bottom_button_directive.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-/*
- * 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 { SkipBottomButton } from './skip_bottom_button';
-
-export function createSkipBottomButtonDirective(reactDirective: any) {
-  return reactDirective(SkipBottomButton, [['onClick', { watchDepth: 'reference' }]]);
-}
diff --git a/src/plugins/discover/public/application/components/timechart_header/index.ts b/src/plugins/discover/public/application/components/timechart_header/index.ts
index 43473319c318c..34bed2cd72a74 100644
--- a/src/plugins/discover/public/application/components/timechart_header/index.ts
+++ b/src/plugins/discover/public/application/components/timechart_header/index.ts
@@ -18,4 +18,3 @@
  */
 
 export { TimechartHeader } from './timechart_header';
-export { createTimechartHeaderDirective } from './timechart_header_directive';
diff --git a/src/plugins/discover/public/application/components/timechart_header/timechart_header.test.tsx b/src/plugins/discover/public/application/components/timechart_header/timechart_header.test.tsx
index a4c10e749d868..7889b05a88415 100644
--- a/src/plugins/discover/public/application/components/timechart_header/timechart_header.test.tsx
+++ b/src/plugins/discover/public/application/components/timechart_header/timechart_header.test.tsx
@@ -29,8 +29,10 @@ describe('timechart header', function () {
 
   beforeAll(() => {
     props = {
-      from: 'May 14, 2020 @ 11:05:13.590',
-      to: 'May 14, 2020 @ 11:20:13.590',
+      timeRange: {
+        from: 'May 14, 2020 @ 11:05:13.590',
+        to: 'May 14, 2020 @ 11:20:13.590',
+      },
       stateInterval: 's',
       options: [
         {
@@ -47,9 +49,11 @@ describe('timechart header', function () {
         },
       ],
       onChangeInterval: jest.fn(),
-      showScaledInfo: undefined,
-      bucketIntervalDescription: 'second',
-      bucketIntervalScale: undefined,
+      bucketInterval: {
+        scaled: undefined,
+        description: 'second',
+        scale: undefined,
+      },
     };
   });
 
@@ -58,8 +62,8 @@ describe('timechart header', function () {
     expect(component.find(EuiIconTip).length).toBe(0);
   });
 
-  it('TimechartHeader renders an info text by providing the showScaledInfo property', () => {
-    props.showScaledInfo = true;
+  it('TimechartHeader renders an info when bucketInterval.scale is set to true', () => {
+    props.bucketInterval!.scaled = true;
     component = mountWithIntl(<TimechartHeader {...props} />);
     expect(component.find(EuiIconTip).length).toBe(1);
   });
diff --git a/src/plugins/discover/public/application/components/timechart_header/timechart_header.tsx b/src/plugins/discover/public/application/components/timechart_header/timechart_header.tsx
index 8789847058aff..1451106827ee0 100644
--- a/src/plugins/discover/public/application/components/timechart_header/timechart_header.tsx
+++ b/src/plugins/discover/public/application/components/timechart_header/timechart_header.tsx
@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useCallback } from 'react';
 import {
   EuiFlexGroup,
   EuiFlexItem,
@@ -27,16 +27,28 @@ import {
 } from '@elastic/eui';
 import { I18nProvider } from '@kbn/i18n/react';
 import { i18n } from '@kbn/i18n';
+import moment from 'moment';
 
 export interface TimechartHeaderProps {
   /**
-   * the query from date string
+   * Format of date to be displayed
    */
-  from: string;
+  dateFormat?: string;
   /**
-   * the query to date string
+   * Interval for the buckets of the recent request
    */
-  to: string;
+  bucketInterval?: {
+    scaled?: boolean;
+    description?: string;
+    scale?: number;
+  };
+  /**
+   * Range of dates to be displayed
+   */
+  timeRange?: {
+    from: string;
+    to: string;
+  };
   /**
    * Interval Options
    */
@@ -49,31 +61,29 @@ export interface TimechartHeaderProps {
    * selected interval
    */
   stateInterval: string;
-  /**
-   * displays the scaled info of the interval
-   */
-  showScaledInfo: boolean | undefined;
-  /**
-   * scaled info description
-   */
-  bucketIntervalDescription: string;
-  /**
-   * bucket interval scale
-   */
-  bucketIntervalScale: number | undefined;
 }
 
 export function TimechartHeader({
-  from,
-  to,
+  bucketInterval,
+  dateFormat,
+  timeRange,
   options,
   onChangeInterval,
   stateInterval,
-  showScaledInfo,
-  bucketIntervalDescription,
-  bucketIntervalScale,
 }: TimechartHeaderProps) {
   const [interval, setInterval] = useState(stateInterval);
+  const toMoment = useCallback(
+    (datetime: string) => {
+      if (!datetime) {
+        return '';
+      }
+      if (!dateFormat) {
+        return datetime;
+      }
+      return moment(datetime).format(dateFormat);
+    },
+    [dateFormat]
+  );
 
   useEffect(() => {
     setInterval(stateInterval);
@@ -84,6 +94,10 @@ export function TimechartHeader({
     onChangeInterval(e.target.value);
   };
 
+  if (!timeRange || !bucketInterval) {
+    return null;
+  }
+
   return (
     <I18nProvider>
       <EuiFlexGroup gutterSize="s" responsive justifyContent="center" alignItems="center">
@@ -95,7 +109,7 @@ export function TimechartHeader({
             delay="long"
           >
             <EuiText data-test-subj="discoverIntervalDateRange" size="s">
-              {`${from} - ${to} ${
+              {`${toMoment(timeRange.from)} - ${toMoment(timeRange.to)} ${
                 interval !== 'auto'
                   ? i18n.translate('discover.timechartHeader.timeIntervalSelect.per', {
                       defaultMessage: 'per',
@@ -125,7 +139,7 @@ export function TimechartHeader({
             value={interval}
             onChange={handleIntervalChange}
             append={
-              showScaledInfo ? (
+              bucketInterval.scaled ? (
                 <EuiIconTip
                   id="discoverIntervalIconTip"
                   content={i18n.translate('discover.bucketIntervalTooltip', {
@@ -133,14 +147,14 @@ export function TimechartHeader({
                       'This interval creates {bucketsDescription} to show in the selected time range, so it has been scaled to {bucketIntervalDescription}.',
                     values: {
                       bucketsDescription:
-                        bucketIntervalScale && bucketIntervalScale > 1
+                        bucketInterval!.scale && bucketInterval!.scale > 1
                           ? i18n.translate('discover.bucketIntervalTooltip.tooLargeBucketsText', {
                               defaultMessage: 'buckets that are too large',
                             })
                           : i18n.translate('discover.bucketIntervalTooltip.tooManyBucketsText', {
                               defaultMessage: 'too many buckets',
                             }),
-                      bucketIntervalDescription,
+                      bucketIntervalDescription: bucketInterval.description,
                     },
                   })}
                   color="warning"
diff --git a/src/plugins/discover/public/application/components/timechart_header/timechart_header_directive.ts b/src/plugins/discover/public/application/components/timechart_header/timechart_header_directive.ts
deleted file mode 100644
index 027236cd46521..0000000000000
--- a/src/plugins/discover/public/application/components/timechart_header/timechart_header_directive.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-/*
- * 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 { TimechartHeader } from './timechart_header';
-
-export function createTimechartHeaderDirective(reactDirective: any) {
-  return reactDirective(TimechartHeader, [
-    ['from', { watchDepth: 'reference' }],
-    ['to', { watchDepth: 'reference' }],
-    ['options', { watchDepth: 'reference' }],
-    ['onChangeInterval', { watchDepth: 'reference' }],
-    ['stateInterval', { watchDepth: 'reference' }],
-    ['showScaledInfo', { watchDepth: 'reference' }],
-    ['bucketIntervalDescription', { watchDepth: 'reference' }],
-    ['bucketIntervalScale', { watchDepth: 'reference' }],
-  ]);
-}
diff --git a/src/plugins/discover/public/build_services.ts b/src/plugins/discover/public/build_services.ts
index 12562d8571a25..fdb14b3f1f63e 100644
--- a/src/plugins/discover/public/build_services.ts
+++ b/src/plugins/discover/public/build_services.ts
@@ -44,6 +44,7 @@ import { createSavedSearchesLoader, SavedSearch } from './saved_searches';
 import { getHistory } from './kibana_services';
 import { KibanaLegacyStart } from '../../kibana_legacy/public';
 import { UrlForwardingStart } from '../../url_forwarding/public';
+import { NavigationPublicPluginStart } from '../../navigation/public';
 
 export interface DiscoverServices {
   addBasePath: (path: string) => string;
@@ -58,6 +59,7 @@ export interface DiscoverServices {
   indexPatterns: IndexPatternsContract;
   inspector: InspectorPublicPluginStart;
   metadata: { branch: string };
+  navigation: NavigationPublicPluginStart;
   share?: SharePluginStart;
   kibanaLegacy: KibanaLegacyStart;
   urlForwarding: UrlForwardingStart;
@@ -65,6 +67,7 @@ export interface DiscoverServices {
   toastNotifications: ToastsStart;
   getSavedSearchById: (id: string) => Promise<SavedSearch>;
   getSavedSearchUrlById: (id: string) => Promise<string>;
+  getEmbeddableInjector: any;
   uiSettings: IUiSettingsClient;
   visualizations: VisualizationsStart;
 }
@@ -72,7 +75,8 @@ export interface DiscoverServices {
 export async function buildServices(
   core: CoreStart,
   plugins: DiscoverStartPlugins,
-  context: PluginInitializerContext
+  context: PluginInitializerContext,
+  getEmbeddableInjector: any
 ): Promise<DiscoverServices> {
   const services: SavedObjectKibanaServices = {
     savedObjectsClient: core.savedObjects.client,
@@ -92,6 +96,7 @@ export async function buildServices(
     docLinks: core.docLinks,
     theme: plugins.charts.theme,
     filterManager: plugins.data.query.filterManager,
+    getEmbeddableInjector,
     getSavedSearchById: async (id: string) => savedObjectService.get(id),
     getSavedSearchUrlById: async (id: string) => savedObjectService.urlFor(id),
     history: getHistory,
@@ -100,6 +105,7 @@ export async function buildServices(
     metadata: {
       branch: context.env.packageInfo.branch,
     },
+    navigation: plugins.navigation,
     share: plugins.share,
     kibanaLegacy: plugins.kibanaLegacy,
     urlForwarding: plugins.urlForwarding,
diff --git a/src/plugins/discover/public/get_inner_angular.ts b/src/plugins/discover/public/get_inner_angular.ts
index 85b0752f13463..1ca0bb20e8723 100644
--- a/src/plugins/discover/public/get_inner_angular.ts
+++ b/src/plugins/discover/public/get_inner_angular.ts
@@ -40,16 +40,10 @@ import { createTableRowDirective } from './application/angular/doc_table/compone
 import { createPagerFactory } from './application/angular/doc_table/lib/pager/pager_factory';
 import { createInfiniteScrollDirective } from './application/angular/doc_table/infinite_scroll';
 import { createDocViewerDirective } from './application/angular/doc_viewer';
-import { CollapsibleSidebarProvider } from './application/angular/directives/collapsible_sidebar/collapsible_sidebar';
-// @ts-ignore
-import { FixedScrollProvider } from './application/angular/directives/fixed_scroll';
-// @ts-ignore
-import { DebounceProviderTimeout } from './application/angular/directives/debounce/debounce';
 import { createRenderCompleteDirective } from './application/angular/directives/render_complete';
 import {
   initAngularBootstrap,
   configureAppAngularModule,
-  KbnAccessibleClickProvider,
   PrivateProvider,
   PromiseServiceCreator,
   registerListenEventListener,
@@ -57,14 +51,10 @@ import {
   createTopNavDirective,
   createTopNavHelper,
 } from '../../kibana_legacy/public';
-import { createDiscoverSidebarDirective } from './application/components/sidebar';
-import { createHitsCounterDirective } from '././application/components/hits_counter';
-import { createLoadingSpinnerDirective } from '././application/components/loading_spinner/loading_spinner';
-import { createTimechartHeaderDirective } from './application/components/timechart_header';
 import { createContextErrorMessageDirective } from './application/components/context_error_message';
 import { DiscoverStartPlugins } from './plugin';
 import { getScopedHistory } from './kibana_services';
-import { createSkipBottomButtonDirective } from './application/components/skip_bottom_button';
+import { createDiscoverLegacyDirective } from './application/components/create_discover_legacy_directive';
 
 /**
  * returns the main inner angular module, it contains all the parts of Angular Discover
@@ -88,11 +78,9 @@ export function getInnerAngularModule(
 export function getInnerAngularModuleEmbeddable(
   name: string,
   core: CoreStart,
-  deps: DiscoverStartPlugins,
-  context: PluginInitializerContext
+  deps: DiscoverStartPlugins
 ) {
-  const module = initializeInnerAngularModule(name, core, deps.navigation, deps.data, true);
-  return module;
+  return initializeInnerAngularModule(name, core, deps.navigation, deps.data, true);
 }
 
 let initialized = false;
@@ -129,8 +117,7 @@ export function initializeInnerAngularModule(
       ])
       .config(watchMultiDecorator)
       .directive('icon', (reactDirective) => reactDirective(EuiIcon))
-      .directive('renderComplete', createRenderCompleteDirective)
-      .service('debounce', ['$timeout', DebounceProviderTimeout]);
+      .directive('renderComplete', createRenderCompleteDirective);
   }
 
   return angular
@@ -149,18 +136,9 @@ export function initializeInnerAngularModule(
     ])
     .config(watchMultiDecorator)
     .run(registerListenEventListener)
-    .directive('icon', (reactDirective) => reactDirective(EuiIcon))
-    .directive('kbnAccessibleClick', KbnAccessibleClickProvider)
-    .directive('collapsibleSidebar', CollapsibleSidebarProvider)
-    .directive('fixedScroll', FixedScrollProvider)
     .directive('renderComplete', createRenderCompleteDirective)
-    .directive('discoverSidebar', createDiscoverSidebarDirective)
-    .directive('skipBottomButton', createSkipBottomButtonDirective)
-    .directive('hitsCounter', createHitsCounterDirective)
-    .directive('loadingSpinner', createLoadingSpinnerDirective)
-    .directive('timechartHeader', createTimechartHeaderDirective)
-    .directive('contextErrorMessage', createContextErrorMessageDirective)
-    .service('debounce', ['$timeout', DebounceProviderTimeout]);
+    .directive('discoverLegacy', createDiscoverLegacyDirective)
+    .directive('contextErrorMessage', createContextErrorMessageDirective);
 }
 
 function createLocalPromiseModule() {
diff --git a/src/plugins/discover/public/plugin.ts b/src/plugins/discover/public/plugin.ts
index dd9b57b568e42..440bd3fdf86d3 100644
--- a/src/plugins/discover/public/plugin.ts
+++ b/src/plugins/discover/public/plugin.ts
@@ -327,7 +327,12 @@ export class DiscoverPlugin
       if (this.servicesInitialized) {
         return { core, plugins };
       }
-      const services = await buildServices(core, plugins, this.initializerContext);
+      const services = await buildServices(
+        core,
+        plugins,
+        this.initializerContext,
+        this.getEmbeddableInjector
+      );
       setServices(services);
       this.servicesInitialized = true;
 
@@ -380,12 +385,7 @@ export class DiscoverPlugin
       const { core, plugins } = await this.initializeServices();
       getServices().kibanaLegacy.loadFontAwesome();
       const { getInnerAngularModuleEmbeddable } = await import('./get_inner_angular');
-      getInnerAngularModuleEmbeddable(
-        embeddableAngularName,
-        core,
-        plugins,
-        this.initializerContext
-      );
+      getInnerAngularModuleEmbeddable(embeddableAngularName, core, plugins);
       const mountpoint = document.createElement('div');
       this.embeddableInjector = angular.bootstrap(mountpoint, [embeddableAngularName]);
     }
diff --git a/src/plugins/discover/public/saved_searches/types.ts b/src/plugins/discover/public/saved_searches/types.ts
index d601d087afcee..13361cb647ddc 100644
--- a/src/plugins/discover/public/saved_searches/types.ts
+++ b/src/plugins/discover/public/saved_searches/types.ts
@@ -28,6 +28,7 @@ export interface SavedSearch {
   columns: string[];
   sort: SortOrder[];
   destroy: () => void;
+  lastSavedTitle?: string;
 }
 export interface SavedSearchLoader {
   get: (id: string) => Promise<SavedSearch>;
diff --git a/test/functional/page_objects/discover_page.ts b/test/functional/page_objects/discover_page.ts
index 5a224d930ee42..7a99509257bf7 100644
--- a/test/functional/page_objects/discover_page.ts
+++ b/test/functional/page_objects/discover_page.ts
@@ -254,7 +254,7 @@ export function DiscoverPageProvider({ getService, getPageObjects }: FtrProvider
     }
 
     public async getSidebarWidth() {
-      const sidebar = await find.byCssSelector('.sidebar-list');
+      const sidebar = await testSubjects.find('discover-sidebar');
       return await sidebar.getAttribute('clientWidth');
     }
 
diff --git a/x-pack/plugins/reporting/server/lib/layouts/preserve_layout.css b/x-pack/plugins/reporting/server/lib/layouts/preserve_layout.css
index 12ac5b27c7a4a..35590df90fbb9 100644
--- a/x-pack/plugins/reporting/server/lib/layouts/preserve_layout.css
+++ b/x-pack/plugins/reporting/server/lib/layouts/preserve_layout.css
@@ -36,7 +36,7 @@ filter-bar,
 /* hide unusable controls */
 discover-app .dscTimechart,
 discover-app .dscSidebar__container,
-discover-app .kbnCollapsibleSidebar__collapseButton,
+discover-app .dscCollapsibleSidebar__collapseButton,
 discover-app .discover-table-footer {
   display: none;
 }
diff --git a/x-pack/plugins/reporting/server/lib/layouts/print.css b/x-pack/plugins/reporting/server/lib/layouts/print.css
index 9b07e3c923138..3ff39974536d2 100644
--- a/x-pack/plugins/reporting/server/lib/layouts/print.css
+++ b/x-pack/plugins/reporting/server/lib/layouts/print.css
@@ -35,7 +35,7 @@ filter-bar,
 /* hide unusable controls */
 discover-app .dscTimechart,
 discover-app .dscSidebar__container,
-discover-app .kbnCollapsibleSidebar__collapseButton,
+discover-app .dscCollapsibleSidebar__collapseButton,
 discover-app .discover-table-footer {
   display: none;
 }
diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json
index 3b7caf7952865..ad997ece9e9f5 100644
--- a/x-pack/plugins/translations/translations/ja-JP.json
+++ b/x-pack/plugins/translations/translations/ja-JP.json
@@ -1430,10 +1430,7 @@
     "discover.localMenu.saveTitle": "保存",
     "discover.localMenu.shareSearchDescription": "検索を共有します",
     "discover.localMenu.shareTitle": "共有",
-    "discover.noResults.addressShardFailuresTitle": "シャードエラーの解決",
     "discover.noResults.expandYourTimeRangeTitle": "時間範囲を拡大",
-    "discover.noResults.indexFailureIndexText": "インデックス {failureIndex}",
-    "discover.noResults.indexFailureShardText": "{index}、シャード {failureShard}",
     "discover.noResults.queryMayNotMatchTitle": "1つ以上の表示されているインデックスに日付フィールドが含まれています。クエリが現在の時間範囲のデータと一致しないか、現在選択された時間範囲にデータが全く存在しない可能性があります。データが存在する時間範囲に変えることができます。",
     "discover.noResults.searchExamples.400to499StatusCodeExampleTitle": "400-499のすべてのステータスコードを検索",
     "discover.noResults.searchExamples.400to499StatusCodeWithPhpExtensionExampleTitle": "400-499のphp拡張子のステータスコードを検索",
@@ -1444,7 +1441,6 @@
     "discover.noResults.searchExamples.queryStringSyntaxLinkText": "クエリ文字列の構文",
     "discover.noResults.searchExamples.refineYourQueryTitle": "クエリの調整",
     "discover.noResults.searchExamples.statusField200StatusCodeExampleTitle": "ステータスフィールドの200を検索",
-    "discover.noResults.shardFailuresDescription": "次のシャードエラーが発生しました。",
     "discover.notifications.invalidTimeRangeText": "指定された時間範囲が無効です。（開始：'{from}'、終了：'{to}'）",
     "discover.notifications.invalidTimeRangeTitle": "無効な時間範囲",
     "discover.notifications.notSavedSearchTitle": "検索「{savedSearchTitle}」は保存されませんでした。",
diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json
index 623061b379397..4a3d86a0dd898 100644
--- a/x-pack/plugins/translations/translations/zh-CN.json
+++ b/x-pack/plugins/translations/translations/zh-CN.json
@@ -1431,10 +1431,7 @@
     "discover.localMenu.saveTitle": "保存",
     "discover.localMenu.shareSearchDescription": "共享搜索",
     "discover.localMenu.shareTitle": "共享",
-    "discover.noResults.addressShardFailuresTitle": "解决分片错误",
     "discover.noResults.expandYourTimeRangeTitle": "展开时间范围",
-    "discover.noResults.indexFailureIndexText": "索引 {failureIndex}",
-    "discover.noResults.indexFailureShardText": "{index}，分片 {failureShard}",
     "discover.noResults.queryMayNotMatchTitle": "您正在查看的一个或多个索引包含日期字段。您的查询在当前时间范围内可能不匹配任何数据，也可能在当前选定的时间范围内没有任何数据。您可以尝试将时间范围更改为包含数据的时间范围。",
     "discover.noResults.searchExamples.400to499StatusCodeExampleTitle": "查找所有介于 400-499 之间的状态代码",
     "discover.noResults.searchExamples.400to499StatusCodeWithPhpExtensionExampleTitle": "查找状态代码 400-499 以及扩展名 php",
@@ -1445,7 +1442,6 @@
     "discover.noResults.searchExamples.queryStringSyntaxLinkText": "查询字符串语法",
     "discover.noResults.searchExamples.refineYourQueryTitle": "优化您的查询",
     "discover.noResults.searchExamples.statusField200StatusCodeExampleTitle": "在状态字段中查找 200",
-    "discover.noResults.shardFailuresDescription": "发生了以下分片错误：",
     "discover.notifications.invalidTimeRangeText": "提供的时间范围无效。（起始：“{from}”，结束：“{to}”）",
     "discover.notifications.invalidTimeRangeTitle": "时间范围无效",
     "discover.notifications.notSavedSearchTitle": "搜索“{savedSearchTitle}”未保存。",

From 94a4fc9350783daa8b23c366b413a3a1b13d6b56 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cau=C3=AA=20Marcondes?=
 <55978943+cauemarcondes@users.noreply.github.com>
Date: Thu, 17 Sep 2020 07:35:33 +0100
Subject: [PATCH 16/19] [APM]fixing y axis on transaction error rate to 100%
 (#77609)

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
---
 .../shared/charts/ErroneousTransactionsRateChart/index.tsx       | 1 +
 1 file changed, 1 insertion(+)

diff --git a/x-pack/plugins/apm/public/components/shared/charts/ErroneousTransactionsRateChart/index.tsx b/x-pack/plugins/apm/public/components/shared/charts/ErroneousTransactionsRateChart/index.tsx
index 85d975870d9bc..e806f556347f1 100644
--- a/x-pack/plugins/apm/public/components/shared/charts/ErroneousTransactionsRateChart/index.tsx
+++ b/x-pack/plugins/apm/public/components/shared/charts/ErroneousTransactionsRateChart/index.tsx
@@ -70,6 +70,7 @@ export function ErroneousTransactionsRateChart() {
       <CustomPlot
         {...syncedChartsProps}
         noHits={data?.noHits}
+        yMax={1}
         series={[
           {
             color: theme.euiColorVis7,

From d548b92479709c6f72336d90ad01e953a1b7446b Mon Sep 17 00:00:00 2001
From: Thomas Watson <w@tson.dk>
Date: Thu, 17 Sep 2020 08:47:01 +0200
Subject: [PATCH 17/19] Bump sharkdown from v0.1.0 to v0.1.1 (#77607)

---
 yarn.lock | 31 +++----------------------------
 1 file changed, 3 insertions(+), 28 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index 1916a336eb984..4f7f687aed530 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -12479,11 +12479,6 @@ expand-tilde@^2.0.0, expand-tilde@^2.0.2:
   dependencies:
     homedir-polyfill "^1.0.1"
 
-expect.js@~0.2.0:
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/expect.js/-/expect.js-0.2.0.tgz#1028533d2c1c363f74a6796ff57ec0520ded2be1"
-  integrity sha1-EChTPSwcNj90pnlv9X7AUg3tK+E=
-
 expect@^24.8.0, expect@^24.9.0:
   version "24.9.0"
   resolved "https://registry.yarnpkg.com/expect/-/expect-24.9.0.tgz#b75165b4817074fa4a157794f46fe9f1ba15b6ca"
@@ -24262,16 +24257,6 @@ readable-stream@1.0, "readable-stream@>=1.0.33-1 <1.1.0-0":
     string_decoder "^1.1.1"
     util-deprecate "^1.0.1"
 
-readable-stream@~1.1.0:
-  version "1.1.14"
-  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.1.14.tgz#7cf4c54ef648e3813084c636dd2079e166c081d9"
-  integrity sha1-fPTFTvZI44EwhMY23SB54WbAgdk=
-  dependencies:
-    core-util-is "~1.0.0"
-    inherits "~2.0.1"
-    isarray "0.0.1"
-    string_decoder "~0.10.x"
-
 readable-stream@~2.0.0:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.0.6.tgz#8f90341e68a53ccc928788dacfcd11b36eb9b78e"
@@ -25966,16 +25951,13 @@ shallowequal@1.1.0, shallowequal@^1.1.0:
   integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
 
 sharkdown@^0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/sharkdown/-/sharkdown-0.1.0.tgz#61d4fe529e75d02442127cc9234362265099214f"
-  integrity sha1-YdT+Up510CRCEnzJI0NiJlCZIU8=
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/sharkdown/-/sharkdown-0.1.1.tgz#64484bd0f08f347f8319e9ff947a670f6b48b1b2"
+  integrity sha512-exwooSpmo5s45lrexgz6Q0rFQM574wYIX3iDZ7RLLqOb7IAoQZu9nxlZODU972g19sR69OIpKP2cpHTzU+PHIg==
   dependencies:
     cardinal "~0.4.2"
-    expect.js "~0.2.0"
     minimist "0.0.5"
     split "~0.2.10"
-    stream-spigot "~2.1.2"
-    through "~2.3.4"
 
 shebang-command@^1.2.0:
   version "1.2.0"
@@ -26751,13 +26733,6 @@ stream-slicer@0.0.6:
   resolved "https://registry.yarnpkg.com/stream-slicer/-/stream-slicer-0.0.6.tgz#f86b2ac5c2440b7a0a87b71f33665c0788046138"
   integrity sha1-+GsqxcJEC3oKh7cfM2ZcB4gEYTg=
 
-stream-spigot@~2.1.2:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/stream-spigot/-/stream-spigot-2.1.2.tgz#7de145e819f8dd0db45090d13dcf73a8ed3cc035"
-  integrity sha1-feFF6Bn43Q20UJDRPc9zqO08wDU=
-  dependencies:
-    readable-stream "~1.1.0"
-
 strict-uri-encode@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz#279b225df1d582b1f54e65addd4352e18faa0713"

From 06e8c547515bf4f4e59a30845758132f3811f143 Mon Sep 17 00:00:00 2001
From: Thomas Watson <w@tson.dk>
Date: Thu, 17 Sep 2020 08:48:06 +0200
Subject: [PATCH 18/19] Bump node-fetch to 2.6.1 (#77445)

---
 package.json                 | 22 +++++++------
 packages/kbn-es/package.json |  2 +-
 x-pack/package.json          |  5 ++-
 yarn.lock                    | 61 ++++++++++++++----------------------
 4 files changed, 38 insertions(+), 52 deletions(-)

diff --git a/package.json b/package.json
index 1395050263fd6..aa7c0968c4920 100644
--- a/package.json
+++ b/package.json
@@ -77,28 +77,30 @@
     "url": "https://github.com/elastic/kibana.git"
   },
   "resolutions": {
-    "**/@types/node": ">=10.17.17 <10.20.0",
-    "**/@types/react": "^16.9.36",
-    "**/@types/hapi": "^17.0.18",
     "**/@types/angular": "^1.6.56",
-    "**/@types/hoist-non-react-statics": "^3.3.1",
     "**/@types/chai": "^4.2.11",
+    "**/@types/hapi": "^17.0.18",
+    "**/@types/hoist-non-react-statics": "^3.3.1",
+    "**/@types/node": ">=10.17.17 <10.20.0",
+    "**/@types/react": "^16.9.36",
+    "**/cross-fetch/node-fetch": "^2.6.1",
     "**/cypress/@types/lodash": "^4.14.159",
     "**/cypress/lodash": "^4.17.20",
-    "**/typescript": "4.0.2",
+    "**/deepmerge": "^4.2.2",
+    "**/fast-deep-equal": "^3.1.1",
     "**/graphql-toolkit/lodash": "^4.17.15",
     "**/hoist-non-react-statics": "^3.3.2",
+    "**/image-diff/gm/debug": "^2.6.9",
+    "**/isomorphic-fetch/node-fetch": "^2.6.1",
     "**/isomorphic-git/**/base64-js": "^1.2.1",
     "**/istanbul-instrumenter-loader/schema-utils": "1.0.0",
-    "**/image-diff/gm/debug": "^2.6.9",
     "**/load-grunt-config/lodash": "^4.17.20",
     "**/node-jose/node-forge": "^0.10.0",
-    "**/react-dom": "^16.12.0",
     "**/react": "^16.12.0",
+    "**/react-dom": "^16.12.0",
     "**/react-test-renderer": "^16.12.0",
     "**/request": "^2.88.2",
-    "**/deepmerge": "^4.2.2",
-    "**/fast-deep-equal": "^3.1.1"
+    "**/typescript": "4.0.2"
   },
   "workspaces": {
     "packages": [
@@ -194,7 +196,7 @@
     "moment": "^2.24.0",
     "moment-timezone": "^0.5.27",
     "mustache": "2.3.2",
-    "node-fetch": "1.7.3",
+    "node-fetch": "2.6.1",
     "node-forge": "^0.10.0",
     "opn": "^5.5.0",
     "oppsy": "^2.0.0",
diff --git a/packages/kbn-es/package.json b/packages/kbn-es/package.json
index dabf11fdd0b66..52ef3fe05e751 100644
--- a/packages/kbn-es/package.json
+++ b/packages/kbn-es/package.json
@@ -14,7 +14,7 @@
     "execa": "^4.0.2",
     "getopts": "^2.2.4",
     "glob": "^7.1.2",
-    "node-fetch": "^2.6.0",
+    "node-fetch": "^2.6.1",
     "simple-git": "^1.91.0",
     "tar-fs": "^2.1.0",
     "tree-kill": "^1.2.2",
diff --git a/x-pack/package.json b/x-pack/package.json
index 59a43b1f344c8..94e072eebec51 100644
--- a/x-pack/package.json
+++ b/x-pack/package.json
@@ -101,7 +101,7 @@
     "@types/mocha": "^7.0.2",
     "@types/nock": "^10.0.3",
     "@types/node": ">=10.17.17 <10.20.0",
-    "@types/node-fetch": "^2.5.0",
+    "@types/node-fetch": "^2.5.7",
     "@types/nodemailer": "^6.2.1",
     "@types/object-hash": "^1.3.0",
     "@types/papaparse": "^5.0.3",
@@ -209,7 +209,6 @@
     "mochawesome-merge": "^4.1.0",
     "mustache": "^2.3.0",
     "mutation-observer": "^1.0.3",
-    "node-fetch": "^2.6.0",
     "null-loader": "^3.0.0",
     "oboe": "^2.1.4",
     "pixelmatch": "^5.1.0",
@@ -345,7 +344,7 @@
     "moment-timezone": "^0.5.27",
     "ngreact": "^0.5.1",
     "nock": "12.0.3",
-    "node-fetch": "^2.6.0",
+    "node-fetch": "^2.6.1",
     "nodemailer": "^4.7.0",
     "object-hash": "^1.3.1",
     "object-path-immutable": "^3.1.1",
diff --git a/yarn.lock b/yarn.lock
index 4f7f687aed530..2aa0844ed46c3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4262,12 +4262,13 @@
   dependencies:
     "@types/node" "*"
 
-"@types/node-fetch@^2.5.0":
-  version "2.5.0"
-  resolved "https://registry.yarnpkg.com/@types/node-fetch/-/node-fetch-2.5.0.tgz#1c55616a4591bdd15a389fbd0da4a55b9502add5"
-  integrity sha512-TLFRywthBgL68auWj+ziWu+vnmmcHCDFC/sqCOQf1xTz4hRq8cu79z8CtHU9lncExGBsB8fXA4TiLDLt6xvMzw==
+"@types/node-fetch@^2.5.7":
+  version "2.5.7"
+  resolved "https://registry.yarnpkg.com/@types/node-fetch/-/node-fetch-2.5.7.tgz#20a2afffa882ab04d44ca786449a276f9f6bbf3c"
+  integrity sha512-o2WVNf5UhWRkxlf6eq+jMZDu7kjgpgJfl4xVNlvryc95O/6F2ld8ztKX+qu+Rjyet93WAWm5LjeX9H5FGkODvw==
   dependencies:
     "@types/node" "*"
+    form-data "^3.0.0"
 
 "@types/node-forge@^0.9.5":
   version "0.9.5"
@@ -9025,10 +9026,10 @@ colorspace@1.1.x:
     color "3.0.x"
     text-hex "1.0.x"
 
-combined-stream@^1.0.6, combined-stream@~1.0.6:
-  version "1.0.7"
-  resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.7.tgz#2d1d24317afb8abe95d6d2c0b07b57813539d828"
-  integrity sha512-brWl9y6vOB1xYPZcpZde3N9zDByXTosAeMDo4p1wzo6UMOX4vumB+TP1RZ76sfE6Md68Q0NJSrE/gbezd4Ul+w==
+combined-stream@^1.0.6, combined-stream@^1.0.8, combined-stream@~1.0.6:
+  version "1.0.8"
+  resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.8.tgz#c3d45a8b34fd730631a110a8a2520682b31d5a7f"
+  integrity sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==
   dependencies:
     delayed-stream "~1.0.0"
 
@@ -11420,13 +11421,6 @@ encodeurl@^1.0.2, encodeurl@~1.0.2:
   resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
   integrity sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k=
 
-encoding@^0.1.11:
-  version "0.1.12"
-  resolved "https://registry.yarnpkg.com/encoding/-/encoding-0.1.12.tgz#538b66f3ee62cd1ab51ec323829d1f9480c74beb"
-  integrity sha1-U4tm8+5izRq1HsMjgp0flIDHS+s=
-  dependencies:
-    iconv-lite "~0.4.13"
-
 end-of-stream@^1.0.0, end-of-stream@^1.1.0, end-of-stream@^1.4.1, end-of-stream@^1.4.4:
   version "1.4.4"
   resolved "https://registry.yarnpkg.com/end-of-stream/-/end-of-stream-1.4.4.tgz#5ae64a5f45057baf3626ec14da0ca5e4b2431eb0"
@@ -13390,6 +13384,15 @@ form-data@^2.5.0:
     combined-stream "^1.0.6"
     mime-types "^2.1.12"
 
+form-data@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/form-data/-/form-data-3.0.0.tgz#31b7e39c85f1355b7139ee0c647cf0de7f83c682"
+  integrity sha512-CKMFDglpbMi6PyN+brwB9Q/GOw0eAnsrEZDgcsH5Krhz5Od/haKHAX0NmQfha2zPPz0JpWzA7GJHGSnvCRLWsg==
+  dependencies:
+    asynckit "^0.4.0"
+    combined-stream "^1.0.8"
+    mime-types "^2.1.12"
+
 format@^0.2.0:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/format/-/format-0.2.2.tgz#d6170107e9efdc4ed30c9dc39016df942b5cb58b"
@@ -16796,7 +16799,7 @@ is-ssh@^1.3.0:
   dependencies:
     protocols "^1.1.0"
 
-is-stream@^1.0.0, is-stream@^1.0.1, is-stream@^1.1.0:
+is-stream@^1.0.0, is-stream@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44"
   integrity sha1-EtSj3U5o4Lec6428hBc66A2RykQ=
@@ -20613,28 +20616,10 @@ node-environment-flags@1.0.6:
     object.getownpropertydescriptors "^2.0.3"
     semver "^5.7.0"
 
-node-fetch@1.7.3, node-fetch@^1.0.1:
-  version "1.7.3"
-  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef"
-  integrity sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==
-  dependencies:
-    encoding "^0.1.11"
-    is-stream "^1.0.1"
-
-node-fetch@2.1.2:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.1.2.tgz#ab884e8e7e57e38a944753cec706f788d1768bb5"
-  integrity sha1-q4hOjn5X44qUR1POxwb3iNF2i7U=
-
-node-fetch@^2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.3.0.tgz#1a1d940bbfb916a1d3e0219f037e89e71f8c5fa5"
-  integrity sha512-MOd8pV3fxENbryESLgVIeaGKrdl+uaYhCSSVkjeOb/31/njTpcis5aWfdqgNlHIrKOLRbMnfPINPOML2CIFeXA==
-
-node-fetch@^2.6.0:
-  version "2.6.0"
-  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.0.tgz#e633456386d4aa55863f676a7ab0daa8fdecb0fd"
-  integrity sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA==
+node-fetch@2.1.2, node-fetch@2.6.1, node-fetch@^1.0.1, node-fetch@^2.3.0, node-fetch@^2.6.0, node-fetch@^2.6.1:
+  version "2.6.1"
+  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.1.tgz#045bd323631f76ed2e2b55573394416b639a0052"
+  integrity sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw==
 
 node-forge@0.9.0:
   version "0.9.0"

From ae55391035909bc146c5c17ebcb03a39f42eb388 Mon Sep 17 00:00:00 2001
From: James Gowdy <jgowdy@elastic.co>
Date: Thu, 17 Sep 2020 09:00:49 +0100
Subject: [PATCH 19/19] [ML] Adding option to create AD jobs without starting
 the datafeed (#77484)

* [ML] Adding option to create AD jobs without starting the datafeed

* changing translation id

* i just need some space

* adding missed spelling change

* disabling switch when running

* improving logic

* further test improvements

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
---
 .../common/job_creator/util/general.ts        |   9 +-
 .../components/start_datafeed_switch/index.ts |   7 +
 .../start_datafeed_switch.tsx                 |  44 +++++
 .../pages/components/summary_step/summary.tsx |  25 ++-
 .../anomaly_detection/categorization_job.ts   |   4 +-
 .../apps/ml/anomaly_detection/index.ts        |   1 +
 .../ml/anomaly_detection/multi_metric_job.ts  |   4 +-
 .../ml/anomaly_detection/population_job.ts    |   4 +-
 .../ml/anomaly_detection/saved_search_job.ts  |   2 +-
 .../ml/anomaly_detection/single_metric_job.ts |   4 +-
 ...ingle_metric_job_without_datafeed_start.ts | 151 ++++++++++++++++++
 .../services/ml/job_wizard_common.ts          |  36 +++++
 12 files changed, 273 insertions(+), 18 deletions(-)
 create mode 100644 x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/components/start_datafeed_switch/index.ts
 create mode 100644 x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/components/start_datafeed_switch/start_datafeed_switch.tsx
 create mode 100644 x-pack/test/functional/apps/ml/anomaly_detection/single_metric_job_without_datafeed_start.ts

diff --git a/x-pack/plugins/ml/public/application/jobs/new_job/common/job_creator/util/general.ts b/x-pack/plugins/ml/public/application/jobs/new_job/common/job_creator/util/general.ts
index 8ab45dc24aa17..440585dcf2a19 100644
--- a/x-pack/plugins/ml/public/application/jobs/new_job/common/job_creator/util/general.ts
+++ b/x-pack/plugins/ml/public/application/jobs/new_job/common/job_creator/util/general.ts
@@ -268,8 +268,13 @@ export function resetJob(jobCreator: JobCreatorType, navigateToPath: NavigateToP
   navigateToPath('/jobs/new_job');
 }
 
-export function advancedStartDatafeed(jobCreator: JobCreatorType, navigateToPath: NavigateToPath) {
-  stashCombinedJob(jobCreator, false, false);
+export function advancedStartDatafeed(
+  jobCreator: JobCreatorType | null,
+  navigateToPath: NavigateToPath
+) {
+  if (jobCreator !== null) {
+    stashCombinedJob(jobCreator, false, false);
+  }
   navigateToPath('/jobs');
 }
 
diff --git a/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/components/start_datafeed_switch/index.ts b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/components/start_datafeed_switch/index.ts
new file mode 100644
index 0000000000000..a62e378222ff9
--- /dev/null
+++ b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/components/start_datafeed_switch/index.ts
@@ -0,0 +1,7 @@
+/*
+ * 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.
+ */
+
+export { StartDatafeedSwitch } from './start_datafeed_switch';
diff --git a/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/components/start_datafeed_switch/start_datafeed_switch.tsx b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/components/start_datafeed_switch/start_datafeed_switch.tsx
new file mode 100644
index 0000000000000..4aa78cfc41009
--- /dev/null
+++ b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/components/start_datafeed_switch/start_datafeed_switch.tsx
@@ -0,0 +1,44 @@
+/*
+ * 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 { i18n } from '@kbn/i18n';
+import { EuiSwitch, EuiFormRow, EuiSpacer } from '@elastic/eui';
+interface Props {
+  startDatafeed: boolean;
+  setStartDatafeed(start: boolean): void;
+  disabled?: boolean;
+}
+
+export const StartDatafeedSwitch: FC<Props> = ({
+  startDatafeed,
+  setStartDatafeed,
+  disabled = false,
+}) => {
+  return (
+    <>
+      <EuiSpacer />
+      <EuiFormRow
+        helpText={i18n.translate(
+          'xpack.ml.newJob.wizard.summaryStep.startDatafeedCheckboxHelpText',
+          {
+            defaultMessage: 'If unselected, job can be started later from the jobs list.',
+          }
+        )}
+      >
+        <EuiSwitch
+          data-test-subj="mlJobWizardStartDatafeedCheckbox"
+          label={i18n.translate('xpack.ml.newJob.wizard.summaryStep.startDatafeedCheckbox', {
+            defaultMessage: 'Start immediately',
+          })}
+          checked={startDatafeed}
+          onChange={(e) => setStartDatafeed(e.target.checked)}
+          disabled={disabled}
+        />
+      </EuiFormRow>
+    </>
+  );
+};
diff --git a/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/summary.tsx b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/summary.tsx
index 3000ce8449138..669b8837e74b5 100644
--- a/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/summary.tsx
+++ b/x-pack/plugins/ml/public/application/jobs/new_job/pages/components/summary_step/summary.tsx
@@ -28,6 +28,7 @@ import { DatafeedDetails } from './components/datafeed_details';
 import { DetectorChart } from './components/detector_chart';
 import { JobProgress } from './components/job_progress';
 import { PostSaveOptions } from './components/post_save_options';
+import { StartDatafeedSwitch } from './components/start_datafeed_switch';
 import { toastNotificationServiceProvider } from '../../../../../services/toast_notification_service';
 import {
   convertToAdvancedJob,
@@ -50,6 +51,7 @@ export const SummaryStep: FC<StepProps> = ({ setCurrentStep, isCurrentStep }) =>
   const [creatingJob, setCreatingJob] = useState(false);
   const [isValid, setIsValid] = useState(jobValidator.validationSummary.basic);
   const [jobRunner, setJobRunner] = useState<JobRunner | null>(null);
+  const [startDatafeed, setStartDatafeed] = useState(true);
 
   const isAdvanced = isAdvancedJobCreator(jobCreator);
   const jsonEditorMode = isAdvanced ? EDITOR_MODE.EDITABLE : EDITOR_MODE.READONLY;
@@ -59,15 +61,17 @@ export const SummaryStep: FC<StepProps> = ({ setCurrentStep, isCurrentStep }) =>
   }, []);
 
   async function start() {
+    setCreatingJob(true);
     if (isAdvanced) {
-      await startAdvanced();
+      await createAdvancedJob();
+    } else if (startDatafeed === true) {
+      await createAndStartJob();
     } else {
-      await startInline();
+      await createAdvancedJob(false);
     }
   }
 
-  async function startInline() {
-    setCreatingJob(true);
+  async function createAndStartJob() {
     try {
       const jr = await jobCreator.createAndStartJob();
       setJobRunner(jr);
@@ -76,12 +80,11 @@ export const SummaryStep: FC<StepProps> = ({ setCurrentStep, isCurrentStep }) =>
     }
   }
 
-  async function startAdvanced() {
-    setCreatingJob(true);
+  async function createAdvancedJob(showStartModal: boolean = true) {
     try {
       await jobCreator.createJob();
       await jobCreator.createDatafeed();
-      advancedStartDatafeed(jobCreator, navigateToPath);
+      advancedStartDatafeed(showStartModal ? jobCreator : null, navigateToPath);
     } catch (error) {
       handleJobCreationError(error);
     }
@@ -131,6 +134,14 @@ export const SummaryStep: FC<StepProps> = ({ setCurrentStep, isCurrentStep }) =>
           <EuiSpacer size="m" />
           <JobDetails />
 
+          {isAdvanced === false && (
+            <StartDatafeedSwitch
+              startDatafeed={startDatafeed}
+              setStartDatafeed={setStartDatafeed}
+              disabled={creatingJob}
+            />
+          )}
+
           {isAdvanced && (
             <Fragment>
               <EuiHorizontalRule />
diff --git a/x-pack/test/functional/apps/ml/anomaly_detection/categorization_job.ts b/x-pack/test/functional/apps/ml/anomaly_detection/categorization_job.ts
index 2524d0486171b..d3de41689244b 100644
--- a/x-pack/test/functional/apps/ml/anomaly_detection/categorization_job.ts
+++ b/x-pack/test/functional/apps/ml/anomaly_detection/categorization_job.ts
@@ -108,7 +108,7 @@ export default function ({ getService }: FtrProviderContext) {
       await ml.testExecution.logTestStep('job creation displays the time range step');
       await ml.jobWizardCommon.assertTimeRangeSectionExists();
 
-      await ml.testExecution.logTestStep('job creation sets the timerange');
+      await ml.testExecution.logTestStep('job creation sets the time range');
       await ml.jobWizardCommon.clickUseFullDataButton(
         'Apr 5, 2019 @ 11:25:35.770',
         'Nov 21, 2019 @ 06:01:13.914'
@@ -230,7 +230,7 @@ export default function ({ getService }: FtrProviderContext) {
       await ml.testExecution.logTestStep('job cloning displays the time range step');
       await ml.jobWizardCommon.assertTimeRangeSectionExists();
 
-      await ml.testExecution.logTestStep('job cloning sets the timerange');
+      await ml.testExecution.logTestStep('job cloning sets the time range');
       await ml.jobWizardCommon.clickUseFullDataButton(
         'Apr 5, 2019 @ 11:25:35.770',
         'Nov 21, 2019 @ 06:01:13.914'
diff --git a/x-pack/test/functional/apps/ml/anomaly_detection/index.ts b/x-pack/test/functional/apps/ml/anomaly_detection/index.ts
index 0983ebd79dd90..07ffef62ce3c0 100644
--- a/x-pack/test/functional/apps/ml/anomaly_detection/index.ts
+++ b/x-pack/test/functional/apps/ml/anomaly_detection/index.ts
@@ -10,6 +10,7 @@ export default function ({ loadTestFile }: FtrProviderContext) {
     this.tags(['skipFirefox']);
 
     loadTestFile(require.resolve('./single_metric_job'));
+    loadTestFile(require.resolve('./single_metric_job_without_datafeed_start'));
     loadTestFile(require.resolve('./multi_metric_job'));
     loadTestFile(require.resolve('./population_job'));
     loadTestFile(require.resolve('./saved_search_job'));
diff --git a/x-pack/test/functional/apps/ml/anomaly_detection/multi_metric_job.ts b/x-pack/test/functional/apps/ml/anomaly_detection/multi_metric_job.ts
index 5324890b269bc..0964be83f628b 100644
--- a/x-pack/test/functional/apps/ml/anomaly_detection/multi_metric_job.ts
+++ b/x-pack/test/functional/apps/ml/anomaly_detection/multi_metric_job.ts
@@ -104,7 +104,7 @@ export default function ({ getService }: FtrProviderContext) {
       await ml.testExecution.logTestStep('job creation displays the time range step');
       await ml.jobWizardCommon.assertTimeRangeSectionExists();
 
-      await ml.testExecution.logTestStep('job creation sets the timerange');
+      await ml.testExecution.logTestStep('job creation sets the time range');
       await ml.jobWizardCommon.clickUseFullDataButton(
         'Feb 7, 2016 @ 00:00:00.000',
         'Feb 11, 2016 @ 23:59:54.000'
@@ -235,7 +235,7 @@ export default function ({ getService }: FtrProviderContext) {
       await ml.testExecution.logTestStep('job cloning displays the time range step');
       await ml.jobWizardCommon.assertTimeRangeSectionExists();
 
-      await ml.testExecution.logTestStep('job cloning sets the timerange');
+      await ml.testExecution.logTestStep('job cloning sets the time range');
       await ml.jobWizardCommon.clickUseFullDataButton(
         'Feb 7, 2016 @ 00:00:00.000',
         'Feb 11, 2016 @ 23:59:54.000'
diff --git a/x-pack/test/functional/apps/ml/anomaly_detection/population_job.ts b/x-pack/test/functional/apps/ml/anomaly_detection/population_job.ts
index 4797334ee57af..6b914f0c2ba07 100644
--- a/x-pack/test/functional/apps/ml/anomaly_detection/population_job.ts
+++ b/x-pack/test/functional/apps/ml/anomaly_detection/population_job.ts
@@ -118,7 +118,7 @@ export default function ({ getService }: FtrProviderContext) {
       await ml.testExecution.logTestStep('job creation displays the time range step');
       await ml.jobWizardCommon.assertTimeRangeSectionExists();
 
-      await ml.testExecution.logTestStep('job creation sets the timerange');
+      await ml.testExecution.logTestStep('job creation sets the time range');
       await ml.jobWizardCommon.clickUseFullDataButton(
         'Jun 12, 2019 @ 00:04:19.000',
         'Jul 12, 2019 @ 23:45:36.000'
@@ -261,7 +261,7 @@ export default function ({ getService }: FtrProviderContext) {
       await ml.testExecution.logTestStep('job cloning displays the time range step');
       await ml.jobWizardCommon.assertTimeRangeSectionExists();
 
-      await ml.testExecution.logTestStep('job cloning sets the timerange');
+      await ml.testExecution.logTestStep('job cloning sets the time range');
       await ml.jobWizardCommon.clickUseFullDataButton(
         'Jun 12, 2019 @ 00:04:19.000',
         'Jul 12, 2019 @ 23:45:36.000'
diff --git a/x-pack/test/functional/apps/ml/anomaly_detection/saved_search_job.ts b/x-pack/test/functional/apps/ml/anomaly_detection/saved_search_job.ts
index ea3a42e2f27c8..f5f416411f175 100644
--- a/x-pack/test/functional/apps/ml/anomaly_detection/saved_search_job.ts
+++ b/x-pack/test/functional/apps/ml/anomaly_detection/saved_search_job.ts
@@ -306,7 +306,7 @@ export default function ({ getService }: FtrProviderContext) {
           await ml.testExecution.logTestStep('job creation displays the time range step');
           await ml.jobWizardCommon.assertTimeRangeSectionExists();
 
-          await ml.testExecution.logTestStep('job creation sets the timerange');
+          await ml.testExecution.logTestStep('job creation sets the time range');
           await ml.jobWizardCommon.clickUseFullDataButton(
             'Feb 7, 2016 @ 00:00:00.000',
             'Feb 11, 2016 @ 23:59:54.000'
diff --git a/x-pack/test/functional/apps/ml/anomaly_detection/single_metric_job.ts b/x-pack/test/functional/apps/ml/anomaly_detection/single_metric_job.ts
index 89612e51eee13..dd6310b67d844 100644
--- a/x-pack/test/functional/apps/ml/anomaly_detection/single_metric_job.ts
+++ b/x-pack/test/functional/apps/ml/anomaly_detection/single_metric_job.ts
@@ -103,7 +103,7 @@ export default function ({ getService }: FtrProviderContext) {
       await ml.testExecution.logTestStep('job creation displays the time range step');
       await ml.jobWizardCommon.assertTimeRangeSectionExists();
 
-      await ml.testExecution.logTestStep('job creation sets the timerange');
+      await ml.testExecution.logTestStep('job creation sets the time range');
       await ml.jobWizardCommon.clickUseFullDataButton(
         'Feb 7, 2016 @ 00:00:00.000',
         'Feb 11, 2016 @ 23:59:54.000'
@@ -212,7 +212,7 @@ export default function ({ getService }: FtrProviderContext) {
       await ml.testExecution.logTestStep('job cloning displays the time range step');
       await ml.jobWizardCommon.assertTimeRangeSectionExists();
 
-      await ml.testExecution.logTestStep('job cloning sets the timerange');
+      await ml.testExecution.logTestStep('job cloning sets the time range');
       await ml.jobWizardCommon.clickUseFullDataButton(
         'Feb 7, 2016 @ 00:00:00.000',
         'Feb 11, 2016 @ 23:59:54.000'
diff --git a/x-pack/test/functional/apps/ml/anomaly_detection/single_metric_job_without_datafeed_start.ts b/x-pack/test/functional/apps/ml/anomaly_detection/single_metric_job_without_datafeed_start.ts
new file mode 100644
index 0000000000000..73a11294b97b1
--- /dev/null
+++ b/x-pack/test/functional/apps/ml/anomaly_detection/single_metric_job_without_datafeed_start.ts
@@ -0,0 +1,151 @@
+/*
+ * 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 { FtrProviderContext } from '../../../ftr_provider_context';
+
+export default function ({ getService }: FtrProviderContext) {
+  const esArchiver = getService('esArchiver');
+  const ml = getService('ml');
+
+  const jobId = `fq_single_1_${Date.now()}`;
+  const aggAndFieldIdentifier = 'Mean(responsetime)';
+  const bucketSpan = '30m';
+
+  function getExpectedRow(expectedJobId: string) {
+    return {
+      id: expectedJobId,
+      description: '',
+      jobGroups: [],
+      recordCount: '0',
+      memoryStatus: 'ok',
+      jobState: 'closed',
+      datafeedState: 'stopped',
+      latestTimestamp: '',
+    };
+  }
+
+  function getExpectedCounts(expectedJobId: string) {
+    return {
+      job_id: expectedJobId,
+      processed_record_count: '0',
+      processed_field_count: '0',
+      input_bytes: '0.0 B',
+      input_field_count: '0',
+      invalid_date_count: '0',
+      missing_field_count: '0',
+      out_of_order_timestamp_count: '0',
+      empty_bucket_count: '0',
+      sparse_bucket_count: '0',
+      bucket_count: '0',
+    };
+  }
+
+  function getExpectedModelSizeStats(expectedJobId: string) {
+    return {
+      job_id: expectedJobId,
+      result_type: 'model_size_stats',
+      total_by_field_count: '0',
+      total_over_field_count: '0',
+      total_partition_field_count: '0',
+      bucket_allocation_failures_count: '0',
+      memory_status: 'ok',
+    };
+  }
+
+  describe('single metric without datafeed start', function () {
+    this.tags(['mlqa']);
+    before(async () => {
+      await esArchiver.loadIfNeeded('ml/farequote');
+      await ml.testResources.createIndexPatternIfNeeded('ft_farequote', '@timestamp');
+      await ml.testResources.setKibanaTimeZoneToUTC();
+
+      await ml.securityUI.loginAsMlPowerUser();
+    });
+
+    after(async () => {
+      await ml.api.cleanMlIndices();
+    });
+
+    it('job creation loads the single metric wizard for the source data', async () => {
+      await ml.testExecution.logTestStep('job creation loads the job management page');
+      await ml.navigation.navigateToMl();
+      await ml.navigation.navigateToJobManagement();
+
+      await ml.testExecution.logTestStep('job creation loads the new job source selection page');
+      await ml.jobManagement.navigateToNewJobSourceSelection();
+
+      await ml.testExecution.logTestStep('job creation loads the job type selection page');
+      await ml.jobSourceSelection.selectSourceForAnomalyDetectionJob('ft_farequote');
+
+      await ml.testExecution.logTestStep('job creation loads the single metric job wizard page');
+      await ml.jobTypeSelection.selectSingleMetricJob();
+    });
+
+    it('job creation navigates through the single metric wizard and sets all needed fields', async () => {
+      await ml.testExecution.logTestStep('job creation displays the time range step');
+      await ml.jobWizardCommon.assertTimeRangeSectionExists();
+
+      await ml.testExecution.logTestStep('job creation sets the time range');
+      await ml.jobWizardCommon.clickUseFullDataButton(
+        'Feb 7, 2016 @ 00:00:00.000',
+        'Feb 11, 2016 @ 23:59:54.000'
+      );
+
+      await ml.testExecution.logTestStep('job creation displays the event rate chart');
+      await ml.jobWizardCommon.assertEventRateChartExists();
+      await ml.jobWizardCommon.assertEventRateChartHasData();
+
+      await ml.testExecution.logTestStep('job creation displays the pick fields step');
+      await ml.jobWizardCommon.advanceToPickFieldsSection();
+
+      await ml.testExecution.logTestStep('job creation selects field and aggregation');
+      await ml.jobWizardCommon.assertAggAndFieldInputExists();
+      await ml.jobWizardCommon.selectAggAndField(aggAndFieldIdentifier, true);
+      await ml.jobWizardCommon.assertAnomalyChartExists('LINE');
+
+      await ml.testExecution.logTestStep('job creation inputs the bucket span');
+      await ml.jobWizardCommon.assertBucketSpanInputExists();
+      await ml.jobWizardCommon.setBucketSpan(bucketSpan);
+
+      await ml.testExecution.logTestStep('job creation displays the job details step');
+      await ml.jobWizardCommon.advanceToJobDetailsSection();
+
+      await ml.testExecution.logTestStep('job creation inputs the job id');
+      await ml.jobWizardCommon.assertJobIdInputExists();
+      await ml.jobWizardCommon.setJobId(jobId);
+
+      await ml.testExecution.logTestStep('job creation displays the validation step');
+      await ml.jobWizardCommon.advanceToValidationSection();
+
+      await ml.testExecution.logTestStep('job creation displays the summary step');
+      await ml.jobWizardCommon.advanceToSummarySection();
+    });
+
+    it('job creation runs the job and displays it correctly in the job list', async () => {
+      await ml.testExecution.logTestStep('job creation creates the job and finishes processing');
+
+      await ml.jobWizardCommon.assertStartDatafeedSwitchExists();
+      await ml.jobWizardCommon.toggleStartDatafeedSwitch(false);
+
+      await ml.jobWizardCommon.assertCreateJobButtonExists();
+      await ml.jobWizardCommon.createJobWithoutDatafeedStart();
+
+      await ml.jobTable.waitForJobsToLoad();
+      await ml.jobTable.filterWithSearchString(jobId, 1);
+
+      await ml.testExecution.logTestStep(
+        'job creation displays details for the created job in the job list'
+      );
+      await ml.jobTable.assertJobRowFields(jobId, getExpectedRow(jobId));
+
+      await ml.jobTable.assertJobRowDetailsCounts(
+        jobId,
+        getExpectedCounts(jobId),
+        getExpectedModelSizeStats(jobId)
+      );
+    });
+  });
+}
diff --git a/x-pack/test/functional/services/ml/job_wizard_common.ts b/x-pack/test/functional/services/ml/job_wizard_common.ts
index 97253c5f45303..4ccd08c75397b 100644
--- a/x-pack/test/functional/services/ml/job_wizard_common.ts
+++ b/x-pack/test/functional/services/ml/job_wizard_common.ts
@@ -335,6 +335,37 @@ export function MachineLearningJobWizardCommonProvider(
       }
     },
 
+    async assertStartDatafeedSwitchExists() {
+      const subj = 'mlJobWizardStartDatafeedCheckbox';
+      await testSubjects.existOrFail(subj, { allowHidden: true });
+    },
+
+    async getStartDatafeedSwitchCheckedState(): Promise<boolean> {
+      const subj = 'mlJobWizardStartDatafeedCheckbox';
+      const isSelected = await testSubjects.getAttribute(subj, 'aria-checked');
+      return isSelected === 'true';
+    },
+
+    async assertStartDatafeedSwitchCheckedState(expectedValue: boolean) {
+      const actualCheckedState = await this.getStartDatafeedSwitchCheckedState();
+      expect(actualCheckedState).to.eql(
+        expectedValue,
+        `Expected start datafeed switch to be '${expectedValue ? 'enabled' : 'disabled'}' (got '${
+          actualCheckedState ? 'enabled' : 'disabled'
+        }')`
+      );
+    },
+
+    async toggleStartDatafeedSwitch(toggle: boolean) {
+      const subj = 'mlJobWizardStartDatafeedCheckbox';
+      if ((await this.getStartDatafeedSwitchCheckedState()) !== toggle) {
+        await retry.tryForTime(5 * 1000, async () => {
+          await testSubjects.clickWhenNotDisabled(subj);
+          await this.assertStartDatafeedSwitchCheckedState(toggle);
+        });
+      }
+    },
+
     async assertModelMemoryLimitInputExists(
       sectionOptions: SectionOptions = { withAdvancedSection: true }
     ) {
@@ -510,5 +541,10 @@ export function MachineLearningJobWizardCommonProvider(
       await testSubjects.clickWhenNotDisabled('mlJobWizardButtonCreateJob');
       await testSubjects.existOrFail('mlJobWizardButtonRunInRealTime', { timeout: 2 * 60 * 1000 });
     },
+
+    async createJobWithoutDatafeedStart() {
+      await testSubjects.clickWhenNotDisabled('mlJobWizardButtonCreateJob');
+      await testSubjects.existOrFail('mlPageJobManagement');
+    },
   };
 }