[Chore]: Technical:layer base config data allow to be null (#1835)

* Allowed to become null Signed-off-by: Maksim Suslov <maksim.suslov@actionengine.com> * Format layer data returns empty when dataId null Signed-off-by: Maksim Suslov <maksim.suslov@actionengine.com> * Fixed icon layer errors Signed-off-by: Maksim Suslov <maksim.suslov@actionengine.com> * Fixed line Layer error Signed-off-by: Maksim Suslov <maksim.suslov@actionengine.com>
keplergl · May 25, 2022 · ecc743a · ecc743a
1 parent 2b51c7b
commit ecc743a
Show file tree

Hide file tree

Showing 18 changed files with 51 additions and 36 deletions.
diff --git a/src/deckgl-layers/line-layer/line-layer.ts b/src/deckgl-layers/line-layer/line-layer.ts
@@ -20,6 +20,7 @@
 
 import {LineLayer, LineLayerProps} from '@deck.gl/layers';
 import GL from '@luma.gl/constants';
+import {RGBAColor} from 'deck.gl';
 import {editShader} from '../../deckgl-layers/layer-utils/shader-utils';
 
 const defaultProps = {
@@ -86,7 +87,7 @@ function addElevationScale(vs) {
 
 export default class EnhancedLineLayer extends LineLayer<
   any,
-  LineLayerProps<any> & {elevationScale: number}
+  LineLayerProps<any> & {elevationScale: number; getTargetColor: RGBAColor}
 > {
   getShaders() {
     const shaders = super.getShaders();

diff --git a/src/deckgl-layers/svg-icon-layer/svg-icon-layer.ts b/src/deckgl-layers/svg-icon-layer/svg-icon-layer.ts
@@ -20,6 +20,8 @@
 
 import {CompositeLayer} from '@deck.gl/core';
 import {CompositeLayerProps} from '@deck.gl/core/lib/composite-layer';
+import {Position, RGBAColor} from 'deck.gl';
+import {RGBColor} from 'reducers';
 import ScatterplotIconLayer from './scatterplot-icon-layer';
 
 // default icon geometry is a square
@@ -33,6 +35,9 @@ const defaultProps = {
 export interface SvgIconLayerProps extends CompositeLayerProps<any> {
   getIconGeometry: (i: string) => number[];
   getIcon: (d: {icon: string}) => string;
+  getPosition: (d: any) => Position;
+  getRadius: ((d: any) => number) | number;
+  getFillColor: RGBColor | RGBAColor;
 }
 
 export default class SvgIconLayer extends CompositeLayer<any, SvgIconLayerProps> {

diff --git a/src/layers/aggregation-layer.ts b/src/layers/aggregation-layer.ts
@@ -281,6 +281,9 @@ export default class AggregationLayer extends Layer {
   }
 
   formatLayerData(datasets: Datasets, oldLayerData) {
+    if (this.config.dataId === null) {
+      return {};
+    }
     const {gpuFilter, dataContainer} = datasets[this.config.dataId];
     const getPosition = this.getPositionAccessor(dataContainer);
 

diff --git a/src/layers/arc-layer/arc-layer.ts b/src/layers/arc-layer/arc-layer.ts
@@ -218,6 +218,9 @@ export default class ArcLayer extends Layer {
   }
 
   formatLayerData(datasets, oldLayerData) {
+    if (this.config.dataId === null) {
+      return {};
+    }
     const {gpuFilter, dataContainer} = datasets[this.config.dataId];
     const {data} = this.updateData(datasets, oldLayerData);
     const accessors = this.getAttributeAccessors({dataContainer});

diff --git a/src/layers/base-layer.ts b/src/layers/base-layer.ts
@@ -74,8 +74,7 @@ export type VisualChannelField = Field | null;
 export type VisualChannelScale = keyof typeof SCALE_TYPES;
 
 export type LayerBaseConfig = {
-  // TODO: allow to become null
-  dataId: string;
+  dataId: string | null;
   label: string;
   color: RGBColor;
 
@@ -177,6 +176,7 @@ export type UpdateTrigger = {
   [key: string]: {};
 };
 export type LayerBounds = [number, number, number, number];
+export type FindDefaultLayerPropsReturnValue = {props: any[]; foundLayers?: any[]};
 /**
  * Approx. number of points to sample in a large data set
  */
@@ -352,7 +352,7 @@ class Layer {
   static findDefaultLayerProps(
     dataset: KeplerTable,
     foundLayers?: any[]
-  ): {props: any[]; foundLayers?: any[]} {
+  ): FindDefaultLayerPropsReturnValue {
     return {props: [], foundLayers};
   }
 
@@ -436,7 +436,6 @@ class Layer {
     props: Partial<LayerBaseConfig> = {}
   ): LayerBaseConfig & Partial<LayerColorConfig & LayerSizeConfig> {
     return {
-      // @ts-expect-error
       dataId: props.dataId || null,
       label: props.label || DEFAULT_LAYER_LABEL,
       color: props.color || colorMaker.next().value,

diff --git a/src/layers/geojson-layer/geojson-layer.ts b/src/layers/geojson-layer/geojson-layer.ts
@@ -325,6 +325,9 @@ export default class GeoJsonLayer extends Layer {
   }
 
   formatLayerData(datasets, oldLayerData) {
+    if (this.config.dataId === null) {
+      return {};
+    }
     const {gpuFilter, dataContainer} = datasets[this.config.dataId];
     const {data} = this.updateData(datasets, oldLayerData);
 

diff --git a/src/layers/h3-hexagon-layer/h3-hexagon-layer.ts b/src/layers/h3-hexagon-layer/h3-hexagon-layer.ts
@@ -238,6 +238,9 @@ export default class HexagonIdLayer extends Layer {
   // TODO: fix complexity
   /* eslint-disable complexity */
   formatLayerData(datasets, oldLayerData, opt = {}) {
+    if (this.config.dataId === null) {
+      return {};
+    }
     const {gpuFilter, dataContainer} = datasets[this.config.dataId];
     const getHexId = this.getPositionAccessor(dataContainer);
     const {data} = this.updateData(datasets, oldLayerData);

diff --git a/src/layers/heatmap-layer/heatmap-layer.ts b/src/layers/heatmap-layer/heatmap-layer.ts
@@ -231,6 +231,9 @@ class HeatmapLayer extends MapboxGLLayer {
   );
 
   formatLayerData(datasets, oldLayerData) {
+    if (this.config.dataId === null) {
+      return {};
+    }
     const {weightField} = this.config;
     const {dataContainer} = datasets[this.config.dataId];
     const getPosition = this.getPositionAccessor(dataContainer);

diff --git a/src/layers/icon-layer/icon-layer.ts b/src/layers/icon-layer/icon-layer.ts
@@ -276,6 +276,9 @@ export default class IconLayer extends Layer {
   }
 
   formatLayerData(datasets, oldLayerData) {
+    if (this.config.dataId === null) {
+      return {};
+    }
     const {textLabel} = this.config;
     const {gpuFilter, dataContainer} = datasets[this.config.dataId];
 
@@ -373,6 +376,7 @@ export default class IconLayer extends Layer {
 
           ...(hoveredObject
             ? [
+                // @ts-expect-error SvgIconLayerProps needs getIcon Field
                 new SvgIconLayer({
                   ...this.getDefaultHoverLayerProps(),
                   ...layerProps,

diff --git a/src/layers/index.d.ts b/src/layers/index.d.ts
diff --git a/src/layers/index.js → src/layers/index.ts b/src/layers/index.js → src/layers/index.ts
@@ -35,6 +35,7 @@ import {LAYER_TYPES} from './types';
 
 // base layer
 export {default as Layer, OVERLAY_TYPE, LAYER_ID_LENGTH, colorMaker} from './base-layer';
+export type {LayerBaseConfig, LayerColumns, LayerColumn} from './base-layer';
 
 // individual layers
 export const KeplerGlLayers = {
@@ -53,6 +54,7 @@ export const KeplerGlLayers = {
   S2GeometryLayer
 };
 
+export type LayerClassesType = typeof LayerClasses;
 export const LayerClasses = {
   [LAYER_TYPES.point]: PointLayer,
   [LAYER_TYPES.arc]: ArcLayer,
@@ -69,4 +71,7 @@ export const LayerClasses = {
   [LAYER_TYPES.s2]: S2GeometryLayer
 };
 
+export type OVERLAY_TYPE = {[key: string]: string};
+
 export {LAYER_VIS_CONFIGS} from './layer-factory';
+export type {LayerVisConfig} from './layer-factory';
diff --git a/src/layers/mapboxgl-layer.ts b/src/layers/mapboxgl-layer.ts
@@ -69,7 +69,7 @@ class MapboxLayerGL extends Layer {
   }
   datasetSelector = (config: MapboxLayerGLConfig) => config.dataId;
   gpuFilterSelector = (config: MapboxLayerGLConfig, datasets) =>
-    (datasets[config.dataId] || {}).gpuFilter;
+    ((config.dataId && datasets[config.dataId]) || {}).gpuFilter;
   columnsSelector = (config: MapboxLayerGLConfig) => pointColResolver(config.columns);
 
   sourceSelector = createSelector(

diff --git a/src/layers/point-layer/point-layer.ts b/src/layers/point-layer/point-layer.ts
@@ -292,6 +292,9 @@ export default class PointLayer extends Layer {
   }
 
   formatLayerData(datasets, oldLayerData) {
+    if (this.config.dataId === null) {
+      return {};
+    }
     const {textLabel} = this.config;
     const {gpuFilter, dataContainer} = datasets[this.config.dataId];
     const {data, triggerChanged} = this.updateData(datasets, oldLayerData);

diff --git a/src/layers/s2-geometry-layer/s2-geometry-layer.ts b/src/layers/s2-geometry-layer/s2-geometry-layer.ts
@@ -305,6 +305,9 @@ export default class S2GeometryLayer extends Layer {
   }
 
   formatLayerData(datasets, oldLayerData, opt = {}) {
+    if (this.config.dataId === null) {
+      return {};
+    }
     const {gpuFilter, dataContainer} = datasets[this.config.dataId];
     const getS2Token = this.getPositionAccessor(dataContainer);
     const {data} = this.updateData(datasets, oldLayerData);

diff --git a/src/layers/scenegraph-layer/scenegraph-layer.ts b/src/layers/scenegraph-layer/scenegraph-layer.ts
@@ -187,6 +187,9 @@ export default class ScenegraphLayer extends Layer {
   }
 
   formatLayerData(datasets, oldLayerData) {
+    if (this.config.dataId === null) {
+      return {};
+    }
     const {gpuFilter, dataContainer} = datasets[this.config.dataId];
     const {data} = this.updateData(datasets, oldLayerData);
     const getPosition = this.getPositionAccessor(dataContainer);

diff --git a/src/layers/trip-layer/trip-layer.ts b/src/layers/trip-layer/trip-layer.ts
@@ -244,6 +244,9 @@ export default class TripLayer extends Layer {
   }
 
   formatLayerData(datasets, oldLayerData) {
+    if (this.config.dataId === null) {
+      return {};
+    }
     // to-do: parse segment from dataContainer
     const {dataContainer, gpuFilter} = datasets[this.config.dataId];
     const {data} = this.updateData(datasets, oldLayerData);

diff --git a/src/utils/layer-utils.ts b/src/utils/layer-utils.ts
@@ -18,7 +18,7 @@
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
-import {OVERLAY_TYPE} from 'layers/base-layer';
+import {FindDefaultLayerPropsReturnValue, OVERLAY_TYPE} from 'layers/base-layer';
 import {GEOCODER_LAYER_ID} from 'constants/default-settings';
 import {Layer, LayerClassesType} from 'layers';
 import {VisState, TooltipField, CompareType, SplitMapLayers} from 'reducers/vis-state-updaters';
@@ -46,11 +46,9 @@ export function findDefaultLayer(dataset: KeplerTable, layerClasses: LayerClasse
   }
   const layerProps = (Object.keys(layerClasses) as Array<keyof LayerClassesType>).reduce(
     (previous, lc) => {
-      const result =
-        // @ts-expect-error
+      const result: FindDefaultLayerPropsReturnValue =
         typeof layerClasses[lc].findDefaultLayerProps === 'function'
-          ? // @ts-expect-error
-            layerClasses[lc].findDefaultLayerProps(dataset, previous)
+          ? layerClasses[lc].findDefaultLayerProps(dataset, previous)
           : {props: []};
 
       const props = Array.isArray(result) ? result : result.props || [];

diff --git a/tsconfig.json b/tsconfig.json
@@ -27,5 +27,5 @@
     }
   },
   "include": ["src"],
-  "exclude": ["src/deckgl-layers/cluster-layer", "src/layers"]
+  "exclude": ["src/deckgl-layers/cluster-layer"]
 }