Merge branch 'main' into reporting/info-panel-touch-ups

src/plugins/console/public/application/contexts/services_context.mock.ts

@@ -7,7 +7,7 @@
  */
 
 import { notificationServiceMock } from '../../../../../core/public/mocks';
-import { httpServiceMock } from '../../../../../core/public/mocks';
+import { httpServiceMock, themeServiceMock } from '../../../../../core/public/mocks';
 
 import type { ObjectStorageClient } from '../../../common/types';
 import { HistoryMock } from '../../services/history.mock';
@@ -35,6 +35,7 @@ export const serviceContextMock = {
         objectStorageClient: {} as unknown as ObjectStorageClient,
       },
       docLinkVersion: 'NA',
+      theme$: themeServiceMock.create().start().theme$,
     };
   },
 };

src/plugins/console/public/application/contexts/services_context.tsx

@@ -7,7 +7,9 @@
  */
 
 import React, { createContext, useContext, useEffect } from 'react';
-import { NotificationsSetup } from 'kibana/public';
+import { Observable } from 'rxjs';
+import { NotificationsSetup, CoreTheme } from 'kibana/public';
+
 import { History, Settings, Storage } from '../../services';
 import { ObjectStorageClient } from '../../../common/types';
 import { MetricsTracker } from '../../types';
@@ -26,6 +28,7 @@ interface ContextServices {
 export interface ContextValue {
   services: ContextServices;
   docLinkVersion: string;
+  theme$: Observable<CoreTheme>;
 }
 
 interface ContextProps {

src/plugins/console/public/application/hooks/use_send_current_request_to_es/use_send_current_request_to_es.ts

@@ -8,20 +8,21 @@
 
 import { i18n } from '@kbn/i18n';
 import { useCallback } from 'react';
+
+import { toMountPoint } from '../../../shared_imports';
 import { isQuotaExceededError } from '../../../services/history';
+// @ts-ignore
+import { retrieveAutoCompleteInfo } from '../../../lib/mappings/mappings';
 import { instance as registry } from '../../contexts/editor_context/editor_registry';
 import { useRequestActionContext, useServicesContext } from '../../contexts';
+import { StorageQuotaError } from '../../components/storage_quota_error';
 import { sendRequestToES } from './send_request_to_es';
 import { track } from './track';
-import { toMountPoint } from '../../../../../kibana_react/public';
-
-// @ts-ignore
-import { retrieveAutoCompleteInfo } from '../../../lib/mappings/mappings';
-import { StorageQuotaError } from '../../components/storage_quota_error';
 
 export const useSendCurrentRequestToES = () => {
   const {
     services: { history, settings, notifications, trackUiMetric },
+    theme$,
   } = useServicesContext();
 
   const dispatch = useRequestActionContext();
@@ -83,7 +84,8 @@ export const useSendCurrentRequestToES = () => {
                   settings.setHistoryDisabled(true);
                   notifications.toasts.remove(toast);
                 },
-              })
+              }),
+              { theme$ }
             ),
           });
         } else {
@@ -127,5 +129,5 @@ export const useSendCurrentRequestToES = () => {
         });
       }
     }
-  }, [dispatch, settings, history, notifications, trackUiMetric]);
+  }, [dispatch, settings, history, notifications, trackUiMetric, theme$]);
 };

src/plugins/console/public/application/index.tsx

@@ -8,13 +8,16 @@
 
 import React from 'react';
 import { render, unmountComponentAtNode } from 'react-dom';
-import { HttpSetup, NotificationsSetup, I18nStart } from 'src/core/public';
-import { ServicesContextProvider, EditorContextProvider, RequestContextProvider } from './contexts';
-import { Main } from './containers';
+import { Observable } from 'rxjs';
+import { HttpSetup, NotificationsSetup, I18nStart, CoreTheme } from 'src/core/public';
+
+import { UsageCollectionSetup } from '../../../usage_collection/public';
+import { KibanaThemeProvider } from '../shared_imports';
 import { createStorage, createHistory, createSettings } from '../services';
-import * as localStorageObjectClient from '../lib/local_storage_object_client';
 import { createUsageTracker } from '../services/tracker';
-import { UsageCollectionSetup } from '../../../usage_collection/public';
+import * as localStorageObjectClient from '../lib/local_storage_object_client';
+import { Main } from './containers';
+import { ServicesContextProvider, EditorContextProvider, RequestContextProvider } from './contexts';
 import { createApi, createEsHostService } from './lib';
 
 export interface BootDependencies {
@@ -24,6 +27,7 @@ export interface BootDependencies {
   notifications: NotificationsSetup;
   usageCollection?: UsageCollectionSetup;
   element: HTMLElement;
+  theme$: Observable<CoreTheme>;
 }
 
 export function renderApp({
@@ -33,6 +37,7 @@ export function renderApp({
   usageCollection,
   element,
   http,
+  theme$,
 }: BootDependencies) {
   const trackUiMetric = createUsageTracker(usageCollection);
   trackUiMetric.load('opened_app');
@@ -49,26 +54,29 @@ export function renderApp({
 
   render(
     <I18nContext>
-      <ServicesContextProvider
-        value={{
-          docLinkVersion,
-          services: {
-            esHostService,
-            storage,
-            history,
-            settings,
-            notifications,
-            trackUiMetric,
-            objectStorageClient,
-          },
-        }}
-      >
-        <RequestContextProvider>
-          <EditorContextProvider settings={settings.toJSON()}>
-            <Main />
-          </EditorContextProvider>
-        </RequestContextProvider>
-      </ServicesContextProvider>
+      <KibanaThemeProvider theme$={theme$}>
+        <ServicesContextProvider
+          value={{
+            docLinkVersion,
+            services: {
+              esHostService,
+              storage,
+              history,
+              settings,
+              notifications,
+              trackUiMetric,
+              objectStorageClient,
+            },
+            theme$,
+          }}
+        >
+          <RequestContextProvider>
+            <EditorContextProvider settings={settings.toJSON()}>
+              <Main />
+            </EditorContextProvider>
+          </RequestContextProvider>
+        </ServicesContextProvider>
+      </KibanaThemeProvider>
     </I18nContext>,
     element
   );

src/plugins/console/public/plugin.ts

@@ -52,7 +52,7 @@ export class ConsoleUIPlugin implements Plugin<void, void, AppSetupUIPluginDepen
           defaultMessage: 'Console',
         }),
         enableRouting: false,
-        mount: async ({ element }) => {
+        mount: async ({ element, theme$ }) => {
           const [core] = await getStartServices();
 
           const {
@@ -69,6 +69,7 @@ export class ConsoleUIPlugin implements Plugin<void, void, AppSetupUIPluginDepen
             notifications,
             usageCollection,
             element,
+            theme$,
           });
         },
       });

src/plugins/console/public/shared_imports.ts

@@ -11,3 +11,5 @@ import { sendRequest, XJson } from '../../es_ui_shared/public';
 const { collapseLiteralStrings, expandLiteralStrings } = XJson;
 
 export { sendRequest, collapseLiteralStrings, expandLiteralStrings };
+
+export { KibanaThemeProvider, toMountPoint } from '../../kibana_react/public';

src/plugins/data/common/search/aggs/buckets/multi_terms.ts

@@ -34,6 +34,7 @@ export interface AggParamsMultiTerms extends BaseAggParams {
   size?: number;
   otherBucket?: boolean;
   otherBucketLabel?: string;
+  separatorLabel?: string;
 }
 
 export const getMultiTermsBucketAgg = () => {
@@ -83,6 +84,7 @@ export const getMultiTermsBucketAgg = () => {
         params: {
           otherBucketLabel: params.otherBucketLabel,
           paramsPerField: formats,
+          separator: agg.params.separatorLabel,
         },
       };
     },
@@ -142,6 +144,11 @@ export const getMultiTermsBucketAgg = () => {
         shouldShow: (agg) => agg.getParam('otherBucket'),
         write: noop,
       },
+      {
+        name: 'separatorLabel',
+        type: 'string',
+        write: noop,
+      },
     ],
   });
 };

src/plugins/data/common/search/aggs/buckets/multi_terms_fn.ts

@@ -111,6 +111,12 @@ export const aggMultiTerms = (): FunctionDefinition => ({
         defaultMessage: 'Represents a custom label for this aggregation',
       }),
     },
+    separatorLabel: {
+      types: ['string'],
+      help: i18n.translate('data.search.aggs.buckets.multiTerms.separatorLabel.help', {
+        defaultMessage: 'The separator label used to join each term combination',
+      }),
+    },
   },
   fn: (input, args) => {
     const { id, enabled, schema, ...rest } = args;

src/plugins/data/common/search/aggs/utils/get_aggs_formats.test.ts

@@ -13,6 +13,7 @@ import {
   IFieldFormat,
   SerializedFieldFormat,
 } from '../../../../../field_formats/common';
+import { MultiFieldKey } from '../buckets/multi_field_key';
 import { getAggsFormats } from './get_aggs_formats';
 
 const getAggFormat = (
@@ -119,4 +120,35 @@ describe('getAggsFormats', () => {
     expect(format.convert('__missing__')).toBe(mapping.params.missingBucketLabel);
     expect(getFormat).toHaveBeenCalledTimes(3);
   });
+
+  test('uses a default separator for multi terms', () => {
+    const terms = ['source', 'geo.src', 'geo.dest'];
+    const mapping = {
+      id: 'multi_terms',
+      params: {
+        paramsPerField: Array(terms.length).fill({ id: 'terms' }),
+      },
+    };
+
+    const format = getAggFormat(mapping, getFormat);
+
+    expect(format.convert(new MultiFieldKey({ key: terms }))).toBe('source › geo.src › geo.dest');
+    expect(getFormat).toHaveBeenCalledTimes(terms.length);
+  });
+
+  test('uses a custom separator for multi terms when passed', () => {
+    const terms = ['source', 'geo.src', 'geo.dest'];
+    const mapping = {
+      id: 'multi_terms',
+      params: {
+        paramsPerField: Array(terms.length).fill({ id: 'terms' }),
+        separator: ' - ',
+      },
+    };
+
+    const format = getAggFormat(mapping, getFormat);
+
+    expect(format.convert(new MultiFieldKey({ key: terms }))).toBe('source - geo.src - geo.dest');
+    expect(getFormat).toHaveBeenCalledTimes(terms.length);
+  });
 });

src/plugins/data/common/search/aggs/utils/get_aggs_formats.ts

@@ -143,9 +143,11 @@ export function getAggsFormats(getFieldFormat: GetFieldFormat): FieldFormatInsta
           return params.otherBucketLabel;
         }
 
+        const joinTemplate = params.separator ?? ' › ';
+
         return (val as MultiFieldKey).keys
           .map((valPart, i) => formats[i].convert(valPart, type))
-          .join(' › ');
+          .join(joinTemplate);
       };
       getConverterFor = (type: FieldFormatsContentType) => (val: string) => this.convert(val, type);
     },

src/plugins/dev_tools/kibana.json

@@ -7,5 +7,6 @@
     "name": "Stack Management",
     "githubTeam": "kibana-stack-management"
   },
-  "requiredPlugins": ["urlForwarding"]
+  "requiredPlugins": ["urlForwarding"],
+  "requiredBundles": ["kibanaReact"]
 }

src/plugins/dev_tools/public/application.tsx

@@ -16,6 +16,7 @@ import { i18n } from '@kbn/i18n';
 import { euiThemeVars } from '@kbn/ui-shared-deps-src/theme';
 
 import { ApplicationStart, ChromeStart, ScopedHistory, CoreTheme } from 'src/core/public';
+import { KibanaThemeProvider } from '../../kibana_react/public';
 import type { DocTitleService, BreadcrumbService } from './services';
 
 import { DevToolApp } from './dev_tool';
@@ -177,32 +178,34 @@ export function renderApp(
 
   ReactDOM.render(
     <I18nProvider>
-      <Router>
-        <Switch>
-          {devTools
-            // Only create routes for devtools that are not disabled
-            .filter((devTool) => !devTool.isDisabled())
-            .map((devTool) => (
-              <Route
-                key={devTool.id}
-                path={`/${devTool.id}`}
-                exact={!devTool.enableRouting}
-                render={(props) => (
-                  <DevToolsWrapper
-                    updateRoute={props.history.push}
-                    activeDevTool={devTool}
-                    devTools={devTools}
-                    theme$={theme$}
-                    appServices={appServices}
-                  />
-                )}
-              />
-            ))}
-          <Route path="/">
-            <Redirect to={`/${devTools[0].id}`} />
-          </Route>
-        </Switch>
-      </Router>
+      <KibanaThemeProvider theme$={theme$}>
+        <Router>
+          <Switch>
+            {devTools
+              // Only create routes for devtools that are not disabled
+              .filter((devTool) => !devTool.isDisabled())
+              .map((devTool) => (
+                <Route
+                  key={devTool.id}
+                  path={`/${devTool.id}`}
+                  exact={!devTool.enableRouting}
+                  render={(props) => (
+                    <DevToolsWrapper
+                      updateRoute={props.history.push}
+                      activeDevTool={devTool}
+                      devTools={devTools}
+                      theme$={theme$}
+                      appServices={appServices}
+                    />
+                  )}
+                />
+              ))}
+            <Route path="/">
+              <Redirect to={`/${devTools[0].id}`} />
+            </Route>
+          </Switch>
+        </Router>
+      </KibanaThemeProvider>
     </I18nProvider>,
     element
   );

src/plugins/discover/public/__mocks__/services.ts

@@ -97,4 +97,5 @@ export const discoverServiceMock = {
   storage: {
     get: jest.fn(),
   },
+  addBasePath: jest.fn(),
 } as unknown as DiscoverServices;