Edit Handles not rendered in EditableGeoJsonLayer

[kevinresol]

Describe the bug

The edit handle circles (or icons) are not rendered.

Reason:

This commit changed the sublayer name from points to points-circle, points-icon, etc

[phytter]

Have you find a workaround for this?

[kevinresol]

Yes here it is:

diff --git a/modules/layers/src/layers/editable-geojson-layer.ts b/modules/layers/src/layers/editable-geojson-layer.ts
index b976ecc..f4ef4f9 100644
--- a/modules/layers/src/layers/editable-geojson-layer.ts
+++ b/modules/layers/src/layers/editable-geojson-layer.ts
@@ -388,7 +388,9 @@ export default class EditableGeoJsonLayer extends EditableLayer {
     }
 
     let pointLayerProps;
+    let pointType;
     if (this.props.editHandleType === 'icon') {
+      pointType = 'icon';
       pointLayerProps = {
         type: IconLayer,
         iconAtlas: this.props.editHandleIconAtlas,
@@ -400,6 +402,7 @@ export default class EditableGeoJsonLayer extends EditableLayer {
         getAngle: guideAccessor(this.props.getEditHandleIconAngle),
       };
     } else {
+      pointType = 'circle';
       pointLayerProps = {
         type: ScatterplotLayer,
         radiusScale: this.props.editHandlePointRadiusScale,
@@ -419,8 +422,10 @@ export default class EditableGeoJsonLayer extends EditableLayer {
         data: guides,
         fp64: this.props.fp64,
         _subLayerProps: {
-          points: pointLayerProps,
+          "points-circle": pointLayerProps,
+          "points-icon": pointLayerProps,
         },
+        pointType: pointType,
         lineWidthScale: this.props.lineWidthScale,
         lineWidthMinPixels: this.props.lineWidthMinPixels,
         lineWidthMaxPixels: this.props.lineWidthMaxPixels,

[JulesBlm]

Thanks to @kevinresol comment I found a workaround. Edit handles can be styled by defining props for 'points-circle' on _subLayerProps of the guides _subLayerProps, see the example, much clearer

const editLayer = new EditableGeoJsonLayer({
    id: 'editable-geojson-layer',
    pickable: true,
    onEdit: (editInfo) => {},
    pickingRadius: 15,
    mode,
    selectedFeatureIndexes, 
    data,
    pointRadiusScale: 0,
    getTentativeFillColor: [124, 124, 124, 75],
    getTentativeLineColor: [124, 124, 124, 255],
    _subLayerProps: {
      guides: {
        pointType: 'circle',
        _subLayerProps: {
          'points-circle': {
            // Styling for editHandles goes here
            type: ScatterplotLayer,
            radiusScale: 1,
            stroked: true,
            getLineWidth: 1,
            radiusMinPixels: 4,
            radiusMaxPixels: 8,
            getRadius: 2,
            getFillColor: [220, 10, 0],
            getLineColor: [250, 250, 250],
          },
        },
      },
      geojson: {
        getRadius: 50,
        lineWidthUnits: 'pixels',
        pointRadiusScale: 0,
        getPointRadius: 0,
        pointRadiusMaxPixels: 0,
      },
    },
  });