[Maps] Allow updating requestType for ESGeoGridSource (#62365)

* [Maps] Allow updating requestType for ESGeoGridSource

* re-add import removed from last merge

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>

x-pack/plugins/maps/common/descriptor_types/data_request_descriptor_types.d.ts

@@ -5,6 +5,7 @@
  */
 /* eslint-disable @typescript-eslint/consistent-type-definitions */
 
+import { RENDER_AS, SORT_ORDER, SCALING_TYPES } from '../constants';
 import { MapExtent, MapQuery } from './map_descriptor';
 
 // Global map state passed to every layer.
@@ -18,12 +19,26 @@ export type MapFilters = {
   zoom: number;
 };
 
+type ESSearchSourceSyncMeta = {
+  sortField: string;
+  sortOrder: SORT_ORDER;
+  scalingType: SCALING_TYPES;
+  topHitsSplitField: string;
+  topHitsSize: number;
+};
+
+type ESGeoGridSourceSyncMeta = {
+  requestType: RENDER_AS;
+};
+
+export type VectorSourceSyncMeta = ESSearchSourceSyncMeta | ESGeoGridSourceSyncMeta;
+
 export type VectorSourceRequestMeta = MapFilters & {
   applyGlobalQuery: boolean;
   fieldNames: string[];
   geogridPrecision: number;
   sourceQuery: MapQuery;
-  sourceMeta: unknown;
+  sourceMeta: VectorSourceSyncMeta;
 };
 
 export type VectorStyleRequestMeta = MapFilters & {

x-pack/plugins/maps/public/layers/sources/es_geo_grid_source/create_source_editor.js

@@ -9,7 +9,6 @@ import React, { Fragment, Component } from 'react';
 import PropTypes from 'prop-types';
 
 import { SingleFieldSelect } from '../../../components/single_field_select';
-import { RENDER_AS } from '../../../../common/constants';
 import { getIndexPatternService, getIndexPatternSelectComponent } from '../../../kibana_services';
 import { NoIndexPatternCallout } from '../../../components/no_index_pattern_callout';
 import { i18n } from '@kbn/i18n';
@@ -155,7 +154,7 @@ export class CreateSourceEditor extends Component {
   }
 
   _renderRenderAsSelect() {
-    if (this.state.requestType === RENDER_AS.HEATMAP || !this.state.indexPattern) {
+    if (!this.state.indexPattern) {
       return null;
     }
 

x-pack/plugins/maps/public/layers/sources/es_geo_grid_source/es_geo_grid_source.js

@@ -70,6 +70,12 @@ export class ESGeoGridSource extends AbstractESAggSource {
     );
   }
 
+  getSyncMeta() {
+    return {
+      requestType: this._descriptor.requestType,
+    };
+  }
+
   async getImmutableProperties() {
     let indexPatternTitle = this.getIndexPatternId();
     try {

x-pack/plugins/maps/public/layers/sources/es_geo_grid_source/render_as_select.tsx

@@ -27,7 +27,12 @@ const options = [
 export function RenderAsSelect(props: {
   renderAs: RENDER_AS;
   onChange: (newValue: RENDER_AS) => void;
+  isColumnCompressed?: boolean;
 }) {
+  if (props.renderAs === RENDER_AS.HEATMAP) {
+    return null;
+  }
+
   function onChange(selectedOptions: Array<EuiComboBoxOptionOption<RENDER_AS>>) {
     if (!selectedOptions || !selectedOptions.length) {
       return;
@@ -46,6 +51,7 @@ export function RenderAsSelect(props: {
       label={i18n.translate('xpack.maps.source.esGeoGrid.showAsLabel', {
         defaultMessage: 'Show as',
       })}
+      display={props.isColumnCompressed ? 'columnCompressed' : 'row'}
     >
       <EuiComboBox
         singleSelection={{ asPlainText: true }}
@@ -53,6 +59,7 @@ export function RenderAsSelect(props: {
         selectedOptions={selectedOptions}
         onChange={onChange}
         isClearable={false}
+        compressed
       />
     </EuiFormRow>
   );

x-pack/plugins/maps/public/layers/sources/es_geo_grid_source/update_source_editor.js

@@ -15,6 +15,7 @@ import { FormattedMessage } from '@kbn/i18n/react';
 import { EuiPanel, EuiSpacer, EuiTitle } from '@elastic/eui';
 import { isMetricCountable } from '../../util/is_metric_countable';
 import { indexPatterns } from '../../../../../../../src/plugins/data/public';
+import { RenderAsSelect } from './render_as_select';
 
 export class UpdateSourceEditor extends Component {
   state = {
@@ -65,6 +66,10 @@ export class UpdateSourceEditor extends Component {
     this.props.onChange({ propName: 'resolution', value: e });
   };
 
+  _onRequestTypeSelect = requestType => {
+    this.props.onChange({ propName: 'requestType', value: requestType });
+  };
+
   _renderMetricsPanel() {
     const metricsFilter =
       this.props.renderAs === RENDER_AS.HEATMAP
@@ -113,6 +118,11 @@ export class UpdateSourceEditor extends Component {
             resolution={this.props.resolution}
             onChange={this._onResolutionChange}
           />
+          <RenderAsSelect
+            isColumnCompressed
+            renderAs={this.props.renderAs}
+            onChange={this._onRequestTypeSelect}
+          />
         </EuiPanel>
         <EuiSpacer size="s" />
       </Fragment>

x-pack/plugins/maps/public/layers/sources/source.js

@@ -111,10 +111,6 @@ export class AbstractSource {
     return 0;
   }
 
-  getSyncMeta() {
-    return {};
-  }
-
   isJoinable() {
     return false;
   }

x-pack/plugins/maps/public/layers/sources/vector_source.d.ts

@@ -12,6 +12,7 @@ import {
   ESSearchSourceResponseMeta,
   MapExtent,
   VectorSourceRequestMeta,
+  VectorSourceSyncMeta,
 } from '../../../common/descriptor_types';
 
 export type GeoJsonFetchMeta = ESSearchSourceResponseMeta;
@@ -31,6 +32,7 @@ export interface IVectorSource extends ISource {
 
   getFields(): Promise<IField[]>;
   getFieldByName(fieldName: string): IField;
+  getSyncMeta(): VectorSourceSyncMeta;
 }
 
 export class AbstractVectorSource extends AbstractSource implements IVectorSource {
@@ -43,4 +45,5 @@ export class AbstractVectorSource extends AbstractSource implements IVectorSourc
 
   getFields(): Promise<IField[]>;
   getFieldByName(fieldName: string): IField;
+  getSyncMeta(): VectorSourceSyncMeta;
 }

x-pack/plugins/maps/public/layers/sources/vector_source.js

@@ -151,4 +151,8 @@ export class AbstractVectorSource extends AbstractSource {
   getSourceTooltipContent(/* sourceDataRequest */) {
     return { tooltipContent: null, areResultsTrimmed: false };
   }
+
+  getSyncMeta() {
+    return {};
+  }
 }