[Uptime] Added uptime query inspector panel (elastic#115170)

jloleysens · Oct 18, 2021 · d08f091 · d08f091
1 parent 411816c
commit d08f091
Show file tree

Hide file tree

Showing 48 changed files with 266 additions and 91 deletions.
diff --git a/x-pack/plugins/apm/scripts/upload-telemetry-data/index.ts b/x-pack/plugins/apm/scripts/upload-telemetry-data/index.ts
@@ -17,8 +17,7 @@ import { argv } from 'yargs';
 import { Logger } from 'kibana/server';
 // eslint-disable-next-line @kbn/eslint/no-restricted-paths
 import { CollectTelemetryParams } from '../../server/lib/apm_telemetry/collect_data_telemetry';
-// eslint-disable-next-line @kbn/eslint/no-restricted-paths
-import { unwrapEsResponse } from '../../../observability/server/utils/unwrap_es_response';
+import { unwrapEsResponse } from '../../../observability/common/utils/unwrap_es_response';
 import { downloadTelemetryTemplate } from '../shared/download-telemetry-template';
 import { mergeApmTelemetryMapping } from '../../common/apm_telemetry';
 import { generateSampleDocuments } from './generate-sample-documents';

diff --git a/...lity/server/utils/get_inspect_response.ts → ...lity/common/utils/get_inspect_response.ts b/...lity/server/utils/get_inspect_response.ts → ...lity/common/utils/get_inspect_response.ts
@@ -8,8 +8,8 @@
 import { i18n } from '@kbn/i18n';
 import type { KibanaRequest } from 'kibana/server';
 import type { RequestStatistics, RequestStatus } from '../../../../../src/plugins/inspector';
-import { WrappedElasticsearchClientError } from '../index';
 import { InspectResponse } from '../../typings/common';
+import { WrappedElasticsearchClientError } from './unwrap_es_response';
 
 /**
  * Get statistics to show on inspector tab.
@@ -29,19 +29,26 @@ function getStats({
   kibanaRequest: KibanaRequest;
 }) {
   const stats: RequestStatistics = {
-    kibanaApiQueryParameters: {
-      label: i18n.translate('xpack.observability.inspector.stats.kibanaApiQueryParametersLabel', {
-        defaultMessage: 'Kibana API query parameters',
-      }),
-      description: i18n.translate(
-        'xpack.observability.inspector.stats.kibanaApiQueryParametersDescription',
-        {
-          defaultMessage:
-            'The query parameters used in the Kibana API request that initiated the Elasticsearch request.',
+    ...(kibanaRequest.query
+      ? {
+          kibanaApiQueryParameters: {
+            label: i18n.translate(
+              'xpack.observability.inspector.stats.kibanaApiQueryParametersLabel',
+              {
+                defaultMessage: 'Kibana API query parameters',
+              }
+            ),
+            description: i18n.translate(
+              'xpack.observability.inspector.stats.kibanaApiQueryParametersDescription',
+              {
+                defaultMessage:
+                  'The query parameters used in the Kibana API request that initiated the Elasticsearch request.',
+              }
+            ),
+            value: JSON.stringify(kibanaRequest.query, null, 2),
+          },
         }
-      ),
-      value: JSON.stringify(kibanaRequest.query, null, 2),
-    },
+      : {}),
     kibanaApiRoute: {
       label: i18n.translate('xpack.observability.inspector.stats.kibanaApiRouteLabel', {
         defaultMessage: 'Kibana API route',
@@ -93,11 +100,17 @@ function getStats({
   }
 
   if (esResponse?.hits?.total !== undefined) {
-    const total = esResponse.hits.total as {
-      relation: string;
-      value: number;
-    };
-    const hitsTotalValue = total.relation === 'eq' ? `${total.value}` : `> ${total.value}`;
+    let hitsTotalValue;
+
+    if (typeof esResponse.hits.total === 'number') {
+      hitsTotalValue = esResponse.hits.total;
+    } else {
+      const total = esResponse.hits.total as {
+        relation: string;
+        value: number;
+      };
+      hitsTotalValue = total.relation === 'eq' ? `${total.value}` : `> ${total.value}`;
+    }
 
     stats.hitsTotal = {
       label: i18n.translate('xpack.observability.inspector.stats.hitsTotalLabel', {

diff --git a/...bility/server/utils/unwrap_es_response.ts → ...bility/common/utils/unwrap_es_response.ts b/...bility/server/utils/unwrap_es_response.ts → ...bility/common/utils/unwrap_es_response.ts
diff --git a/...bservability/public/components/shared/exploratory_view/series_editor/use_filter_values.ts b/...bservability/public/components/shared/exploratory_view/series_editor/use_filter_values.ts
@@ -12,7 +12,10 @@ import { useAppIndexPatternContext } from '../hooks/use_app_index_pattern';
 import { ESFilter } from '../../../../../../../../src/core/types/elasticsearch';
 import { PersistableFilter } from '../../../../../../lens/common';
 
-export function useFilterValues({ field, series, baseFilters }: FilterProps, query?: string) {
+export function useFilterValues(
+  { field, series, baseFilters, label }: FilterProps,
+  query?: string
+) {
   const { indexPatterns } = useAppIndexPatternContext(series.dataType);
 
   const queryFilters: ESFilter[] = [];
@@ -28,6 +31,7 @@ export function useFilterValues({ field, series, baseFilters }: FilterProps, que
 
   return useValuesList({
     query,
+    label,
     sourceField: field,
     time: series.time,
     keepHistory: true,

diff --git a/x-pack/plugins/observability/public/components/shared/field_value_suggestions/index.tsx b/x-pack/plugins/observability/public/components/shared/field_value_suggestions/index.tsx
@@ -33,6 +33,7 @@ export function FieldValueSuggestions({
   required,
   allowExclusions = true,
   cardinalityField,
+  inspector,
   asCombobox = true,
   onChange: onSelectionChange,
 }: FieldValueSuggestionsProps) {
@@ -44,7 +45,9 @@ export function FieldValueSuggestions({
     sourceField,
     filters,
     time,
+    inspector,
     cardinalityField,
+    label,
     keepHistory: true,
   });
 

diff --git a/x-pack/plugins/observability/public/components/shared/field_value_suggestions/types.ts b/x-pack/plugins/observability/public/components/shared/field_value_suggestions/types.ts
@@ -8,6 +8,7 @@
 import { PopoverAnchorPosition } from '@elastic/eui';
 import { Dispatch, SetStateAction } from 'react';
 import { ESFilter } from 'src/core/types/elasticsearch';
+import { IInspectorInfo } from '../../../../../../../src/plugins/data/common';
 
 interface CommonProps {
   selectedValue?: string[];
@@ -37,6 +38,7 @@ export type FieldValueSuggestionsProps = CommonProps & {
   onChange: (val?: string[], excludedValue?: string[]) => void;
   filters: ESFilter[];
   time?: { from: string; to: string };
+  inspector?: IInspectorInfo;
 };
 
 export type FieldValueSelectionProps = CommonProps & {

diff --git a/x-pack/plugins/observability/public/context/inspector/inspector_context.tsx b/x-pack/plugins/observability/public/context/inspector/inspector_context.tsx
@@ -23,6 +23,13 @@ const value: InspectorContextValue = {
 
 export const InspectorContext = createContext<InspectorContextValue>(value);
 
+export type AddInspectorRequest = (
+  result: FetcherResult<{
+    mainStatisticsData?: { _inspect?: InspectResponse };
+    _inspect?: InspectResponse;
+  }>
+) => void;
+
 export function InspectorContextProvider({ children }: { children: ReactNode }) {
   const history = useHistory();
   const { inspectorAdapters } = value;

diff --git a/x-pack/plugins/observability/public/hooks/use_es_search.ts b/x-pack/plugins/observability/public/hooks/use_es_search.ts
@@ -9,27 +9,61 @@ import { estypes } from '@elastic/elasticsearch';
 import { DataPublicPluginStart } from '../../../../../src/plugins/data/public';
 import { ESSearchResponse } from '../../../../../src/core/types/elasticsearch';
 import { useKibana } from '../../../../../src/plugins/kibana_react/public';
-import { isCompleteResponse } from '../../../../../src/plugins/data/common';
-import { useFetcher } from './use_fetcher';
+import { IInspectorInfo, isCompleteResponse } from '../../../../../src/plugins/data/common';
+import { FETCH_STATUS, useFetcher } from './use_fetcher';
+import { useInspectorContext } from '../context/inspector/use_inspector_context';
+import { getInspectResponse } from '../../common/utils/get_inspect_response';
 
 export const useEsSearch = <DocumentSource extends unknown, TParams extends estypes.SearchRequest>(
   params: TParams,
-  fnDeps: any[]
+  fnDeps: any[],
+  options: { inspector?: IInspectorInfo; name: string }
 ) => {
   const {
     services: { data },
   } = useKibana<{ data: DataPublicPluginStart }>();
 
+  const { name } = options ?? {};
+
+  const { addInspectorRequest } = useInspectorContext();
+
   const { data: response = {}, loading } = useFetcher(() => {
     if (params.index) {
+      const startTime = Date.now();
       return new Promise((resolve) => {
         const search$ = data.search
-          .search({
-            params,
-          })
+          .search(
+            {
+              params,
+            },
+            {}
+          )
           .subscribe({
             next: (result) => {
               if (isCompleteResponse(result)) {
+                if (addInspectorRequest) {
+                  addInspectorRequest({
+                    data: {
+                      _inspect: [
+                        getInspectResponse({
+                          startTime,
+                          esRequestParams: params,
+                          esResponse: result.rawResponse,
+                          esError: null,
+                          esRequestStatus: 1,
+                          operationName: name,
+                          kibanaRequest: {
+                            route: {
+                              path: '/internal/bsearch',
+                              method: 'POST',
+                            },
+                          } as any,
+                        }),
+                      ],
+                    },
+                    status: FETCH_STATUS.SUCCESS,
+                  });
+                }
                 // Final result
                 resolve(result);
                 search$.unsubscribe();

diff --git a/x-pack/plugins/observability/public/hooks/use_values_list.ts b/x-pack/plugins/observability/public/hooks/use_values_list.ts
@@ -10,16 +10,19 @@ import { useEffect, useState } from 'react';
 import useDebounce from 'react-use/lib/useDebounce';
 import { ESFilter } from '../../../../../src/core/types/elasticsearch';
 import { createEsParams, useEsSearch } from './use_es_search';
+import { IInspectorInfo } from '../../../../../src/plugins/data/common';
 import { TRANSACTION_URL } from '../components/shared/exploratory_view/configurations/constants/elasticsearch_fieldnames';
 
 export interface Props {
   sourceField: string;
+  label: string;
   query?: string;
   indexPatternTitle?: string;
   filters?: ESFilter[];
   time?: { from: string; to: string };
   keepHistory?: boolean;
   cardinalityField?: string;
+  inspector?: IInspectorInfo;
 }
 
 export interface ListItem {
@@ -60,6 +63,7 @@ export const useValuesList = ({
   query = '',
   filters,
   time,
+  label,
   keepHistory,
   cardinalityField,
 }: Props): { values: ListItem[]; loading?: boolean } => {
@@ -131,7 +135,8 @@ export const useValuesList = ({
         },
       },
     }),
-    [debouncedQuery, from, to, JSON.stringify(filters), indexPatternTitle, sourceField]
+    [debouncedQuery, from, to, JSON.stringify(filters), indexPatternTitle, sourceField],
+    { name: `get${label.replace(/\s/g, '')}ValuesList` }
   );
 
   useEffect(() => {

diff --git a/x-pack/plugins/observability/public/index.ts b/x-pack/plugins/observability/public/index.ts
@@ -83,5 +83,8 @@ export type {
 export { createObservabilityRuleTypeRegistryMock } from './rules/observability_rule_type_registry_mock';
 export type { ExploratoryEmbeddableProps } from './components/shared/exploratory_view/embeddable/embeddable';
 
-export { InspectorContextProvider } from './context/inspector/inspector_context';
+export {
+  InspectorContextProvider,
+  AddInspectorRequest,
+} from './context/inspector/inspector_context';
 export { useInspectorContext } from './context/inspector/use_inspector_context';
diff --git a/x-pack/plugins/observability/server/index.ts b/x-pack/plugins/observability/server/index.ts
@@ -13,9 +13,12 @@ import { PluginConfigDescriptor, PluginInitializerContext } from 'src/core/serve
 import { ObservabilityPlugin, ObservabilityPluginSetup } from './plugin';
 import { createOrUpdateIndex, Mappings } from './utils/create_or_update_index';
 import { ScopedAnnotationsClient } from './lib/annotations/bootstrap_annotations';
-import { unwrapEsResponse, WrappedElasticsearchClientError } from './utils/unwrap_es_response';
+import {
+  unwrapEsResponse,
+  WrappedElasticsearchClientError,
+} from '../common/utils/unwrap_es_response';
 export { rangeQuery, kqlQuery } from './utils/queries';
-export { getInspectResponse } from './utils/get_inspect_response';
+export { getInspectResponse } from '../common/utils/get_inspect_response';
 
 export * from './types';
 

diff --git a/x-pack/plugins/observability/server/lib/annotations/create_annotations_client.ts b/x-pack/plugins/observability/server/lib/annotations/create_annotations_client.ts
@@ -17,7 +17,7 @@ import {
 } from '../../../common/annotations';
 import { createOrUpdateIndex } from '../../utils/create_or_update_index';
 import { mappings } from './mappings';
-import { unwrapEsResponse } from '../../utils/unwrap_es_response';
+import { unwrapEsResponse } from '../../../common/utils/unwrap_es_response';
 
 type CreateParams = t.TypeOf<typeof createAnnotationRt>;
 type DeleteParams = t.TypeOf<typeof deleteAnnotationRt>;

diff --git a/x-pack/plugins/uptime/kibana.json b/x-pack/plugins/uptime/kibana.json
@@ -14,6 +14,7 @@
   "requiredPlugins": [
     "alerting",
     "embeddable",
+    "inspector",
     "features",
     "licensing",
     "triggersActionsUi",

diff --git a/x-pack/plugins/uptime/public/apps/plugin.ts b/x-pack/plugins/uptime/public/apps/plugin.ts
@@ -42,6 +42,7 @@ import {
   LazySyntheticsPolicyEditExtension,
 } from '../components/fleet_package';
 import { LazySyntheticsCustomAssetsExtension } from '../components/fleet_package/lazy_synthetics_custom_assets_extension';
+import { Start as InspectorPluginStart } from '../../../../../src/plugins/inspector/public';
 
 export interface ClientPluginsSetup {
   data: DataPublicPluginSetup;
@@ -56,6 +57,7 @@ export interface ClientPluginsStart {
   triggersActionsUi: TriggersAndActionsUIPublicPluginStart;
   fleet?: FleetStart;
   observability: ObservabilityPublicStart;
+  inspector: InspectorPluginStart;
 }
 
 export interface UptimePluginServices extends Partial<CoreStart> {

diff --git a/x-pack/plugins/uptime/public/apps/uptime_app.tsx b/x-pack/plugins/uptime/public/apps/uptime_app.tsx
@@ -33,6 +33,7 @@ import { ActionMenu } from '../components/common/header/action_menu';
 import { EuiThemeProvider } from '../../../../../src/plugins/kibana_react/common';
 import { Storage } from '../../../../../src/plugins/kibana_utils/public';
 import { UptimeIndexPatternContextProvider } from '../contexts/uptime_index_pattern_context';
+import { InspectorContextProvider } from '../../../observability/public';
 
 export interface UptimeAppColors {
   danger: string;
@@ -110,6 +111,7 @@ const Application = (props: UptimeAppProps) => {
               ...plugins,
               storage,
               data: startPlugins.data,
+              inspector: startPlugins.inspector,
               triggersActionsUi: startPlugins.triggersActionsUi,
               observability: startPlugins.observability,
             }}
@@ -126,9 +128,11 @@ const Application = (props: UptimeAppProps) => {
                               className={APP_WRAPPER_CLASS}
                               application={core.application}
                             >
-                              <UptimeAlertsFlyoutWrapper />
-                              <PageRouter />
-                              <ActionMenu appMountParameters={appMountParameters} />
+                              <InspectorContextProvider>
+                                <UptimeAlertsFlyoutWrapper />
+                                <PageRouter />
+                                <ActionMenu appMountParameters={appMountParameters} />
+                              </InspectorContextProvider>
                             </RedirectAppLinks>
                           </div>
                         </UptimeIndexPatternContextProvider>

diff --git a/x-pack/plugins/uptime/public/apps/uptime_page_template.tsx b/x-pack/plugins/uptime/public/apps/uptime_page_template.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import React, { useMemo } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import styled from 'styled-components';
 import { EuiPageHeaderProps } from '@elastic/eui';
 import { CERTIFICATES_ROUTE, OVERVIEW_ROUTE } from '../../common/constants';
@@ -15,6 +15,7 @@ import { useNoDataConfig } from './use_no_data_config';
 import { EmptyStateLoading } from '../components/overview/empty_state/empty_state_loading';
 import { EmptyStateError } from '../components/overview/empty_state/empty_state_error';
 import { useHasData } from '../components/overview/empty_state/use_has_data';
+import { useInspectorContext } from '../../../observability/public';
 
 interface Props {
   path: string;
@@ -39,6 +40,11 @@ export const UptimePageTemplateComponent: React.FC<Props> = ({ path, pageHeader,
   const noDataConfig = useNoDataConfig();
 
   const { loading, error, data } = useHasData();
+  const { inspectorAdapters } = useInspectorContext();
+
+  useEffect(() => {
+    inspectorAdapters.requests.reset();
+  }, [inspectorAdapters.requests]);
 
   if (error) {
     return <EmptyStateError errors={[error]} />;