[Bug]: PointAnnotation `selected` not allowing controlled values

[mgray88]

Mapbox Implementation

Mapbox

Mapbox Version

11.15.2

React Native Version

0.79.6

React Native Architecture

New Architecture (Fabric/TurboModules)

Platform

Android, iOS

@rnmapbox/maps version

10.1.45

Standalone component to reproduce

import React from 'react';
import {
  MapView,
  ShapeSource,
  LineLayer,
  Camera,
  PointAnnotation,
} from '@rnmapbox/maps';

function BugReportExample() {
  const [selected, setSelected] = React.useState(false);
  React.useEffect(() => {
    console.log('Selected:', selected);
  }, [selected]);

  return (
    <MapView 
      style={{flex: 1}}
      onPress={() => setSelected(false)}
    >
      <Camera centerCoordinate={[-74.00597, 40.71427]} zoomLevel={14} />
      <PointAnnotation
        coordinate={[-74.00597, 40.71427]}
        selected={selected}
        onSelected={() => {
          console.log('onSelected');
          setSelected(true)
        }}
        onDeselected={() => {
          console.log('onDeselected');
          setSelected(false)
        }}
      />
    </MapView>
  );
}

Observed behavior and steps to reproduce

The PointAnnotation component is not responding to the selected property being passed in. In the example, tapping the PointAnnotation sets the selected state value to true. Internally the PointAnnotation should be selected, and that seems to be the case. Tapping on the map sets the selected state value to false, and should update the PointAnnotation to be deselected internally. However tapping again on the PointAnnotation we see the onDeselected callback gets called instead of the expected onSelected callback.

Expected behavior

The PointAnnotation component should allow the selected property to be controlled externally

Notes / preliminary analysis

No response

Additional links and references

No response

[mfazekas]

Looked into it on iOS:

• the selected property is not mapped to point annotation selected
• point annotation select callback, etc is done in PointAnnotationManager: https://github.com/rnmapbox/maps/blob/main/ios/RNMBX/RNMBXMapView.swift#L1535-L1549 and need to connect the two