Merge branch 'master' into feat/matrix-histogram-search-strategy

.github/CODEOWNERS

@@ -63,6 +63,13 @@
 /src/plugins/apm_oss/  @elastic/apm-ui
 /src/apm.js @watson @vigneshshanmugam
 
+# Client Side Monitoring (lives in APM directories but owned by Uptime)
+/x-pack/plugins/apm/e2e/cypress/support/step_definitions/rum @elastic/uptime
+/x-pack/plugins/apm/public/application/csmApp.tsx @elastic/uptime
+/x-pack/plugins/apm/public/components/app/RumDashboard @elastic/uptime
+/x-pack/plugins/apm/server/lib/rum_client @elastic/uptime
+/x-pack/plugins/apm/server/routes/rum_client.ts @elastic/uptime
+
 # Beats
 /x-pack/legacy/plugins/beats_management/  @elastic/beats
 

docs/management/advanced-options.asciidoc

@@ -150,6 +150,12 @@ working on big documents.
 ==== Machine learning
 
 [horizontal]
+`ml:anomalyDetection:results:enableTimeDefaults`:: Use the default time filter
+in the *Single Metric Viewer* and *Anomaly Explorer*. If this setting is
+disabled, the results for the full time range are shown.
+`ml:anomalyDetection:results:timeDefaults`:: Sets the default time filter for
+viewing {anomaly-job} results. This setting must contain `from` and `to` values (see {ref}/common-options.html#date-math[accepted formats]). It is ignored
+unless `ml:anomalyDetection:results:enableTimeDefaults` is enabled.
 `ml:fileDataVisualizerMaxFileSize`:: Sets the file size limit when importing
 data in the {data-viz}. The default value is `100MB`. The highest supported
 value for this setting is `1GB`.

package.json

@@ -92,6 +92,7 @@
     "**/istanbul-instrumenter-loader/schema-utils": "1.0.0",
     "**/image-diff/gm/debug": "^2.6.9",
     "**/load-grunt-config/lodash": "^4.17.20",
+    "**/node-jose/node-forge": "^0.10.0",
     "**/react-dom": "^16.12.0",
     "**/react": "^16.12.0",
     "**/react-test-renderer": "^16.12.0",
@@ -191,7 +192,7 @@
     "moment-timezone": "^0.5.27",
     "mustache": "2.3.2",
     "node-fetch": "1.7.3",
-    "node-forge": "^0.9.1",
+    "node-forge": "^0.10.0",
     "opn": "^5.5.0",
     "oppsy": "^2.0.0",
     "p-map": "^4.0.0",
@@ -305,7 +306,7 @@
     "@types/moment-timezone": "^0.5.12",
     "@types/mustache": "^0.8.31",
     "@types/node": ">=10.17.17 <10.20.0",
-    "@types/node-forge": "^0.9.0",
+    "@types/node-forge": "^0.9.5",
     "@types/normalize-path": "^3.0.0",
     "@types/opn": "^5.1.0",
     "@types/pegjs": "^0.10.1",

src/plugins/dashboard/public/application/dashboard_app_controller.tsx

@@ -24,9 +24,18 @@ import { EuiCheckboxGroupIdToSelectedMap } from '@elastic/eui/src/components/for
 import React, { useState, ReactElement } from 'react';
 import ReactDOM from 'react-dom';
 import angular from 'angular';
+import deepEqual from 'fast-deep-equal';
 
 import { Observable, pipe, Subscription, merge } from 'rxjs';
-import { filter, map, debounceTime, mapTo, startWith, switchMap } from 'rxjs/operators';
+import {
+  filter,
+  map,
+  debounceTime,
+  mapTo,
+  startWith,
+  switchMap,
+  distinctUntilChanged,
+} from 'rxjs/operators';
 import { History } from 'history';
 import { SavedObjectSaveOpts } from 'src/plugins/saved_objects/public';
 import { NavigationPublicPluginStart as NavigationStart } from 'src/plugins/navigation/public';
@@ -279,6 +288,12 @@ export class DashboardAppController {
     const updateIndexPatternsOperator = pipe(
       filter((container: DashboardContainer) => !!container && !isErrorEmbeddable(container)),
       map(getDashboardIndexPatterns),
+      distinctUntilChanged((a, b) =>
+        deepEqual(
+          a.map((ip) => ip.id),
+          b.map((ip) => ip.id)
+        )
+      ),
       // using switchMap for previous task cancellation
       switchMap((panelIndexPatterns: IndexPattern[]) => {
         return new Observable((observer) => {
@@ -405,17 +420,29 @@ export class DashboardAppController {
               ) : null;
             };
 
-            outputSubscription = new Subscription();
-            outputSubscription.add(
-              dashboardContainer
-                .getOutput$()
-                .pipe(
-                  mapTo(dashboardContainer),
-                  startWith(dashboardContainer), // to trigger initial index pattern update
-                  updateIndexPatternsOperator
+            outputSubscription = merge(
+              // output of dashboard container itself
+              dashboardContainer.getOutput$(),
+              // plus output of dashboard container children,
+              // children may change, so make sure we subscribe/unsubscribe with switchMap
+              dashboardContainer.getOutput$().pipe(
+                map(() => dashboardContainer!.getChildIds()),
+                distinctUntilChanged(deepEqual),
+                switchMap((newChildIds: string[]) =>
+                  merge(
+                    ...newChildIds.map((childId) =>
+                      dashboardContainer!.getChild(childId).getOutput$()
+                    )
+                  )
                 )
-                .subscribe()
-            );
+              )
+            )
+              .pipe(
+                mapTo(dashboardContainer),
+                startWith(dashboardContainer), // to trigger initial index pattern update
+                updateIndexPatternsOperator
+              )
+              .subscribe();
 
             inputSubscription = dashboardContainer.getInput$().subscribe(() => {
               let dirty = false;

x-pack/plugins/apm/public/components/app/RumDashboard/Breakdowns/BreakdownFilter.tsx

@@ -5,64 +5,85 @@
  */
 
 import React from 'react';
-import { BreakdownGroup } from './BreakdownGroup';
-import { BreakdownItem } from '../../../../../typings/ui_filters';
+import { EuiSuperSelect } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
 import {
   CLIENT_GEO_COUNTRY_ISO_CODE,
   USER_AGENT_DEVICE,
   USER_AGENT_NAME,
   USER_AGENT_OS,
 } from '../../../../../common/elasticsearch_fieldnames';
+import { BreakdownItem } from '../../../../../typings/ui_filters';
 
 interface Props {
-  id: string;
-  selectedBreakdowns: BreakdownItem[];
-  onBreakdownChange: (values: BreakdownItem[]) => void;
+  selectedBreakdown: BreakdownItem | null;
+  onBreakdownChange: (value: BreakdownItem | null) => void;
 }
 
 export function BreakdownFilter({
-  id,
-  selectedBreakdowns,
+  selectedBreakdown,
   onBreakdownChange,
 }: Props) {
-  const categories: BreakdownItem[] = [
+  const NO_BREAKDOWN = 'noBreakdown';
+
+  const items: BreakdownItem[] = [
     {
-      name: 'Browser',
+      name: i18n.translate('xpack.apm.csm.breakDownFilter.noBreakdown', {
+        defaultMessage: 'No breakdown',
+      }),
+      fieldName: NO_BREAKDOWN,
       type: 'category',
-      count: 0,
-      selected: selectedBreakdowns.some(({ name }) => name === 'Browser'),
-      fieldName: USER_AGENT_NAME,
     },
     {
-      name: 'OS',
+      name: i18n.translate('xpack.apm.csm.breakdownFilter.browser', {
+        defaultMessage: 'Browser',
+      }),
+      fieldName: USER_AGENT_NAME,
       type: 'category',
-      count: 0,
-      selected: selectedBreakdowns.some(({ name }) => name === 'OS'),
-      fieldName: USER_AGENT_OS,
     },
     {
-      name: 'Device',
+      name: i18n.translate('xpack.apm.csm.breakdownFilter.os', {
+        defaultMessage: 'OS',
+      }),
+      fieldName: USER_AGENT_OS,
       type: 'category',
-      count: 0,
-      selected: selectedBreakdowns.some(({ name }) => name === 'Device'),
-      fieldName: USER_AGENT_DEVICE,
     },
     {
-      name: 'Location',
+      name: i18n.translate('xpack.apm.csm.breakdownFilter.device', {
+        defaultMessage: 'Device',
+      }),
+      fieldName: USER_AGENT_DEVICE,
       type: 'category',
-      count: 0,
-      selected: selectedBreakdowns.some(({ name }) => name === 'Location'),
+    },
+    {
+      name: i18n.translate('xpack.apm.csm.breakdownFilter.location', {
+        defaultMessage: 'Location',
+      }),
       fieldName: CLIENT_GEO_COUNTRY_ISO_CODE,
+      type: 'category',
     },
   ];
 
+  const options = items.map(({ name, fieldName }) => ({
+    inputDisplay: fieldName === NO_BREAKDOWN ? name : <strong>{name}</strong>,
+    value: fieldName,
+    dropdownDisplay: name,
+  }));
+
+  const onOptionChange = (value: string) => {
+    if (value === NO_BREAKDOWN) {
+      onBreakdownChange(null);
+    }
+    onBreakdownChange(items.find(({ fieldName }) => fieldName === value)!);
+  };
+
   return (
-    <BreakdownGroup
-      id={id}
-      items={categories}
-      onChange={(selValues: BreakdownItem[]) => {
-        onBreakdownChange(selValues);
-      }}
+    <EuiSuperSelect
+      fullWidth
+      compressed
+      options={options}
+      valueOfSelected={selectedBreakdown?.fieldName ?? NO_BREAKDOWN}
+      onChange={(value) => onOptionChange(value)}
     />
   );
 }

x-pack/plugins/apm/public/components/app/RumDashboard/Charts/PageLoadDistChart.tsx

@@ -43,7 +43,7 @@ interface PageLoadData {
 interface Props {
   onPercentileChange: (min: number, max: number) => void;
   data?: PageLoadData | null;
-  breakdowns: BreakdownItem[];
+  breakdown: BreakdownItem | null;
   percentileRange: PercentileRange;
   loading: boolean;
 }
@@ -57,7 +57,7 @@ const PageLoadChart = styled(Chart)`
 export function PageLoadDistChart({
   onPercentileChange,
   data,
-  breakdowns,
+  breakdown,
   loading,
   percentileRange,
 }: Props) {
@@ -122,17 +122,17 @@ export function PageLoadDistChart({
             data={data?.pageLoadDistribution ?? []}
             curve={CurveType.CURVE_CATMULL_ROM}
           />
-          {breakdowns.map(({ name, type }) => (
+          {breakdown && (
             <BreakdownSeries
-              key={`${type}-${name}`}
-              field={type}
-              value={name}
+              key={`${breakdown.type}-${breakdown.name}`}
+              field={breakdown.type}
+              value={breakdown.name}
               percentileRange={percentileRange}
               onLoadingChange={(bLoading) => {
                 setBreakdownLoading(bLoading);
               }}
             />
-          ))}
+          )}
         </PageLoadChart>
       )}
     </ChartWrapper>