React Native Picker closes modal on change

[Dragonslayer42069]

Everytime I pick a value in my picker which is contained in my modal, my modal closes immediately. My list for the picker is loaded correctly. I think it has something to do with my onValueChange. It seems something is triggering a rerendering there.

console.log(friend) shows me the picked value. Any ideas how to debug it?

  const [friend, setFriend] = useState("");
  const [modalVisible, setModalVisible] = useState(false);
  const [selectedId, setSelectedId] = useState(null);

  const allFriendlist = useSelector(
    (state) => state.reducer.availableFriendlist
  );
  const Item = () => (
    <View style={styles.formContainer}>
      <Modal animationType="slide" transparent={true} visible={modalVisible}>
        <View>
          <View>
          </View>
        </View>
        <Picker
          selectedValue={friend}
          onValueChange={(desc) => setFriend(desc)}
        >
          <Picker.Item label="pick a friend" value="" color="grey" />
          {allFriendlist.map((item, index) => {
            return (
              <Picker.Item
                label={item.id}
                value={item.id}
                key={index}
                color="#E9446A"
              />
            );
          })}
        </Picker>
      </Modal>

      <TouchableOpacity
        onPress={() => {
          setModalVisible(true);
          getDetails(props);
        }}
      >
        <View></View>
      </TouchableOpacity>
    </View>
  );

  return (
    <View>
      <TouchableOpacity>
        <Item
          item={props}
          onPress={() => {
            getDetails(props);
            setSelectedId(props.ID);
            setModalVisible(true);
          }}
        />
      </TouchableOpacity>
    </View>
  );
}