Sometimes it takes multiple clicks to open and close dropdown select

[AyoCodess]

I have only tested this on IOS only, latest version.

it can work as normal open/close then suddenly it open and closes on every other click. Has anyone else encountered this?

[AyoCodess]

https://github.com/azeezat/react-native-select/assets/72066389/eec0feea-eb28-413c-a309-756a798846f7

[azeezat]

Hello @AyoCodess Thanks for reporting this issue. Kindly add an example code to help us debug this quickly. Thanks.

[AyoCodess]

Hello @AyoCodess Thanks for reporting this issue. Kindly add an example code to help us debug this quickly. Thanks.

This example is nothing special, there is something not working correctly/efficiency with the firing of the open and close event listeners for the dropdown probably. is there a cleanup function on these event listers?

export function GeneralDropdown({
  options,
  selectedValue,
  onValueChange,
  placeholder,
  color = theme.raw.colors.waffle.primary,
  colorText = theme.raw.colors.waffle.primary,
  height = 400
}: {
  options: { label: string; value: string }[];
  selectedValue: string | number | boolean | string[] | boolean[] | number[] | null | undefined
  onValueChange: (value: string) => void;
  placeholder: string;
  color?: string;
  colorText?: string;
  height?: number;
}) {
  return (
    <View
      className="px-4 py-2 bg-white justify-center rounded-md ">
      <View className=' mb-[-1.4rem] '>
        <DropdownSelect
          modalControls={{
            modalOptionsContainerStyle: {
              height: height,
              backgroundColor: colorText,

            }
          }}
          listComponentStyles={{
            itemSeparatorStyle: {
              borderStyle: 'solid',
              borderWidth: 1,
              borderColor: 'white',
              marginHorizontal: 10
            }

          }}
          placeholder={placeholder}
          placeholderStyle={{
            fontSize: 18,
            color: colorText,
            fontWeight: 'bold'
          }}
          selectedItemStyle={{
            color: colorText,
            fontSize: 18,
            fontWeight: 'bold'
          }}
          checkboxControls={{
            checkboxSize: 15,
            checkboxStyle: {
              backgroundColor: color,
              borderRadius: 30,
              padding: 5,
              borderColor: 'white'
            },
            checkboxLabelStyle: { color: 'white',fontSize: 20 }
          }}

          dropdownIcon={
            <Feather
              name="chevron-down"
              size={30}
              color={color}
            />
          }
          dropdownIconStyle={{ top: 0,right: 0 }}
          options={options}
          selectedValue={selectedValue}
          onValueChange={onValueChange}
          primaryColor={'green'}
        />
      </View>
    </View>)
}

[azeezat]

Closing - the component has been updated significantly since this issue was posted.