[maps] add support for mvt _key property (#116204)

* [maps] add support for mvt _key property

* return property value, not key name

* eslint

* eslint

* fix jest test and update expect for second geo grid tile API test

* tslint

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

x-pack/plugins/maps/public/actions/tooltip_actions.ts

@@ -14,7 +14,7 @@ import { FEATURE_VISIBLE_PROPERTY_NAME } from '../../common/constants';
 import { TooltipFeature, TooltipState } from '../../common/descriptor_types';
 import { MapStoreState } from '../reducers/store';
 import { ILayer } from '../classes/layers/layer';
-import { IVectorLayer, getFeatureId, isVectorLayer } from '../classes/layers/vector_layer';
+import { IVectorLayer, isVectorLayer } from '../classes/layers/vector_layer';
 
 export function closeOnClickTooltip(tooltipId: string) {
   return (dispatch: Dispatch, getState: () => MapStoreState) => {
@@ -85,8 +85,7 @@ export function updateTooltipStateForLayer(layer: ILayer, layerFeatures: Feature
                 ? layerFeature.properties![FEATURE_VISIBLE_PROPERTY_NAME]
                 : true;
             return (
-              isVisible &&
-              getFeatureId(layerFeature, (layer as IVectorLayer).getSource()) === tooltipFeature.id
+              isVisible && (layer as IVectorLayer).getFeatureId(layerFeature) === tooltipFeature.id
             );
           });
 

x-pack/plugins/maps/public/classes/layers/tiled_vector_layer/tiled_vector_layer.tsx

@@ -70,6 +70,16 @@ export class TiledVectorLayer extends VectorLayer {
     this._source = source as ITiledSingleLayerVectorSource;
   }
 
+  getFeatureId(feature: Feature): string | number | undefined {
+    if (!this.getSource().isESSource()) {
+      return feature.id;
+    }
+
+    return this.getSource().getType() === SOURCE_TYPES.ES_SEARCH
+      ? feature.properties?._id
+      : feature.properties?._key;
+  }
+
   _getMetaFromTiles(): TileMetaFeature[] {
     return this._descriptor.__metaFromTiles || [];
   }

x-pack/plugins/maps/public/classes/layers/vector_layer/assign_feature_ids.ts

@@ -7,11 +7,8 @@
 
 import _ from 'lodash';
 import { FeatureCollection, Feature } from 'geojson';
-import { SOURCE_TYPES } from '../../../../common/constants';
-import { IVectorSource } from '../../sources/vector_source';
 
 export const GEOJSON_FEATURE_ID_PROPERTY_NAME = '__kbn__feature_id__';
-export const ES_MVT_FEATURE_ID_PROPERTY_NAME = '_id';
 
 let idCounter = 0;
 
@@ -60,13 +57,3 @@ export function assignFeatureIds(featureCollection: FeatureCollection): FeatureC
     features,
   };
 }
-
-export function getFeatureId(feature: Feature, source: IVectorSource): string | number | undefined {
-  if (!source.isMvt()) {
-    return feature.properties?.[GEOJSON_FEATURE_ID_PROPERTY_NAME];
-  }
-
-  return source.getType() === SOURCE_TYPES.ES_SEARCH
-    ? feature.properties?.[ES_MVT_FEATURE_ID_PROPERTY_NAME]
-    : feature.id;
-}

x-pack/plugins/maps/public/classes/layers/vector_layer/index.ts

@@ -13,4 +13,3 @@ export {
   VectorLayerArguments,
   NO_RESULTS_ICON_AND_TOOLTIPCONTENT,
 } from './vector_layer';
-export { getFeatureId } from './assign_feature_ids';

x-pack/plugins/maps/public/classes/layers/vector_layer/vector_layer.tsx

@@ -76,7 +76,7 @@ import { addGeoJsonMbSource, getVectorSourceBounds, syncVectorSource } from './u
 import { JoinState, performInnerJoins } from './perform_inner_joins';
 import { buildVectorRequestMeta } from '../build_vector_request_meta';
 import { getJoinAggKey } from '../../../../common/get_agg_key';
-import { getFeatureId } from './assign_feature_ids';
+import { GEOJSON_FEATURE_ID_PROPERTY_NAME } from './assign_feature_ids';
 
 export function isVectorLayer(layer: ILayer) {
   return (layer as IVectorLayer).canShowTooltip !== undefined;
@@ -102,6 +102,7 @@ export interface IVectorLayer extends ILayer {
   getJoinsDisabledReason(): string | null;
   getValidJoins(): InnerJoin[];
   getSource(): IVectorSource;
+  getFeatureId(feature: Feature): string | number | undefined;
   getFeatureById(id: string | number): Feature | null;
   getPropertiesForTooltip(properties: GeoJsonProperties): Promise<ITooltipProperty[]>;
   hasJoins(): boolean;
@@ -1154,6 +1155,10 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
     return this.getSource().hasTooltipProperties() || this.getJoins().length > 0;
   }
 
+  getFeatureId(feature: Feature): string | number | undefined {
+    return feature.properties?.[GEOJSON_FEATURE_ID_PROPERTY_NAME];
+  }
+
   getFeatureById(id: string | number) {
     const featureCollection = this._getSourceFeatureCollection();
     if (!featureCollection) {
@@ -1161,7 +1166,7 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
     }
 
     const targetFeature = featureCollection.features.find((feature) => {
-      return getFeatureId(feature, this.getSource()) === id;
+      return this.getFeatureId(feature) === id;
     });
     return targetFeature ? targetFeature : null;
   }

x-pack/plugins/maps/public/connected_components/mb_map/tooltip_control/tooltip_control.test.tsx

@@ -14,6 +14,7 @@ jest.mock('./tooltip_popover', () => ({
 import sinon from 'sinon';
 import React from 'react';
 import { mount, shallow } from 'enzyme';
+import { Feature } from 'geojson';
 import type { Map as MbMap, MapMouseEvent, MapboxGeoJSONFeature } from '@kbn/mapbox-gl';
 import { TooltipControl } from './tooltip_control';
 import { IVectorLayer } from '../../../classes/layers/vector_layer';
@@ -39,15 +40,8 @@ const mockLayer = {
   getMbTooltipLayerIds: () => {
     return ['foo', 'bar'];
   },
-  getSource: () => {
-    return {
-      isMvt: () => {
-        return false;
-      },
-      isESSource: () => {
-        return false;
-      },
-    };
+  getFeatureId: (feature: Feature) => {
+    return feature.properties?.__kbn__feature_id__;
   },
   getFeatureById: () => {
     return {

x-pack/plugins/maps/public/connected_components/mb_map/tooltip_control/tooltip_control.tsx

@@ -29,7 +29,7 @@ import {
 import { TooltipPopover } from './tooltip_popover';
 import { FeatureGeometryFilterForm } from './features_tooltip';
 import { ILayer } from '../../../classes/layers/layer';
-import { IVectorLayer, isVectorLayer, getFeatureId } from '../../../classes/layers/vector_layer';
+import { IVectorLayer, isVectorLayer } from '../../../classes/layers/vector_layer';
 import { RenderToolTipContent } from '../../../classes/tooltips/tooltip_property';
 
 function justifyAnchorLocation(
@@ -204,7 +204,7 @@ export class TooltipControl extends Component<Props, {}> {
         break;
       }
 
-      const featureId = getFeatureId(mbFeature, layer.getSource());
+      const featureId = layer.getFeatureId(mbFeature);
       const layerId = layer.getId();
       let match = false;
       for (let j = 0; j < uniqueFeatures.length; j++) {
@@ -288,7 +288,7 @@ export class TooltipControl extends Component<Props, {}> {
     const layer = this._getLayerByMbLayerId(targetMbFeature.layer.id);
     if (layer && this.props.openTooltips[0] && this.props.openTooltips[0].features.length) {
       const firstFeature = this.props.openTooltips[0].features[0];
-      if (getFeatureId(targetMbFeature, layer.getSource()) === firstFeature.id) {
+      if (layer.getFeatureId(targetMbFeature) === firstFeature.id) {
         // ignore hover events when hover tooltip is all ready opened for feature
         return;
       }

x-pack/test/api_integration/apis/maps/get_grid_tile.js

@@ -12,8 +12,7 @@ import expect from '@kbn/expect';
 export default function ({ getService }) {
   const supertest = getService('supertest');
 
-  // FLAKY: https://github.com/elastic/kibana/issues/116186
-  describe.skip('getGridTile', () => {
+  describe('getGridTile', () => {
     it('should return vector tile containing cluster features', async () => {
       const resp = await supertest
         .get(
@@ -36,7 +35,11 @@ export default function ({ getService }) {
       expect(clusterFeature.type).to.be(1);
       expect(clusterFeature.extent).to.be(4096);
       expect(clusterFeature.id).to.be(undefined);
-      expect(clusterFeature.properties).to.eql({ _count: 1, 'avg_of_bytes.value': 9252 });
+      expect(clusterFeature.properties).to.eql({
+        _count: 1,
+        _key: '10/258/404',
+        'avg_of_bytes.value': 9252,
+      });
       expect(clusterFeature.loadGeometry()).to.eql([[{ x: 87, y: 667 }]]);
 
       // Metadata feature
@@ -92,7 +95,11 @@ export default function ({ getService }) {
       expect(gridFeature.type).to.be(3);
       expect(gridFeature.extent).to.be(4096);
       expect(gridFeature.id).to.be(undefined);
-      expect(gridFeature.properties).to.eql({ _count: 1, 'avg_of_bytes.value': 9252 });
+      expect(gridFeature.properties).to.eql({
+        _count: 1,
+        _key: '10/258/404',
+        'avg_of_bytes.value': 9252,
+      });
       expect(gridFeature.loadGeometry()).to.eql([
         [
           { x: 64, y: 672 },