SymbolLayer filter property data type error; unable to pass filter array

[systemlevel]

Describe the bug
SymbolLayer filter property docs specify passing a type array. When I pass an array to the filter property an exception is thrown saying "filter property must be a string".

To Reproduce

       <Mapbox.ShapeSource>
          <Mapbox.SymbolLayer 
            id="guz" 
            style={{ visibility: "visible" }}
            filter={[
                'all',
                ['==', '$type', 'Point'],
                ['in', 'type', 'Blue Project', 'WFW Project']
            ]}
          />
        </Mapbox.ShapeSource>

Expected behavior
The symbol layer should filter by the array passed into the SymbolLayer object.

Screenshots

Versions (please complete the following information):

• Platfrom: iOS
• Device: XR Simulator
• React Native Version 0.59

Additional context
Add any other context about the problem here.

In the project examples an array appears to be successfully used. For example, in the EarthQuakes.js example the CircleLayer appears to use an array filter:

            <MapboxGL.CircleLayer
              id="clusteredPoints"
              belowLayerID="pointCount"
              filter={['has', 'point_count']}
              style={layerStyles.clusteredPoints}
            />

Not sure why the SymbolLayer array I'm passing in is having the issue.

[mfazekas]

@systemlevel seems to be an upstream mapbox-native-gl / ios issue. The expression is converted to NSPredicate then back to mapbox expression.

[
                'all',
                ['==', '$type', 'Point'],
                ['in', 'type', 'Blue Project', 'WFW Project']
            ]

Becomes NSPredicate predicateWithMGLJSONObject

"$type" == "Point" AND MGL_FUNCTION("in", "type", "Blue Project", "WFW Project") == 1

Which becomes predicate mgl_jsonExpressionObject

[
                'all',
                ['==', '$type', 'Point'],
                ['==', ['in', 'type', 'Blue Project', 'WFW Project'], 1],
            ]

And then it fails to parse this expression.

[mfazekas]

Bug was reported to upstream repo: mapbox/mapbox-gl-native#14805

[systemlevel]

@mfazekas thanks so much for reporting that upstream.

[lpfunding]

Would this issue hinder the EarthQuakes.js example from working? I tried to build it in the exact same way, but the app crashes everytime I launch...

Any idea how long this bug will take to fix?

I believe this issue also exists in SymbolLayer!

[mfazekas]

@lpfunding it seems that ios mapbox-gl-native have trouble with !has too - to be reported on upstream repo.

instead of

filter={['!has', 'point_count']}

you can try:

filter={['!', ['has', 'point_count']]}

[mfazekas]

The "!has" issue was reported to upstream: mapbox/mapbox-gl-native#14861

[mfazekas]

It turns out in and '==',$type is legacy filter syntax, and it's no longer supported. Use the new expression syntax to get it work:

["all",
    ["==",["geometry-type"], "Point"],
    ["match",
       ["get", "type"],
       ["Blue Project", "WFW Project"], true,
        false]
]

"!has" is legacy filter syntax too use ["!", ["has" ...]