Merge branch 'master' into beats-cm/migrate-ui

.github/CODEOWNERS

@@ -162,6 +162,7 @@
 # Pulse
 /packages/kbn-analytics/ @elastic/pulse
 /src/legacy/core_plugins/ui_metric/ @elastic/pulse
+/src/plugins/kibana_usage_collection/ @elastic/pulse
 /src/plugins/telemetry/ @elastic/pulse
 /src/plugins/telemetry_collection_manager/ @elastic/pulse
 /src/plugins/telemetry_management_section/ @elastic/pulse

.sass-lint.yml

@@ -11,6 +11,7 @@ files:
     - 'x-pack/plugins/cross_cluster_replication/**/*.s+(a|c)ss'
     - 'x-pack/legacy/plugins/maps/**/*.s+(a|c)ss'
     - 'x-pack/plugins/maps/**/*.s+(a|c)ss'
+    - 'x-pack/plugins/spaces/**/*.s+(a|c)ss'
   ignore:
     - 'x-pack/plugins/canvas/shareable_runtime/**/*.s+(a|c)ss'
 rules:

CONTRIBUTING.md

@@ -414,6 +414,34 @@ extract them to a `JSON` file or integrate translations back to Kibana. To know
 We cannot support accepting contributions to the translations from any source other than the translators we have engaged to do the work.
 We are still to develop a proper process to accept any contributed translations. We certainly appreciate that people care enough about the localization effort to want to help improve the quality. We aim to build out a more comprehensive localization process for the future and will notify you once contributions can be supported, but for the time being, we are not able to incorporate suggestions.
 
+### Syling with SASS
+
+When writing a new component, create a sibling SASS file of the same name and import directly into the JS/TS component file. Doing so ensures the styles are never separated or lost on import and allows for better modularization (smaller individual plugin asset footprint).
+
+Any JavaScript (or TypeScript) file that imports SASS (.scss) files will automatically build with the [EUI](https://elastic.github.io/eui/#/guidelines/sass) & Kibana invisibles (SASS variables, mixins, functions) from the [`styling_constants.scss` file](https://github.com/elastic/kibana/blob/master/src/legacy/ui/public/styles/_styling_constants.scss). However, any Legacy (file path includes `/legacy`) files will not.
+
+**Example:**
+
+```tsx
+// component.tsx
+
+import './component.scss';
+
+export const Component = () => {
+  return (
+    <div className="plgComponent" />
+  );
+}
+```
+
+```scss
+// component.scss
+
+.plgComponent { ... }
+```
+
+Do not use the underscore `_` SASS file naming pattern when importing directly into a javascript file.
+
 ### Testing and Building
 
 To ensure that your changes will not break other functionality, please run the test suite and build process before submitting your Pull Request.

docs/api/features.asciidoc

@@ -29,7 +29,7 @@ The API returns the following:
     "id": "discover",
     "name": "Discover",
     "icon": "discoverApp",
-    "navLinkId": "kibana:discover",
+    "navLinkId": "discover",
     "app": [
       "kibana"
     ],
@@ -74,7 +74,7 @@ The API returns the following:
     "id": "visualize",
     "name": "Visualize",
     "icon": "visualizeApp",
-    "navLinkId": "kibana:visualize",
+    "navLinkId": "visualize",
     "app": [
       "kibana"
     ],
@@ -121,7 +121,7 @@ The API returns the following:
     "id": "dashboard",
     "name": "Dashboard",
     "icon": "dashboardApp",
-    "navLinkId": "kibana:dashboard",
+    "navLinkId": "dashboards",
     "app": [
       "kibana"
     ],
@@ -173,7 +173,7 @@ The API returns the following:
     "id": "dev_tools",
     "name": "Dev Tools",
     "icon": "devToolsApp",
-    "navLinkId": "kibana:dev_tools",
+    "navLinkId": "dev_tools",
     "app": [
       "kibana"
     ],

docs/developer/plugin/development-plugin-feature-registration.asciidoc

@@ -153,7 +153,7 @@ init(server) {
       defaultMessage: 'Dev Tools',
     }),
     icon: 'devToolsApp',
-    navLinkId: 'kibana:dev_tools',
+    navLinkId: 'dev_tools',
     app: ['kibana'],
     catalogue: ['console', 'searchprofiler', 'grokdebugger'],
     privileges: {
@@ -216,7 +216,7 @@ init(server) {
       }),
       order: 100,
       icon: 'discoverApp',
-      navLinkId: 'kibana:discover',
+      navLinkId: 'discover',
       app: ['kibana'],
       catalogue: ['discover'],
       privileges: {

docs/user/dashboard.asciidoc

@@ -174,7 +174,7 @@ to view an embedded dashboard.
 * Generate a PNG report
 
 TIP: To create a link to a dashboard by title, use: +
-`${domain}/${basepath?}/app/kibana#/dashboards?title=${yourdashboardtitle}`
+`${domain}/${basepath?}/app/dashboards#/list?title=${yourdashboardtitle}`
 
 TIP: When sharing a link to a dashboard snapshot, use the *Short URL*. Snapshot
 URLs are long and can be problematic for Internet Explorer and other

examples/alerting_example/public/alert_types/always_firing.tsx

@@ -51,6 +51,7 @@ export function getAlertType(): AlertTypeModel {
       }
       return validationResult;
     },
+    requiresAppContext: false,
   };
 }
 

examples/alerting_example/public/alert_types/astros.tsx

@@ -99,6 +99,7 @@ export function getAlertType(): AlertTypeModel {
 
       return validationResult;
     },
+    requiresAppContext: false,
   };
 }
 

examples/alerting_example/server/alert_types/always_firing.ts

@@ -20,7 +20,7 @@
 import uuid from 'uuid';
 import { range } from 'lodash';
 import { AlertType } from '../../../../x-pack/plugins/alerting/server';
-import { DEFAULT_INSTANCES_TO_GENERATE } from '../../common/constants';
+import { DEFAULT_INSTANCES_TO_GENERATE, ALERTING_EXAMPLE_APP_ID } from '../../common/constants';
 
 export const alertType: AlertType = {
   id: 'example.always-firing',
@@ -43,4 +43,5 @@ export const alertType: AlertType = {
       count,
     };
   },
+  producer: ALERTING_EXAMPLE_APP_ID,
 };

examples/alerting_example/server/alert_types/astros.ts

@@ -19,7 +19,7 @@
 
 import axios from 'axios';
 import { AlertType } from '../../../../x-pack/plugins/alerting/server';
-import { Operator, Craft } from '../../common/constants';
+import { Operator, Craft, ALERTING_EXAMPLE_APP_ID } from '../../common/constants';
 
 interface PeopleInSpace {
   people: Array<{
@@ -79,4 +79,5 @@ export const alertType: AlertType = {
       peopleInSpace,
     };
   },
+  producer: ALERTING_EXAMPLE_APP_ID,
 };

packages/kbn-plugin-helpers/cli.js

@@ -88,6 +88,4 @@ program
     }))
   );
 
-program.command('postinstall').action(createCommanderAction('postinstall'));
-
 program.parse(process.argv);

packages/kbn-plugin-helpers/lib/tasks.js

@@ -22,13 +22,11 @@ const startTask = require('../tasks/start');
 const testAllTask = require('../tasks/test/all');
 const testKarmaTask = require('../tasks/test/karma');
 const testMochaTask = require('../tasks/test/mocha');
-const postinstallTask = require('../tasks/postinstall');
 
 module.exports = {
   build: buildTask,
   start: startTask,
   testAll: testAllTask,
   testKarma: testKarmaTask,
   testMocha: testMochaTask,
-  postinstall: postinstallTask,
 };

src/core/CONVENTIONS.md

@@ -201,6 +201,36 @@ export class MyPlugin implements Plugin {
 }
 ```
 
+Prefer the pattern shown above, using `core.getStartServices()`, rather than store local references retrieved from `start`. 
+
+**Bad:**
+```ts
+export class MyPlugin implements Plugin {
+ // Anti pattern
+  private coreStart?: CoreStart;
+  private depsStart?: DepsStart;  
+
+  public setup(core) {
+    core.application.register({
+      id: 'my-app',
+      async mount(params) {
+        const { renderApp } = await import('./application/my_app');
+        // Anti pattern - use `core.getStartServices()` instead!
+        return renderApp(this.coreStart, this.depsStart, params);
+      }
+    });
+  }  
+
+  public start(core, deps) {
+    // Anti pattern
+    this.coreStart = core;
+    this.depsStart = deps;
+  }
+}
+```
+
+The main reason to prefer the provided async accessor, is that it doesn't requires the developer to understand and reason about when that function can be called. Having an API that fails sometimes isn't a good API design, and it makes accurately testing this difficult.
+
 #### Services
 
 Service structure should mirror the plugin lifecycle to make reasoning about how the service is executed more clear.

src/core/README.md

@@ -4,8 +4,8 @@ Core is a set of systems (frontend, backend etc.) that Kibana and its plugins ar
 
 ## Plugin development
 Core Plugin API Documentation:
- - [Core Public API](/docs/development/core/public/kibana-plugin-public.md)
- - [Core Server API](/docs/development/core/server/kibana-plugin-server.md)
+ - [Core Public API](/docs/development/core/public/kibana-plugin-core-public.md)
+ - [Core Server API](/docs/development/core/server/kibana-plugin-core-server.md)
  - [Conventions for Plugins](./CONVENTIONS.md)
  - [Testing Kibana Plugins](./TESTING.md)
  - [Migration guide for porting existing plugins](./MIGRATION.md)

src/core/public/chrome/chrome_service.tsx

@@ -192,7 +192,7 @@ export class ChromeService {
             forceAppSwitcherNavigation$={navLinks.getForceAppSwitcherNavigation$()}
             helpExtension$={helpExtension$.pipe(takeUntil(this.stop$))}
             helpSupportUrl$={helpSupportUrl$.pipe(takeUntil(this.stop$))}
-            homeHref={http.basePath.prepend('/app/kibana#/home')}
+            homeHref={http.basePath.prepend('/app/home')}
             isVisible$={this.isVisible$}
             kibanaVersion={injectedMetadata.getKibanaVersion()}
             legacyMode={injectedMetadata.getLegacyMode()}

src/core/public/chrome/ui/header/collapsible_nav.test.tsx

@@ -63,6 +63,7 @@ function mockProps() {
     storage: new StubBrowserStorage(),
     onIsOpenUpdate: () => {},
     onIsLockedUpdate: () => {},
+    navigateToApp: () => {},
   };
 }
 

src/core/public/chrome/ui/header/collapsible_nav.tsx

@@ -78,6 +78,7 @@ interface Props {
   storage?: Storage;
   onIsLockedUpdate: OnIsLockedUpdate;
   onIsOpenUpdate: (isOpen?: boolean) => void;
+  navigateToApp: (appId: string) => void;
 }
 
 export function CollapsibleNav({
@@ -89,6 +90,7 @@ export function CollapsibleNav({
   onIsOpenUpdate,
   homeHref,
   id,
+  navigateToApp,
   storage = window.localStorage,
 }: Props) {
   const lockRef = useRef<HTMLButtonElement>(null);
@@ -124,7 +126,19 @@ export function CollapsibleNav({
                 label: 'Home',
                 iconType: 'home',
                 href: homeHref,
-                onClick: () => onIsOpenUpdate(false),
+                onClick: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
+                  onIsOpenUpdate(false);
+                  if (
+                    event.isDefaultPrevented() ||
+                    event.altKey ||
+                    event.metaKey ||
+                    event.ctrlKey
+                  ) {
+                    return;
+                  }
+                  event.preventDefault();
+                  navigateToApp('home');
+                },
               },
             ]}
             maxWidth="none"

src/core/public/chrome/ui/header/header.tsx

@@ -247,6 +247,7 @@ export class Header extends Component<HeaderProps, State> {
                 href={this.props.homeHref}
                 forceNavigation={this.state.forceNavigation}
                 navLinks={navLinks}
+                navigateToApp={this.props.application.navigateToApp}
               />
             </EuiHeaderSectionItem>
 
@@ -287,6 +288,7 @@ export class Header extends Component<HeaderProps, State> {
                 this.toggleCollapsibleNavRef.current.focus();
               }
             }}
+            navigateToApp={this.props.application.navigateToApp}
           />
         ) : (
           // TODO #64541