Merge branch '7.x' into backport/7.x/pr-87368

elastic · Jan 6, 2021 · 3f63bdf · 3f63bdf
2 parents 0c034a2 + a26f20e
commit 3f63bdf
Show file tree

Hide file tree

Showing 21 changed files with 147 additions and 50 deletions.
diff --git a/src/plugins/region_map/public/get_deprecation_message.tsx b/src/plugins/region_map/public/get_deprecation_message.tsx
@@ -71,6 +71,7 @@ export function getDeprecationMessage(vis: Vis) {
     const bucketAggs = vis.data?.aggs?.byType('buckets');
     if (bucketAggs?.length && bucketAggs[0].type.dslName === 'terms') {
       createUrlParams.termsFieldName = bucketAggs[0].getField()?.name;
+      createUrlParams.termsSize = bucketAggs[0].getParam('size');
     }
 
     const metricAggs = vis.data?.aggs?.byType('metrics');

diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/timeline/timeline.tsx b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/timeline/timeline.tsx
@@ -222,9 +222,9 @@ export const Timeline: React.FC<Props> = ({ interval, yAxisFormatter, isVisible
           </EuiText>
         </EuiFlexItem>
         <EuiFlexItem grow={false}>
-          <EuiFlexGroup alignItems={'center'}>
+          <EuiFlexGroup alignItems={'center'} responsive={false}>
             <EuiFlexItem grow={false}>
-              <EuiFlexGroup gutterSize={'s'} alignItems={'center'}>
+              <EuiFlexGroup gutterSize={'s'} alignItems={'center'} responsive={false}>
                 <EuiFlexItem grow={false}>
                   <EuiIcon color={colorTransformer(chartMetric.color)} type={'dot'} />
                 </EuiFlexItem>
@@ -240,7 +240,7 @@ export const Timeline: React.FC<Props> = ({ interval, yAxisFormatter, isVisible
               </EuiFlexGroup>
             </EuiFlexItem>
             <EuiFlexItem grow={false}>
-              <EuiFlexGroup gutterSize={'s'} alignItems={'center'}>
+              <EuiFlexGroup gutterSize={'s'} alignItems={'center'} responsive={false}>
                 <EuiFlexItem
                   grow={false}
                   style={{ backgroundColor: '#D36086', height: 5, width: 10 }}
@@ -317,6 +317,9 @@ const TimelineHeader = euiStyled.div`
   width: 100%;
   padding: ${(props) => props.theme.eui.paddingSizes.s} ${(props) =>
   props.theme.eui.paddingSizes.m};
+  @media only screen and (max-width: 767px) {
+      margin-top: 30px;
+  }
 `;
 
 const TimelineChartContainer = euiStyled.div`

diff --git a/...k/plugins/infra/public/pages/metrics/inventory_view/components/waffle/legend_controls.tsx b/...k/plugins/infra/public/pages/metrics/inventory_view/components/waffle/legend_controls.tsx
@@ -186,9 +186,8 @@ export const LegendControls = ({
         button={buttonComponent}
       >
         <EuiPopoverTitle>Legend Options</EuiPopoverTitle>
-        <EuiForm style={{ width: 500 }}>
+        <EuiForm style={{ minWidth: 400 }}>
           <EuiFormRow
-            fullWidth
             display="columnCompressed"
             label={i18n.translate('xpack.infra.legendControls.colorPaletteLabel', {
               defaultMessage: 'Color palette',
@@ -211,7 +210,6 @@ export const LegendControls = ({
             </>
           </EuiFormRow>
           <EuiFormRow
-            fullWidth
             display="columnCompressed"
             label={i18n.translate('xpack.infra.legendControls.stepsLabel', {
               defaultMessage: 'Number of colors',
@@ -220,12 +218,11 @@ export const LegendControls = ({
             <EuiRange
               id="steps"
               min={2}
-              max={20}
+              max={18}
               step={1}
               value={draftLegend.steps}
               onChange={handleStepsChange}
               showValue
-              compressed
               fullWidth
             />
           </EuiFormRow>
@@ -243,6 +240,10 @@ export const LegendControls = ({
               checked={draftLegend.reverseColors}
               onChange={handleReverseColors}
               compressed
+              style={{
+                position: 'relative',
+                top: '8px',
+              }}
             />
           </EuiFormRow>
           <EuiFormRow
@@ -259,6 +260,10 @@ export const LegendControls = ({
               checked={draftAuto}
               onChange={handleAutoChange}
               compressed
+              style={{
+                position: 'relative',
+                top: '8px',
+              }}
             />
           </EuiFormRow>
           <EuiFormRow
@@ -316,7 +321,7 @@ export const LegendControls = ({
             </div>
           </EuiFormRow>
           <EuiSpacer size="m" />
-          <EuiFlexGroup justifyContent="flexEnd">
+          <EuiFlexGroup justifyContent="flexEnd" responsive={false}>
             <EuiFlexItem grow={false}>
               <EuiButtonEmpty type="submit" size="s" onClick={handleCancelClick}>
                 <FormattedMessage

diff --git a/...k/plugins/infra/public/pages/metrics/inventory_view/components/waffle/palette_preview.tsx b/...k/plugins/infra/public/pages/metrics/inventory_view/components/waffle/palette_preview.tsx
@@ -27,7 +27,7 @@ export const PalettePreview = ({ steps, palette, reverse }: Props) => {
 };
 
 const Swatch = euiStyled.div`
-  width: 16px;
+  width: 15px;
   height: 12px;
   flex: 0 0 auto;
   &:first-child {

diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/waffle/swatch_label.tsx b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/waffle/swatch_label.tsx
@@ -14,7 +14,7 @@ export interface Props {
 
 export const SwatchLabel = ({ label, color }: Props) => {
   return (
-    <EuiFlexGroup alignItems="center" gutterSize="s">
+    <EuiFlexGroup alignItems="center" gutterSize="s" responsive={false}>
       <EuiFlexItem grow={false}>
         <EuiColorPickerSwatch color={color} />
       </EuiFlexItem>

diff --git a/x-pack/plugins/maps/common/descriptor_types/data_request_descriptor_types.ts b/x-pack/plugins/maps/common/descriptor_types/data_request_descriptor_types.ts
@@ -39,10 +39,15 @@ type ESGeoLineSourceSyncMeta = {
   sortField: string;
 };
 
+type ESTermSourceSyncMeta = {
+  size: number;
+};
+
 export type VectorSourceSyncMeta =
   | ESSearchSourceSyncMeta
   | ESGeoGridSourceSyncMeta
   | ESGeoLineSourceSyncMeta
+  | ESTermSourceSyncMeta
   | null;
 
 export type VectorSourceRequestMeta = MapFilters & {
@@ -54,10 +59,9 @@ export type VectorSourceRequestMeta = MapFilters & {
   sourceMeta: VectorSourceSyncMeta;
 };
 
-export type VectorJoinSourceRequestMeta = Omit<
-  VectorSourceRequestMeta,
-  'geogridPrecision' | 'sourceMeta'
-> & { sourceQuery?: Query };
+export type VectorJoinSourceRequestMeta = Omit<VectorSourceRequestMeta, 'geogridPrecision'> & {
+  sourceQuery?: Query;
+};
 
 export type VectorStyleRequestMeta = MapFilters & {
   dynamicStyleFields: string[];

diff --git a/x-pack/plugins/maps/common/descriptor_types/source_descriptor_types.ts b/x-pack/plugins/maps/common/descriptor_types/source_descriptor_types.ts
@@ -104,6 +104,7 @@ export type ESTermSourceDescriptor = AbstractESAggSourceDescriptor & {
   indexPatternTitle?: string;
   term: string; // term field name
   whereQuery?: Query;
+  size?: number;
 };
 
 export type KibanaRegionmapSourceDescriptor = AbstractSourceDescriptor & {

diff --git a/x-pack/plugins/maps/public/classes/layers/create_region_map_layer_descriptor.ts b/x-pack/plugins/maps/public/classes/layers/create_region_map_layer_descriptor.ts
@@ -8,6 +8,7 @@ import uuid from 'uuid/v4';
 import {
   AggDescriptor,
   ColorDynamicOptions,
+  ESTermSourceDescriptor,
   LayerDescriptor,
 } from '../../../common/descriptor_types';
 import {
@@ -48,6 +49,7 @@ export function createRegionMapLayerDescriptor({
   emsLayerId,
   leftFieldName,
   termsFieldName,
+  termsSize,
   colorSchema,
   indexPatternId,
   indexPatternTitle,
@@ -58,6 +60,7 @@ export function createRegionMapLayerDescriptor({
   emsLayerId?: string;
   leftFieldName?: string;
   termsFieldName?: string;
+  termsSize?: number;
   colorSchema: string;
   indexPatternId?: string;
   indexPatternTitle?: string;
@@ -78,21 +81,25 @@ export function createRegionMapLayerDescriptor({
   const colorPallette = NUMERICAL_COLOR_PALETTES.find((pallette) => {
     return pallette.value.toLowerCase() === colorSchema.toLowerCase();
   });
+  const termSourceDescriptor: ESTermSourceDescriptor = {
+    type: SOURCE_TYPES.ES_TERM_SOURCE,
+    id: joinId,
+    indexPatternId,
+    indexPatternTitle: indexPatternTitle ? indexPatternTitle : indexPatternId,
+    term: termsFieldName,
+    metrics: [metricsDescriptor],
+    applyGlobalQuery: true,
+    applyGlobalTime: true,
+  };
+  if (termsSize !== undefined) {
+    termSourceDescriptor.size = termsSize;
+  }
   return VectorLayer.createDescriptor({
     label,
     joins: [
       {
         leftField: leftFieldName,
-        right: {
-          type: SOURCE_TYPES.ES_TERM_SOURCE,
-          id: joinId,
-          indexPatternId,
-          indexPatternTitle: indexPatternTitle ? indexPatternTitle : indexPatternId,
-          term: termsFieldName,
-          metrics: [metricsDescriptor],
-          applyGlobalQuery: true,
-          applyGlobalTime: true,
-        },
+        right: termSourceDescriptor,
       },
     ],
     sourceDescriptor: EMSFileSource.createDescriptor({

diff --git a/x-pack/plugins/maps/public/classes/layers/vector_layer/vector_layer.tsx b/x-pack/plugins/maps/public/classes/layers/vector_layer/vector_layer.tsx
@@ -349,6 +349,7 @@ export class VectorLayer extends AbstractLayer {
       sourceQuery: joinSource.getWhereQuery(),
       applyGlobalQuery: joinSource.getApplyGlobalQuery(),
       applyGlobalTime: joinSource.getApplyGlobalTime(),
+      sourceMeta: joinSource.getSyncMeta(),
     };
     const prevDataRequest = this.getDataRequest(sourceDataId);
 

diff --git a/x-pack/plugins/maps/public/classes/sources/es_term_source/es_term_source.ts b/x-pack/plugins/maps/public/classes/sources/es_term_source/es_term_source.ts
@@ -25,6 +25,7 @@ import {
 import {
   ESTermSourceDescriptor,
   VectorJoinSourceRequestMeta,
+  VectorSourceSyncMeta,
 } from '../../../../common/descriptor_types';
 import { Adapters } from '../../../../../../../src/plugins/inspector/common/adapters';
 import { PropertiesMap } from '../../../../common/elasticsearch_util';
@@ -124,7 +125,9 @@ export class ESTermSource extends AbstractESAggSource {
     const indexPattern = await this.getIndexPattern();
     const searchSource: ISearchSource = await this.makeSearchSource(searchFilters, 0);
     const termsField = getField(indexPattern, this._termField.getName());
-    const termsAgg = { size: DEFAULT_MAX_BUCKETS_LIMIT };
+    const termsAgg = {
+      size: this._descriptor.size !== undefined ? this._descriptor.size : DEFAULT_MAX_BUCKETS_LIMIT,
+    };
     searchSource.setField('aggs', {
       [TERMS_AGG_NAME]: {
         terms: addFieldToDSL(termsAgg, termsField),
@@ -162,4 +165,12 @@ export class ESTermSource extends AbstractESAggSource {
   getFieldNames(): string[] {
     return this.getMetricFields().map((esAggMetricField) => esAggMetricField.getName());
   }
+
+  getSyncMeta(): VectorSourceSyncMeta | null {
+    return this._descriptor.size !== undefined
+      ? {
+          size: this._descriptor.size,
+        }
+      : null;
+  }
 }
diff --git a/x-pack/plugins/maps/public/components/__snapshots__/validated_number_input.test.tsx.snap b/x-pack/plugins/maps/public/components/__snapshots__/validated_number_input.test.tsx.snap
diff --git a/x-pack/plugins/maps/public/components/metrics_editor/metric_editor.tsx b/x-pack/plugins/maps/public/components/metrics_editor/metric_editor.tsx
@@ -154,6 +154,7 @@ export function MetricEditor({
         initialValue={
           typeof metric.percentile === 'number' ? metric.percentile : DEFAULT_PERCENTILE
         }
+        display="columnCompressed"
       />
     );
   }

diff --git a/x-pack/plugins/maps/public/components/validated_number_input.tsx b/x-pack/plugins/maps/public/components/validated_number_input.tsx
@@ -4,8 +4,9 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React, { Component, ChangeEvent } from 'react';
-import { EuiFieldNumber, EuiFormRow } from '@elastic/eui';
+import React, { Component, ChangeEvent, ReactNode } from 'react';
+// @ts-expect-error
+import { EuiFieldNumber, EuiFormRow, EuiFormRowDisplayKeys } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import _ from 'lodash';
 
@@ -21,6 +22,8 @@ interface Props {
   max: number;
   onChange: (value: number) => void;
   label: string;
+  display?: EuiFormRowDisplayKeys;
+  helpText?: ReactNode;
 }
 
 function getErrorMessage(min: number, max: number): string {
@@ -97,7 +100,8 @@ export class ValidatedNumberInput extends Component<Props, State> {
         label={this.props.label}
         isInvalid={!this.state.isValid}
         error={this.state.errorMessage ? [this.state.errorMessage] : []}
-        display="columnCompressed"
+        display={this.props.display}
+        helpText={this.props.helpText}
       >
         <EuiFieldNumber
           isInvalid={!this.state.isValid}

diff --git a/x-pack/plugins/maps/public/connected_components/layer_panel/join_editor/join_editor.tsx b/x-pack/plugins/maps/public/connected_components/layer_panel/join_editor/join_editor.tsx
@@ -5,6 +5,7 @@
  */
 
 import React, { Fragment } from 'react';
+import _ from 'lodash';
 import uuid from 'uuid/v4';
 
 import {

diff --git a/...omponents/layer_panel/join_editor/resources/__snapshots__/metrics_expression.test.js.snap b/...omponents/layer_panel/join_editor/resources/__snapshots__/metrics_expression.test.js.snap
diff --git a/x-pack/plugins/maps/public/connected_components/layer_panel/join_editor/resources/join.js b/x-pack/plugins/maps/public/connected_components/layer_panel/join_editor/resources/join.js
@@ -77,10 +77,12 @@ export class Join extends Component {
       loadError: undefined,
     });
     this._loadRightFields(indexPatternId);
+    // eslint-disable-next-line no-unused-vars
+    const { term, ...restOfRight } = this.props.join.right;
     this.props.onChange({
       leftField: this.props.join.leftField,
       right: {
-        id: this.props.join.right.id,
+        ...restOfRight,
         indexPatternId,
         indexPatternTitle,
       },
@@ -97,6 +99,16 @@ export class Join extends Component {
     });
   };
 
+  _onRightSizeChange = (size) => {
+    this.props.onChange({
+      leftField: this.props.join.leftField,
+      right: {
+        ...this.props.join.right,
+        size,
+      },
+    });
+  };
+
   _onMetricsChange = (metrics) => {
     this.props.onChange({
       leftField: this.props.join.leftField,
@@ -161,7 +173,7 @@ export class Join extends Component {
       );
       globalFilterCheckbox = (
         <GlobalFilterCheckbox
-          applyGlobalQuery={right.applyGlobalQuery}
+          applyGlobalQuery={right.applyGlobalQuery === 'undefined' ? true : right.applyGlobalQuery}
           setApplyGlobalQuery={this._onApplyGlobalQueryChange}
           label={i18n.translate('xpack.maps.layerPanel.join.applyGlobalQueryCheckboxLabel', {
             defaultMessage: `Apply global filter to join`,
@@ -209,8 +221,10 @@ export class Join extends Component {
               rightSourceName={rightSourceName}
               onRightSourceChange={this._onRightSourceChange}
               rightValue={right.term}
+              rightSize={right.size}
               rightFields={rightFields}
               onRightFieldChange={this._onRightFieldChange}
+              onRightSizeChange={this._onRightSizeChange}
             />
           </EuiFlexItem>
-Original file line number
+Diff line change
@@ Expand Up / @@ -154,6 +154,7 @@ export function MetricEditor({ @@
             initialValue={
               typeof metric.percentile === 'number' ? metric.percentile : DEFAULT_PERCENTILE
             }
+            display="columnCompressed"
           />
         );
       }
@@ Expand Down @@