Convert VectorLayer to typescript (#78490) (#79239)

* [maps] convert VectorLayer to TS

* more tslint fixes

* clean up

* more tslint fixes

* more tslint fixes

* remove unneeded casts

* remove unneeded VectorStyle casts

* revert changes to layer.getQuery

* fix

* update tile layer constructor

* review feedback

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

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

Author: nreese

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

@@ -38,15 +38,21 @@ export type VectorSourceRequestMeta = MapFilters & {
   applyGlobalQuery: boolean;
   fieldNames: string[];
   geogridPrecision?: number;
-  sourceQuery: MapQuery;
+  sourceQuery?: MapQuery;
   sourceMeta: VectorSourceSyncMeta;
 };
 
+export type VectorJoinSourceRequestMeta = MapFilters & {
+  applyGlobalQuery: boolean;
+  fieldNames: string[];
+  sourceQuery: MapQuery;
+};
+
 export type VectorStyleRequestMeta = MapFilters & {
   dynamicStyleFields: string[];
   isTimeAware: boolean;
   sourceQuery: MapQuery;
-  timeFilters: unknown;
+  timeFilters: TimeRange;
 };
 
 export type ESSearchSourceResponseMeta = {
@@ -59,9 +65,12 @@ export type ESSearchSourceResponseMeta = {
 };
 
 // Partial because objects are justified downstream in constructors
-export type DataMeta = Partial<VectorSourceRequestMeta> &
-  Partial<VectorStyleRequestMeta> &
-  Partial<ESSearchSourceResponseMeta>;
+export type DataMeta = Partial<
+  VectorSourceRequestMeta &
+    VectorJoinSourceRequestMeta &
+    VectorStyleRequestMeta &
+    ESSearchSourceResponseMeta
+>;
 
 type NumericalStyleFieldData = {
   avg: number;

x-pack/plugins/maps/common/descriptor_types/map_descriptor.ts

@@ -17,7 +17,7 @@ export type MapExtent = {
 };
 
 export type MapQuery = Query & {
-  queryLastTriggeredAt: string;
+  queryLastTriggeredAt?: string;
 };
 
 export type MapRefreshConfig = {

x-pack/plugins/maps/common/elasticsearch_util/es_agg_utils.ts

@@ -33,8 +33,10 @@ export function addFieldToDSL(dsl: object, field: IFieldType) {
       };
 }
 
+export type BucketProperties = Record<string | number, unknown>;
+
 export function extractPropertiesFromBucket(bucket: any, ignoreKeys: string[] = []) {
-  const properties: Record<string | number, unknown> = {};
+  const properties: BucketProperties = {};
   for (const key in bucket) {
     if (ignoreKeys.includes(key) || !bucket.hasOwnProperty(key)) {
       continue;

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

@@ -47,7 +47,7 @@ const FIT_TO_BOUNDS_SCALE_FACTOR = 0.1;
 
 export type DataRequestContext = {
   startLoading(dataId: string, requestToken: symbol, meta: DataMeta): void;
-  stopLoading(dataId: string, requestToken: symbol, data: object, meta: DataMeta): void;
+  stopLoading(dataId: string, requestToken: symbol, data: object, meta?: DataMeta): void;
   onLoadError(dataId: string, requestToken: symbol, errorMessage: string): void;
   updateSourceData(newData: unknown): void;
   isRequestStillActive(dataId: string, requestToken: symbol): boolean;

x-pack/plugins/maps/public/classes/joins/inner_join.d.ts

@@ -4,19 +4,40 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { Feature, GeoJsonProperties } from 'geojson';
 import { IESTermSource } from '../sources/es_term_source';
-import { IJoin } from './join';
+import { IJoin, PropertiesMap } from './join';
 import { JoinDescriptor } from '../../../common/descriptor_types';
 import { ISource } from '../sources/source';
+import { ITooltipProperty } from '../tooltips/tooltip_property';
+import { IField } from '../fields/field';
 
 export class InnerJoin implements IJoin {
   constructor(joinDescriptor: JoinDescriptor, leftSource: ISource);
 
+  destroy: () => void;
+
   getRightJoinSource(): IESTermSource;
 
   toDescriptor(): JoinDescriptor;
 
+  getJoinFields: () => IField[];
+
+  getLeftField: () => IField;
+
+  getIndexPatternIds: () => string[];
+
+  getQueryableIndexPatternIds: () => string[];
+
+  getSourceDataRequestId: () => string;
+
   getSourceMetaDataRequestId(): string;
 
   getSourceFormattersDataRequestId(): string;
+
+  getTooltipProperties(properties: GeoJsonProperties): Promise<ITooltipProperty[]>;
+
+  hasCompleteConfig: () => boolean;
+
+  joinPropertiesToFeature: (feature: Feature, propertiesMap?: PropertiesMap) => boolean;
 }

x-pack/plugins/maps/public/classes/joins/join.ts

@@ -4,15 +4,39 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { Feature, GeoJsonProperties } from 'geojson';
 import { IESTermSource } from '../sources/es_term_source';
 import { JoinDescriptor } from '../../../common/descriptor_types';
+import { ITooltipProperty } from '../tooltips/tooltip_property';
+import { IField } from '../fields/field';
+import { BucketProperties } from '../../../common/elasticsearch_util';
+
+export type PropertiesMap = Map<string, BucketProperties>;
 
 export interface IJoin {
-  getRightJoinSource(): IESTermSource;
+  destroy: () => void;
+
+  getRightJoinSource: () => IESTermSource;
+
+  toDescriptor: () => JoinDescriptor;
+
+  getJoinFields: () => IField[];
+
+  getLeftField: () => IField;
+
+  getIndexPatternIds: () => string[];
+
+  getQueryableIndexPatternIds: () => string[];
+
+  getSourceDataRequestId: () => string;
+
+  getSourceMetaDataRequestId: () => string;
+
+  getSourceFormattersDataRequestId: () => string;
 
-  toDescriptor(): JoinDescriptor;
+  getTooltipProperties: (properties: GeoJsonProperties) => Promise<ITooltipProperty[]>;
 
-  getSourceMetaDataRequestId(): string;
+  hasCompleteConfig: () => boolean;
 
-  getSourceFormattersDataRequestId(): string;
+  joinPropertiesToFeature: (feature: Feature, propertiesMap?: PropertiesMap) => boolean;
 }

x-pack/plugins/maps/public/classes/layers/blended_vector_layer/blended_vector_layer.ts

@@ -37,7 +37,6 @@ import {
   LayerDescriptor,
   VectorLayerDescriptor,
 } from '../../../../common/descriptor_types';
-import { IStyle } from '../../styles/style';
 import { IVectorSource } from '../../sources/vector_source';
 
 const ACTIVE_COUNT_DATA_ID = 'ACTIVE_COUNT_DATA_ID';
@@ -257,7 +256,7 @@ export class BlendedVectorLayer extends VectorLayer implements IVectorLayer {
     return clonedDescriptor;
   }
 
-  getSource() {
+  getSource(): IVectorSource {
     return this._isClustered ? this._clusterSource : this._documentSource;
   }
 
@@ -268,11 +267,11 @@ export class BlendedVectorLayer extends VectorLayer implements IVectorLayer {
     return this._documentSource;
   }
 
-  getCurrentStyle(): IStyle {
+  getCurrentStyle(): IVectorStyle {
     return this._isClustered ? this._clusterStyle : this._documentStyle;
   }
 
-  getStyleForEditing(): IStyle {
+  getStyleForEditing(): IVectorStyle {
     return this._documentStyle;
   }
 
@@ -281,8 +280,8 @@ export class BlendedVectorLayer extends VectorLayer implements IVectorLayer {
     const requestToken = Symbol(`layer-active-count:${this.getId()}`);
     const searchFilters = this._getSearchFilters(
       syncContext.dataFilters,
-      this.getSource() as IVectorSource,
-      this.getCurrentStyle() as IVectorStyle
+      this.getSource(),
+      this.getCurrentStyle()
     );
     const canSkipFetch = await canSkipSourceUpdate({
       source: this.getSource(),

x-pack/plugins/maps/public/classes/layers/heatmap_layer/heatmap_layer.js

@@ -31,6 +31,18 @@ export class HeatmapLayer extends VectorLayer {
     }
   }
 
+  getStyleForEditing() {
+    return this._style;
+  }
+
+  getStyle() {
+    return this._style;
+  }
+
+  getCurrentStyle() {
+    return this._style;
+  }
+
   _getPropKeyOfSelectedMetric() {
     const metricfields = this.getSource().getMetricFields();
     return metricfields[0].getName();

x-pack/plugins/maps/public/classes/layers/layer.test.ts

@@ -7,7 +7,6 @@
 
 import { AbstractLayer } from './layer';
 import { ISource } from '../sources/source';
-import { IStyle } from '../styles/style';
 import { AGG_TYPE, FIELD_ORIGIN, LAYER_STYLE_TYPE, VECTOR_STYLES } from '../../../common/constants';
 import { ESTermSourceDescriptor, VectorStyleDescriptor } from '../../../common/descriptor_types';
 import { getDefaultDynamicProperties } from '../styles/vector/vector_style_defaults';
@@ -38,8 +37,6 @@ class MockSource {
   }
 }
 
-class MockStyle {}
-
 describe('cloneDescriptor', () => {
   describe('with joins', () => {
     const styleDescriptor = {
@@ -84,7 +81,6 @@ describe('cloneDescriptor', () => {
       const layer = new MockLayer({
         layerDescriptor,
         source: (new MockSource() as unknown) as ISource,
-        style: (new MockStyle() as unknown) as IStyle,
       });
       const clonedDescriptor = await layer.cloneDescriptor();
       const clonedStyleProps = (clonedDescriptor.style as VectorStyleDescriptor).properties;
@@ -122,7 +118,6 @@ describe('cloneDescriptor', () => {
       const layer = new MockLayer({
         layerDescriptor,
         source: (new MockSource() as unknown) as ISource,
-        style: (new MockStyle() as unknown) as IStyle,
       });
       const clonedDescriptor = await layer.cloneDescriptor();
       const clonedStyleProps = (clonedDescriptor.style as VectorStyleDescriptor).properties;
@@ -165,7 +160,6 @@ describe('isFittable', () => {
       const layer = new MockLayer({
         layerDescriptor,
         source: (new MockSource({ fitToBounds: test.fitToBounds }) as unknown) as ISource,
-        style: (new MockStyle() as unknown) as IStyle,
       });
       expect(await layer.isFittable()).toBe(test.canFit);
     });

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

@@ -110,13 +110,11 @@ export type CustomIconAndTooltipContent = {
 export interface ILayerArguments {
   layerDescriptor: LayerDescriptor;
   source: ISource;
-  style: IStyle;
 }
 
 export class AbstractLayer implements ILayer {
   protected readonly _descriptor: LayerDescriptor;
   protected readonly _source: ISource;
-  protected readonly _style: IStyle;
   protected readonly _dataRequests: DataRequest[];
 
   static createDescriptor(options: Partial<LayerDescriptor>): LayerDescriptor {
@@ -140,10 +138,9 @@ export class AbstractLayer implements ILayer {
     }
   }
 
-  constructor({ layerDescriptor, source, style }: ILayerArguments) {
+  constructor({ layerDescriptor, source }: ILayerArguments) {
     this._descriptor = AbstractLayer.createDescriptor(layerDescriptor);
     this._source = source;
-    this._style = style;
     if (this._descriptor.__dataRequests) {
       this._dataRequests = this._descriptor.__dataRequests.map(
         (dataRequest) => new DataRequest(dataRequest)
@@ -257,11 +254,15 @@ export class AbstractLayer implements ILayer {
   }
 
   getStyleForEditing(): IStyle {
-    return this._style;
+    throw new Error('Should implement AbstractLayer#getStyleForEditing');
   }
 
-  getStyle() {
-    return this._style;
+  getStyle(): IStyle {
+    throw new Error('Should implement AbstractLayer#getStyle');
+  }
+
+  getCurrentStyle(): IStyle {
+    throw new Error('Should implement AbstractLayer#getCurrentStyle');
   }
 
   getLabel(): string {
@@ -412,10 +413,6 @@ export class AbstractLayer implements ILayer {
     return this._descriptor.query ? this._descriptor.query : null;
   }
 
-  getCurrentStyle(): IStyle {
-    return this._style;
-  }
-
   async getImmutableSourceProperties() {
     const source = this.getSource();
     return await source.getImmutableProperties();