belowLayerID on iOS is not working properly with dynamic layers

[npasparuhov]

I have this code:

<MapboxGL.Animated.ShapeSource
    id="pulseCircleSource"
    shape={MapboxGL.geoUtils.makePoint(this.props.coords)}>
    <MapboxGL.Animated.CircleLayer
      aboveLayerID={this.props.hasRoute ? 'progressFill' : null}
      id="pulseOuterCircle"
      style={outerCircleStyle}
    />
</MapboxGL.Animated.ShapeSource>
{route && route.length > 1 ? (
    <MapboxGL.Animated.ShapeSource id="routeSource" shape={makeLineString(route)}>
      <MapboxGL.Animated.LineLayer
            id="routeFill"
            belowLayerID="pulseOuterCircle"
            style={layerStyles.route}
       />
    </MapboxGL.Animated.ShapeSource>
  ) : null}

Simple point and line, the line is rendered later on when the route info is returned from api request.

So into the LineLayer i used belowLayerID prop which on iOS screams that - A style layer cannot be placed above (null) in the style. Make sure sibling was obtained using -[MGLStyle layerWithIdentifier:]

[npasparuhov]

In case to use belowLayerID and aboveLayerID (bellowLayerID='exampleID') should be placed on layers that are after the layer with id exempleID

in my case i had: LineLayer id='routeFill' belowLayerID ='pulseOuterCircle' LineLayer id='pulseOuterCircle'

So it init first the 'routeFill' layer and after that 'pulseOuterCircle' so when it tries to init 'routeFill' it can not find 'pulseOuterCircle' layer and con not position it correctly