Merge branch 'master' into security/deprecate-disabling-plugin

docs/fleet/fleet.asciidoc

@@ -17,13 +17,11 @@ Standalone mode requires you to manually configure and manage the agent locally.
 * An overview of the data ingest in your {es} cluster.
 * Multiple integrations to collect and transform data.
 
-//TODO: Redo screen capture.
-
 [role="screenshot"]
 image::fleet/images/fleet-start.png[{fleet} app in {kib}]
 
 [float]
 == Get started
 
 To get started with {fleet}, refer to the
-{ingest-guide}/index.html[Ingest Management Guide].
+{ingest-guide}/index.html[{fleet}] docs.

docs/settings/fleet-settings.asciidoc

@@ -10,7 +10,7 @@ experimental[]
 You can configure `xpack.fleet` settings in your `kibana.yml`. 
 By default, {fleet} is enabled. To use {fleet}, you also need to configure {kib} and {es} hosts.
 
-See the {ingest-guide}/index.html[Ingest Management] docs for more information.
+See the {ingest-guide}/index.html[{fleet}] docs for more information.
 
 [[general-fleet-settings-kb]]
 ==== General {fleet} settings

x-pack/examples/alerting_example/public/alert_types/always_firing.tsx

@@ -22,7 +22,6 @@ import {
   AlertConditionsGroup,
   AlertTypeModel,
   AlertTypeParamsExpressionProps,
-  AlertsContextValue,
 } from '../../../../plugins/triggers_actions_ui/public';
 import {
   AlwaysFiringParams,
@@ -65,7 +64,7 @@ const DEFAULT_THRESHOLDS: AlwaysFiringParams['thresholds'] = {
 };
 
 export const AlwaysFiringExpression: React.FunctionComponent<
-  AlertTypeParamsExpressionProps<AlwaysFiringParams, AlertsContextValue>
+  AlertTypeParamsExpressionProps<AlwaysFiringParams>
 > = ({ alertParams, setAlertParams, actionGroups, defaultActionGroupId }) => {
   const {
     instances = DEFAULT_INSTANCES_TO_GENERATE,

x-pack/examples/alerting_example/public/components/create_alert.tsx

@@ -4,26 +4,27 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React, { useState } from 'react';
+import React, { useMemo, useState } from 'react';
 
 import { EuiIcon, EuiFlexItem, EuiCard, EuiFlexGroup } from '@elastic/eui';
 
-import { AlertsContextProvider, AlertAdd } from '../../../../plugins/triggers_actions_ui/public';
 import { AlertingExampleComponentParams } from '../application';
 import { ALERTING_EXAMPLE_APP_ID } from '../../common/constants';
 
-export const CreateAlert = ({
-  http,
-  triggersActionsUi,
-  charts,
-  uiSettings,
-  docLinks,
-  data,
-  toastNotifications,
-  capabilities,
-}: AlertingExampleComponentParams) => {
+export const CreateAlert = ({ triggersActionsUi }: AlertingExampleComponentParams) => {
   const [alertFlyoutVisible, setAlertFlyoutVisibility] = useState<boolean>(false);
 
+  const AddAlertFlyout = useMemo(
+    () =>
+      triggersActionsUi.getAddAlertFlyout({
+        consumer: ALERTING_EXAMPLE_APP_ID,
+        addFlyoutVisible: alertFlyoutVisible,
+        setAddFlyoutVisibility: setAlertFlyoutVisibility,
+      }),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [alertFlyoutVisible]
+  );
+
   return (
     <EuiFlexGroup>
       <EuiFlexItem grow={false}>
@@ -34,27 +35,7 @@ export const CreateAlert = ({
           onClick={() => setAlertFlyoutVisibility(true)}
         />
       </EuiFlexItem>
-      <EuiFlexItem>
-        <AlertsContextProvider
-          value={{
-            http,
-            actionTypeRegistry: triggersActionsUi.actionTypeRegistry,
-            alertTypeRegistry: triggersActionsUi.alertTypeRegistry,
-            toastNotifications,
-            uiSettings,
-            docLinks,
-            charts,
-            dataFieldsFormats: data.fieldFormats,
-            capabilities,
-          }}
-        >
-          <AlertAdd
-            consumer={ALERTING_EXAMPLE_APP_ID}
-            addFlyoutVisible={alertFlyoutVisible}
-            setAddFlyoutVisibility={setAlertFlyoutVisibility}
-          />
-        </AlertsContextProvider>
-      </EuiFlexItem>
+      <EuiFlexItem>{AddAlertFlyout}</EuiFlexItem>
     </EuiFlexGroup>
   );
 };

x-pack/plugins/apm/public/application/application.test.tsx

@@ -9,10 +9,12 @@ import { createMemoryHistory } from 'history';
 import { Observable } from 'rxjs';
 import { AppMountParameters, CoreStart, HttpSetup } from 'src/core/public';
 import { mockApmPluginContextValue } from '../context/apm_plugin/mock_apm_plugin_context';
-import { ApmPluginSetupDeps } from '../plugin';
+import { ApmPluginSetupDeps, ApmPluginStartDeps } from '../plugin';
 import { createCallApmApi } from '../services/rest/createCallApmApi';
 import { renderApp } from './';
 import { disableConsoleWarning } from '../utils/testHelpers';
+import { dataPluginMock } from 'src/plugins/data/public/mocks';
+import { embeddablePluginMock } from 'src/plugins/embeddable/public/mocks';
 
 jest.mock('../services/rest/index_pattern', () => ({
   createStaticIndexPattern: () => Promise.resolve(undefined),
@@ -55,6 +57,19 @@ describe('renderApp', () => {
       history: createMemoryHistory(),
       setHeaderActionMenu: () => {},
     };
+
+    const data = dataPluginMock.createStartContract();
+    const embeddable = embeddablePluginMock.createStartContract();
+    const startDeps = {
+      triggersActionsUi: {
+        actionTypeRegistry: {},
+        alertTypeRegistry: {},
+        getAddAlertFlyout: jest.fn(),
+        getEditAlertFlyout: jest.fn(),
+      },
+      data,
+      embeddable,
+    };
     jest.spyOn(window, 'scrollTo').mockReturnValueOnce(undefined);
     createCallApmApi((core.http as unknown) as HttpSetup);
 
@@ -75,7 +90,8 @@ describe('renderApp', () => {
         (core as unknown) as CoreStart,
         (plugins as unknown) as ApmPluginSetupDeps,
         (params as unknown) as AppMountParameters,
-        config
+        config,
+        (startDeps as unknown) as ApmPluginStartDeps
       );
     });
 

x-pack/plugins/apm/public/application/index.tsx

@@ -19,7 +19,6 @@ import {
   RedirectAppLinks,
   useUiSetting$,
 } from '../../../../../src/plugins/kibana_react/public';
-import { AlertsContextProvider } from '../../../triggers_actions_ui/public';
 import { routes } from '../components/app/Main/route_config';
 import { ScrollToTopOnPathChange } from '../components/app/Main/ScrollToTopOnPathChange';
 import {
@@ -29,7 +28,7 @@ import {
 import { LicenseProvider } from '../context/license/license_context';
 import { UrlParamsProvider } from '../context/url_params_context/url_params_context';
 import { useBreadcrumbs } from '../hooks/use_breadcrumbs';
-import { ApmPluginSetupDeps } from '../plugin';
+import { ApmPluginSetupDeps, ApmPluginStartDeps } from '../plugin';
 import { createCallApmApi } from '../services/rest/createCallApmApi';
 import { createStaticIndexPattern } from '../services/rest/index_pattern';
 import { setHelpExtension } from '../setHelpExtension';
@@ -66,38 +65,29 @@ function App() {
 
 export function ApmAppRoot({
   apmPluginContextValue,
+  startDeps,
 }: {
   apmPluginContextValue: ApmPluginContextValue;
+  startDeps: ApmPluginStartDeps;
 }) {
-  const { appMountParameters, core, plugins } = apmPluginContextValue;
+  const { appMountParameters, core } = apmPluginContextValue;
   const { history } = appMountParameters;
   const i18nCore = core.i18n;
 
   return (
     <RedirectAppLinks application={core.application}>
       <ApmPluginContext.Provider value={apmPluginContextValue}>
-        <AlertsContextProvider
-          value={{
-            http: core.http,
-            docLinks: core.docLinks,
-            capabilities: core.application.capabilities,
-            toastNotifications: core.notifications.toasts,
-            actionTypeRegistry: plugins.triggersActionsUi.actionTypeRegistry,
-            alertTypeRegistry: plugins.triggersActionsUi.alertTypeRegistry,
-          }}
-        >
-          <KibanaContextProvider services={{ ...core, ...plugins }}>
-            <i18nCore.Context>
-              <Router history={history}>
-                <UrlParamsProvider>
-                  <LicenseProvider>
-                    <App />
-                  </LicenseProvider>
-                </UrlParamsProvider>
-              </Router>
-            </i18nCore.Context>
-          </KibanaContextProvider>
-        </AlertsContextProvider>
+        <KibanaContextProvider services={{ ...core, ...startDeps }}>
+          <i18nCore.Context>
+            <Router history={history}>
+              <UrlParamsProvider>
+                <LicenseProvider>
+                  <App />
+                </LicenseProvider>
+              </UrlParamsProvider>
+            </Router>
+          </i18nCore.Context>
+        </KibanaContextProvider>
       </ApmPluginContext.Provider>
     </RedirectAppLinks>
   );
@@ -111,7 +101,8 @@ export const renderApp = (
   core: CoreStart,
   setupDeps: ApmPluginSetupDeps,
   appMountParameters: AppMountParameters,
-  config: ConfigSchema
+  config: ConfigSchema,
+  startDeps: ApmPluginStartDeps
 ) => {
   const { element } = appMountParameters;
   const apmPluginContextValue = {
@@ -133,7 +124,10 @@ export const renderApp = (
   });
 
   ReactDOM.render(
-    <ApmAppRoot apmPluginContextValue={apmPluginContextValue} />,
+    <ApmAppRoot
+      apmPluginContextValue={apmPluginContextValue}
+      startDeps={startDeps}
+    />,
     element
   );
   return () => {

x-pack/plugins/apm/public/components/alerting/AlertingFlyout/index.tsx

@@ -3,29 +3,37 @@
  * or more contributor license agreements. Licensed under the Elastic License;
  * you may not use this file except in compliance with the Elastic License.
  */
-import React from 'react';
+import React, { useMemo } from 'react';
+import { useKibana } from '../../../../../../../src/plugins/kibana_react/public';
 import { AlertType } from '../../../../common/alert_types';
-import { AlertAdd } from '../../../../../triggers_actions_ui/public';
-
-type AlertAddProps = React.ComponentProps<typeof AlertAdd>;
+import { TriggersAndActionsUIPublicPluginStart } from '../../../../../triggers_actions_ui/public';
 
 interface Props {
-  addFlyoutVisible: AlertAddProps['addFlyoutVisible'];
-  setAddFlyoutVisibility: AlertAddProps['setAddFlyoutVisibility'];
+  addFlyoutVisible: boolean;
+  setAddFlyoutVisibility: React.Dispatch<React.SetStateAction<boolean>>;
   alertType: AlertType | null;
 }
 
+interface KibanaDeps {
+  triggersActionsUi: TriggersAndActionsUIPublicPluginStart;
+}
+
 export function AlertingFlyout(props: Props) {
   const { addFlyoutVisible, setAddFlyoutVisibility, alertType } = props;
-  return (
-    alertType && (
-      <AlertAdd
-        addFlyoutVisible={addFlyoutVisible}
-        setAddFlyoutVisibility={setAddFlyoutVisibility}
-        consumer="apm"
-        alertTypeId={alertType}
-        canChangeTrigger={false}
-      />
-    )
+  const {
+    services: { triggersActionsUi },
+  } = useKibana<KibanaDeps>();
+  const addAlertFlyout = useMemo(
+    () =>
+      alertType &&
+      triggersActionsUi.getAddAlertFlyout({
+        consumer: 'apm',
+        addFlyoutVisible,
+        setAddFlyoutVisibility,
+        alertTypeId: alertType,
+        canChangeTrigger: false,
+      }),
+    [addFlyoutVisible, alertType, setAddFlyoutVisibility, triggersActionsUi]
   );
+  return <>{addAlertFlyout}</>;
 }

x-pack/plugins/apm/public/plugin.ts

@@ -138,12 +138,18 @@ export class ApmPlugin implements Plugin<ApmPluginSetup, ApmPluginStart> {
 
       async mount(params: AppMountParameters<unknown>) {
         // Load application bundle and Get start services
-        const [{ renderApp }, [coreStart]] = await Promise.all([
+        const [{ renderApp }, [coreStart, corePlugins]] = await Promise.all([
           import('./application'),
           core.getStartServices(),
         ]);
 
-        return renderApp(coreStart, pluginSetupDeps, params, config);
+        return renderApp(
+          coreStart,
+          pluginSetupDeps,
+          params,
+          config,
+          corePlugins as ApmPluginStartDeps
+        );
       },
     });
 

x-pack/plugins/global_search_bar/public/components/search_bar.scss

@@ -0,0 +1,21 @@
+//TODO add these overrides to EUI so that search behaves the same globally
+.kbnSearchBar {
+  width: 400px;
+  max-width: 100%;
+  will-change: width;
+}
+
+@include euiBreakpoint('l', 'xl') {
+  .kbnSearchBar:focus {
+    animation: kbnAnimateSearchBar $euiAnimSpeedFast forwards;
+  }
+}
+
+@keyframes kbnAnimateSearchBar {
+  from {
+    width: 400px;
+  }
+  to {
+    width: 600px;
+  }
+}