React Native custom drop down component

i'm building Raect Native with Expo, trying to make custom dropdown and i find and article wit an awesome expiation how to do that here

i want to build an drop down able the user select their birthday date , also i used class component.

the article code written with typeScript syntax, but my project using a javaScript syntax so i facing syntax issue .

dropDown component:

const Dropdown = ({ props } , ) => {  const { label, data , onSelect} = props    const DropdownButton = useRef();    const [dropdownTop, setDropdownTop] = useState(0);    const renderDropdown = () => {      if (visible) {        return (<Text style={styles.dropdown}>              This is where the dropdown will be rendered.</Text>        );      }    };    const toggleDropdown = ()=> {      visible ? setVisible(false) : openDropdown();    };    const openDropdown = () => {      DropdownButton.current.measure((_fx, _fy, _w, h, _px, py) => {        setDropdownTop(py + h);      });      setVisible(true);    };    const renderItem = ({ item }) => (<TouchableOpacity style={styles.item} onPress={() => onItemPress(item)}><Text>{item.label}</Text></TouchableOpacity>    );    const onItemPress = (item)=> {      setSelected(item);      onSelect(item);      setVisible(false);    };    return (<Modal visible={visible} transparent animationType="none"><TouchableOpacity         ref={DropdownButton}         style={styles.button}         onPress={toggleDropdown}><View style={[styles.dropdown, { top: dropdownTop }]}><FlatList              data={data}              renderItem={renderItem}              keyExtractor={(item, index) => index.toString()}            /></View></TouchableOpacity></Modal>    );  };

where i render the component(class component) :

render() {const [selected, setSelected] = (undefined);    return (<View                style={{                  flex: 1,                  borderColor: 'lightgray',                  flexDirection: 'row',                  alignItems: 'center',                  justifyContent: 'space-between',                  borderWidth: 1,                  borderRadius: 10,                  padding: 5,                  marginHorizontal: 5,                }}><Dropdown                  label= {i18n.locale == 'en' ? 'Day' : 'يوم'}                   data={days}                   onSelect={setSelected} /></View>    )}

i did run the code and struggle with an multiple issues, i think the syntax errors(not sure of that)if there is a way make my component better (i new to clean code and interesting to improve my code )