Replacing Datepickerandroid and Timepickerandroid by Datetimepicker, but I can not use

Question

I’m doing a project of a course I bought, but in a certain class is used the DatePickerAndroid and TimePickerAndroid, that have been discontinued (including Timepicker no more).

The code was as follows:

export default function DateTimeInputAndroid({type}){

    const [datetime, setDateTime] = useState();

    async function selectDataOrHour(){
        if(type == 'date'){
            const {action, year, month, day} = await DatePickerAndroid.open({
                mode: 'calendar'
            })
        if (action == DatePickerAndroid.dateSetAction)
        setDateTime(`${day} - ${month} - ${year}`);
        } else {
            const {action, hour, minute} = await TimePickerAndroid.open({
                is24Hour: true
            });

            if (action != TimePickerAndroid.dismissedAction)
            setDateTime(`${hour}:${minute}`);
        }
    }

    return (
        <TouchableOpacity onPress={selectDataOrHour}>
            <TextInput style={styles.input} 
            placeholder={type =='date' ? 'Clique aqui para definir a data' : 'Clique aqui para definir a hora'}
            editable={false}
            value={datetime}/>
            <Image style={styles.iconTextInput} 
            source={type =='date'? iconCalendar : iconClock} />
        </TouchableOpacity>
    )
}

I followed the instructions of the DateTimePicker, and tried to rebuild the code, but it’s not working as it should (by clicking on the Touchable, open the calendar/clock). Stayed that way:

export default function DateTimeInputAndroid({type}){

    const [datetime, setDateTime] = useState();

    setDate = (event, date) => {
        if (date !== undefined) {
          setDateTime(format(new Date(date), 'dd/MM/yyyy'));
        }
      };

      setTime = (event, date) => {
        if (date !== undefined) {
            setDateTime(format(new Date(date), 'HH:mm'));
        }
      };

    async function selectDataOrHour(){
        if(type == 'date'){
        <DateTimePicker mode='date' value={new Date()} onChange={setDate()} display='default'/>
        } else {
        <DateTimePicker is24Hour={true} mode='time' value={new Date()} onChange={setTime()}/>
        }
    }

    return (
        <TouchableOpacity onPress={selectDataOrHour}>
            <TextInput style={styles.input} 
            placeholder={type =='date' ? 'Clique aqui para definir a data' : 'Clique aqui para definir a hora'}
            editable={false}
            value={datetime}/>
            <Image style={styles.iconTextInput} 
            source={type =='date'? iconCalendar : iconClock} />
        </TouchableOpacity>
    )
}

I couldn’t identify what I did wrong, since if the Datetimepicker is created inside the Return, it runs as soon as the component is loaded normally.