import { View, Text, StyleSheet } from "react-native";
import { DateTextInput } from "../../common/components/form/date_text_input";
import { Control, Controller } from "react-hook-form";
import { SetUpProfileFormValues } from "../hooks/useSetUpProfile";

interface BirthdateSlideProps {
    control: Control<SetUpProfileFormValues, any>;
}

export const BirthdateSlide = ({ control }: BirthdateSlideProps) => {
    return (
        <View style={styles.container}>
            <Text>Selecciona tu fecha de nacimiento</Text>
            <Controller
                control={control}
                render={({ field: { onChange, value } }) => (
                    <DateTextInput
                        value={value}
                        onChangeText={onChange}
                        label="Fecha de nacimiento"
                    />
                )}
                name="birthdate"
                defaultValue=" "
            />
        </View>
    );
};

const styles = StyleSheet.create({
    container: {
        flex: 1,
        width: "100%",
        gap: 20,
    },
});