AppTextInput component props for text input not working

React Native
1

Hey there so I am trying to use a custom text input and giving it props like autoCorrect, autoCapitalise etc but for some reason are not working and only work when I use them directly on the original TextInput imported from react native module. Here is my code of how I am doing it. Please help me see where or what I am doing wrong.

 import React from 'react'
import { Image, StyleSheet, View } from 'react-native'
import AppTextInput from '../components/AppTextInput'
import { Formik } from 'formik'
import * as Yup from "yup"
import Screen from '../components/Screen'
import AppBtn from "../components/AppBtn"
import AppText from '../components/AppText'

const validationSchema = Yup.object().shape({
    email: Yup.string().required().email().label("Email"),
    password: Yup.string().required().min(4).label("Password")
})

export default function LoginScreen() {
const img = require("../assets/logo.png");

return (
    <Screen>
        <Image source={img} style={styles.logo} />

        <Formik initialValues={{email: "", password: ""}}
         onSubmit={values => console.log(values)}
         validationSchema={validationSchema}
         >
             {({handleChange, handleSubmit, errors}) => (
                 <>
                    <AppTextInput 
                        autoCapitalize="none"
                        autoCorrect={false}
                        icon="email"
                        onChangeText={handleChange("email")}
                        keyboardType="email-address"
                        placeholder="email"
                    />
                    <AppText style={{color: "red"}}>{errors.email}</AppText>
                    <AppTextInput 
                        autoCapitalize="none"
                        autoCorrect={true}
                        icon="lock"
                        keyboardType="numeric"
                        onChangeText={handleChange("password")}
                        secureTextEntry={true}
                        placeholder="password"
                    />
                    <AppText style={{color: "red"}}>{errors.password}</AppText>
                    <View style={styles.btn}>
                        <AppBtn title="Login" onPress={handleSubmit} />
                    </View>
                 </>
             )}
        </Formik>
    </Screen>
)

And this below is the textinput component

 import { StyleSheet, Text, TextInput, View } from 'react-native'
import {MaterialCommunityIcons} from '@expo/vector-icons'

export default function AppTextInput({icon, placeholder}) {
    return (
        <View style={styles.container}>
            {/* render only if icon is defined */}
            {icon && <MaterialCommunityIcons name={icon} size={40} style={styles.icon} />}
            <TextInput style={{fontSize: 25}} placeholder={placeholder} />
        </View>
    )
}

So where could I be going wrong please help