[Logs and Metrics UI] Initial setup for registering observability ove…

…rview data fetchers (#69999) * Switches mount callbacks to only use start deps Fixes #58014 * Sets up skeleton logs data fetchers for overview * Fixes type hacks for logs fetcher * Prevent kibana from crashing on initial load * Fixes types and linting errors * Fixes some linting import/export issues Co-authored-by: Alejandro Fernández Gómez <[email protected]>
elastic · Jun 30, 2020 · bb7bc78 · bb7bc78
1 parent 2118439
commit bb7bc78
Show file tree

Hide file tree

Showing 16 changed files with 201 additions and 90 deletions.
diff --git a/src/plugins/usage_collection/public/index.ts b/src/plugins/usage_collection/public/index.ts
@@ -21,7 +21,7 @@ import { PluginInitializerContext } from '../../../core/public';
 import { UsageCollectionPlugin } from './plugin';
 
 export { METRIC_TYPE } from '@kbn/analytics';
-export { UsageCollectionSetup } from './plugin';
+export { UsageCollectionSetup, UsageCollectionStart } from './plugin';
 
 export function plugin(initializerContext: PluginInitializerContext) {
   return new UsageCollectionPlugin(initializerContext);

diff --git a/x-pack/plugins/apm/public/services/rest/observability_dashboard.ts b/x-pack/plugins/apm/public/services/rest/observability_dashboard.ts
@@ -6,9 +6,10 @@
 
 import { i18n } from '@kbn/i18n';
 import { sum } from 'lodash';
-// eslint-disable-next-line @kbn/eslint/no-restricted-paths
-import { FetchDataParams } from '../../../../observability/public/data_handler';
-import { ApmFetchDataResponse } from '../../../../observability/public/typings/fetch_data_response';
+import {
+  ApmFetchDataResponse,
+  FetchDataParams,
+} from '../../../../observability/public';
 import { callApmApi } from './createCallApmApi';
 import { Theme } from '../../utils/get_theme';
 

diff --git a/x-pack/plugins/apm/server/lib/observability_dashboard/get_transaction_coordinates.ts b/x-pack/plugins/apm/server/lib/observability_dashboard/get_transaction_coordinates.ts
@@ -9,7 +9,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 import { rangeFilter } from '../../../common/utils/range_filter';
-import { Coordinates } from '../../../../observability/public/typings/fetch_data_response';
+import { Coordinates } from '../../../../observability/public';
 import { PROCESSOR_EVENT } from '../../../common/elasticsearch_fieldnames';
 import { Setup, SetupTimeRange } from '../helpers/setup_request';
 import { ProcessorEvent } from '../../../common/processor_event';

diff --git a/x-pack/plugins/infra/kibana.json b/x-pack/plugins/infra/kibana.json
@@ -13,9 +13,7 @@
     "alerts",
     "triggers_actions_ui"
   ],
-  "optionalPlugins": [
-    "ml"
-  ],
+  "optionalPlugins": ["ml", "observability"],
   "server": true,
   "ui": true,
   "configPath": ["xpack", "infra"]

diff --git a/x-pack/plugins/infra/public/apps/common_providers.tsx b/x-pack/plugins/infra/public/apps/common_providers.tsx
@@ -12,7 +12,7 @@ import {
   KibanaContextProvider,
 } from '../../../../../src/plugins/kibana_react/public';
 import { TriggersActionsProvider } from '../utils/triggers_actions_context';
-import { ClientPluginDeps } from '../types';
+import { InfraClientStartDeps } from '../types';
 import { TriggersAndActionsUIPublicPluginStart } from '../../../triggers_actions_ui/public';
 import { ApolloClientContext } from '../utils/apollo_context';
 import { EuiThemeProvider } from '../../../observability/public';
@@ -37,7 +37,7 @@ export const CommonInfraProviders: React.FC<{
 
 export const CoreProviders: React.FC<{
   core: CoreStart;
-  plugins: ClientPluginDeps;
+  plugins: InfraClientStartDeps;
 }> = ({ children, core, plugins }) => {
   return (
     <KibanaContextProvider services={{ ...core, ...plugins }}>

diff --git a/x-pack/plugins/infra/public/apps/logs_app.tsx b/x-pack/plugins/infra/public/apps/logs_app.tsx
@@ -15,14 +15,14 @@ import '../index.scss';
 import { NotFoundPage } from '../pages/404';
 import { LinkToLogsPage } from '../pages/link_to/link_to_logs';
 import { LogsPage } from '../pages/logs';
-import { ClientPluginDeps } from '../types';
+import { InfraClientStartDeps } from '../types';
 import { createApolloClient } from '../utils/apollo_client';
 import { CommonInfraProviders, CoreProviders } from './common_providers';
 import { prepareMountElement } from './common_styles';
 
 export const renderApp = (
   core: CoreStart,
-  plugins: ClientPluginDeps,
+  plugins: InfraClientStartDeps,
   { element, history }: AppMountParameters
 ) => {
   const apolloClient = createApolloClient(core.http.fetch);
@@ -43,7 +43,7 @@ const LogsApp: React.FC<{
   apolloClient: ApolloClient<{}>;
   core: CoreStart;
   history: History<unknown>;
-  plugins: ClientPluginDeps;
+  plugins: InfraClientStartDeps;
 }> = ({ apolloClient, core, history, plugins }) => {
   const uiCapabilities = core.application.capabilities;
 

diff --git a/x-pack/plugins/infra/public/apps/metrics_app.tsx b/x-pack/plugins/infra/public/apps/metrics_app.tsx
@@ -16,15 +16,15 @@ import { NotFoundPage } from '../pages/404';
 import { LinkToMetricsPage } from '../pages/link_to/link_to_metrics';
 import { InfrastructurePage } from '../pages/metrics';
 import { MetricDetail } from '../pages/metrics/metric_detail';
-import { ClientPluginDeps } from '../types';
+import { InfraClientStartDeps } from '../types';
 import { createApolloClient } from '../utils/apollo_client';
 import { RedirectWithQueryParams } from '../utils/redirect_with_query_params';
 import { CommonInfraProviders, CoreProviders } from './common_providers';
 import { prepareMountElement } from './common_styles';
 
 export const renderApp = (
   core: CoreStart,
-  plugins: ClientPluginDeps,
+  plugins: InfraClientStartDeps,
   { element, history }: AppMountParameters
 ) => {
   const apolloClient = createApolloClient(core.http.fetch);
@@ -45,7 +45,7 @@ const MetricsApp: React.FC<{
   apolloClient: ApolloClient<{}>;
   core: CoreStart;
   history: History<unknown>;
-  plugins: ClientPluginDeps;
+  plugins: InfraClientStartDeps;
 }> = ({ apolloClient, core, history, plugins }) => {
   const uiCapabilities = core.application.capabilities;
 

diff --git a/x-pack/plugins/infra/public/index.ts b/x-pack/plugins/infra/public/index.ts
@@ -5,14 +5,19 @@
  */
 
 import { PluginInitializer, PluginInitializerContext } from 'kibana/public';
-import { ClientSetup, ClientStart, Plugin } from './plugin';
-import { ClientPluginsSetup, ClientPluginsStart } from './types';
+import { Plugin } from './plugin';
+import {
+  InfraClientSetupExports,
+  InfraClientStartExports,
+  InfraClientSetupDeps,
+  InfraClientStartDeps,
+} from './types';
 
 export const plugin: PluginInitializer<
-  ClientSetup,
-  ClientStart,
-  ClientPluginsSetup,
-  ClientPluginsStart
+  InfraClientSetupExports,
+  InfraClientStartExports,
+  InfraClientSetupDeps,
+  InfraClientStartDeps
 > = (context: PluginInitializerContext) => {
   return new Plugin(context);
 };

diff --git a/x-pack/plugins/infra/public/plugin.ts b/x-pack/plugins/infra/public/plugin.ts
@@ -4,35 +4,40 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 import { i18n } from '@kbn/i18n';
-import {
-  AppMountParameters,
-  CoreSetup,
-  CoreStart,
-  Plugin as PluginClass,
-  PluginInitializerContext,
-} from 'kibana/public';
+import { AppMountParameters, PluginInitializerContext } from 'kibana/public';
 import { DEFAULT_APP_CATEGORIES } from '../../../../src/core/public';
 import { createMetricThresholdAlertType } from './alerting/metric_threshold';
 import { createInventoryMetricAlertType } from './alerting/inventory';
 import { getAlertType as getLogsAlertType } from './components/alerting/logs/log_threshold_alert_type';
 import { registerStartSingleton } from './legacy_singletons';
 import { registerFeatures } from './register_feature';
-import { ClientPluginsSetup, ClientPluginsStart } from './types';
-
-export type ClientSetup = void;
-export type ClientStart = void;
+import {
+  InfraClientSetupDeps,
+  InfraClientStartDeps,
+  InfraClientCoreSetup,
+  InfraClientCoreStart,
+  InfraClientPluginClass,
+} from './types';
+import { getLogsHasDataFetcher, getLogsOverviewDataFetcher } from './utils/logs_overview_fetchers';
 
-export class Plugin
-  implements PluginClass<ClientSetup, ClientStart, ClientPluginsSetup, ClientPluginsStart> {
+export class Plugin implements InfraClientPluginClass {
   constructor(_context: PluginInitializerContext) {}
 
-  setup(core: CoreSetup<ClientPluginsStart, ClientStart>, pluginsSetup: ClientPluginsSetup) {
+  setup(core: InfraClientCoreSetup, pluginsSetup: InfraClientSetupDeps) {
     registerFeatures(pluginsSetup.home);
 
     pluginsSetup.triggers_actions_ui.alertTypeRegistry.register(createInventoryMetricAlertType());
     pluginsSetup.triggers_actions_ui.alertTypeRegistry.register(getLogsAlertType());
     pluginsSetup.triggers_actions_ui.alertTypeRegistry.register(createMetricThresholdAlertType());
 
+    if (pluginsSetup.observability) {
+      pluginsSetup.observability.dashboard.register({
+        appName: 'infra_logs',
+        hasData: getLogsHasDataFetcher(core.getStartServices),
+        fetchData: getLogsOverviewDataFetcher(core.getStartServices),
+      });
+    }
+
     core.application.register({
       id: 'logs',
       title: i18n.translate('xpack.infra.logs.pluginTitle', {
@@ -43,20 +48,11 @@ export class Plugin
       appRoute: '/app/logs',
       category: DEFAULT_APP_CATEGORIES.observability,
       mount: async (params: AppMountParameters) => {
+        // mount callback should not use setup dependencies, get start dependencies instead
         const [coreStart, pluginsStart] = await core.getStartServices();
         const { renderApp } = await import('./apps/logs_app');
 
-        return renderApp(
-          coreStart,
-          {
-            data: pluginsStart.data,
-            dataEnhanced: pluginsSetup.dataEnhanced,
-            home: pluginsSetup.home,
-            triggers_actions_ui: pluginsStart.triggers_actions_ui,
-            usageCollection: pluginsSetup.usageCollection,
-          },
-          params
-        );
+        return renderApp(coreStart, pluginsStart, params);
       },
     });
 
@@ -70,20 +66,11 @@ export class Plugin
       appRoute: '/app/metrics',
       category: DEFAULT_APP_CATEGORIES.observability,
       mount: async (params: AppMountParameters) => {
+        // mount callback should not use setup dependencies, get start dependencies instead
         const [coreStart, pluginsStart] = await core.getStartServices();
         const { renderApp } = await import('./apps/metrics_app');
 
-        return renderApp(
-          coreStart,
-          {
-            data: pluginsStart.data,
-            dataEnhanced: pluginsSetup.dataEnhanced,
-            home: pluginsSetup.home,
-            triggers_actions_ui: pluginsStart.triggers_actions_ui,
-            usageCollection: pluginsSetup.usageCollection,
-          },
-          params
-        );
+        return renderApp(coreStart, pluginsStart, params);
       },
     });
 
@@ -102,7 +89,9 @@ export class Plugin
     });
   }
 
-  start(core: CoreStart, _plugins: ClientPluginsStart) {
+  start(core: InfraClientCoreStart, _plugins: InfraClientStartDeps) {
     registerStartSingleton(core);
   }
+
+  stop() {}
 }
diff --git a/x-pack/plugins/infra/public/types.ts b/x-pack/plugins/infra/public/types.ts
@@ -4,22 +4,42 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { CoreSetup, CoreStart, Plugin as PluginClass } from 'kibana/public';
 import { DataPublicPluginStart } from '../../../../src/plugins/data/public';
 import { HomePublicPluginSetup } from '../../../../src/plugins/home/public';
-import { UsageCollectionSetup } from '../../../../src/plugins/usage_collection/public';
+import {
+  UsageCollectionSetup,
+  UsageCollectionStart,
+} from '../../../../src/plugins/usage_collection/public';
 import { TriggersAndActionsUIPublicPluginSetup } from '../../../plugins/triggers_actions_ui/public';
-import { DataEnhancedSetup } from '../../data_enhanced/public';
+import { DataEnhancedSetup, DataEnhancedStart } from '../../data_enhanced/public';
+import { ObservabilityPluginSetup, ObservabilityPluginStart } from '../../observability/public';
 
-export interface ClientPluginsSetup {
+// Our own setup and start contract values
+export type InfraClientSetupExports = void;
+export type InfraClientStartExports = void;
+
+export interface InfraClientSetupDeps {
   dataEnhanced: DataEnhancedSetup;
   home: HomePublicPluginSetup;
+  observability: ObservabilityPluginSetup;
   triggers_actions_ui: TriggersAndActionsUIPublicPluginSetup;
   usageCollection: UsageCollectionSetup;
 }
 
-export interface ClientPluginsStart {
+export interface InfraClientStartDeps {
   data: DataPublicPluginStart;
+  dataEnhanced: DataEnhancedStart;
+  observability: ObservabilityPluginStart;
   triggers_actions_ui: TriggersAndActionsUIPublicPluginSetup;
+  usageCollection: UsageCollectionStart;
 }
 
-export type ClientPluginDeps = ClientPluginsSetup & ClientPluginsStart;
+export type InfraClientCoreSetup = CoreSetup<InfraClientStartDeps, InfraClientStartExports>;
+export type InfraClientCoreStart = CoreStart;
+export type InfraClientPluginClass = PluginClass<
+  InfraClientSetupExports,
+  InfraClientStartExports,
+  InfraClientSetupDeps,
+  InfraClientStartDeps
+>;
diff --git a/x-pack/plugins/infra/public/utils/logs_overview_fetchers.ts b/x-pack/plugins/infra/public/utils/logs_overview_fetchers.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 { InfraClientCoreSetup } from '../types';
+import { LogsFetchDataResponse } from '../../../observability/public';
+
+export function getLogsHasDataFetcher(getStartServices: InfraClientCoreSetup['getStartServices']) {
+  return async () => {
+    // if you need the data plugin, this is how you get it
+    // const [, startPlugins] = await getStartServices();
+    // const { data } = startPlugins;
+
+    // if you need a core dep, we need to pass in more than just getStartServices
+
+    // perform query
+    return true;
+  };
+}
+
+export function getLogsOverviewDataFetcher(
+  getStartServices: InfraClientCoreSetup['getStartServices']
+) {
+  return async (): Promise<LogsFetchDataResponse> => {
+    // if you need the data plugin, this is how you get it
+    // const [, startPlugins] = await getStartServices();
+    // const { data } = startPlugins;
+
+    // if you need a core dep, we need to pass in more than just getStartServices
+
+    // perform query
+    return {
+      title: 'Log rate',
+      appLink: 'TBD', // TODO: what format should this be in, relative I assume?
+      stats: {
+        nginx: {
+          type: 'number',
+          label: 'nginx',
+          value: 345341,
+        },
+        'elasticsearch.audit': {
+          type: 'number',
+          label: 'elasticsearch.audit',
+          value: 164929,
+        },
+        'haproxy.log': {
+          type: 'number',
+          label: 'haproxy.log',
+          value: 51101,
+        },
+      },
+      // Note: My understanding is that these series coordinates will be
+      // combined into objects that look like:
+      // { x: timestamp, y: value, g: label (e.g. nginx) }
+      // so they fit the stacked bar chart API
+      // https://elastic.github.io/elastic-charts/?path=/story/bar-chart--stacked-with-axis-and-legend
+      series: {
+        nginx: {
+          label: 'nginx',
+          coordinates: [
+            { x: 1593000000000, y: 10014 },
+            { x: 1593000900000, y: 12827 },
+            { x: 1593001800000, y: 2946 },
+            { x: 1593002700000, y: 14298 },
+            { x: 1593003600000, y: 4096 },
+          ],
+        },
+        'elasticsearch.audit': {
+          label: 'elasticsearch.audit',
+          coordinates: [
+            { x: 1593000000000, y: 5676 },
+            { x: 1593000900000, y: 6783 },
+            { x: 1593001800000, y: 2394 },
+            { x: 1593002700000, y: 4554 },
+            { x: 1593003600000, y: 5659 },
+          ],
+        },
+        'haproxy.log': {
+          label: 'haproxy.log',
+          coordinates: [
+            { x: 1593000000000, y: 9085 },
+            { x: 1593000900000, y: 9002 },
+            { x: 1593001800000, y: 3940 },
+            { x: 1593002700000, y: 5451 },
+            { x: 1593003600000, y: 9133 },
+          ],
+        },
+      },
+    };
+  };
+}