react native – redux devuelve el estado indefinido

Estoy utilizando redux en mi proyecto de react native para poder modificar el estado de un modal, el modal en sí es un componente de yo cree utilizando redux para ir modificando el estado, este componente está siendo invocando desde otro componente que también utiliza redux para poder modificar el estado de ese modal, al menos esa es la idea, el problema viene siendo que al intentar modificar el estado desde el componente padre, este no se modifica, si yo intento con un console.log ver el estado, este me muestra que está undefined, adjunto el código.

modal.jsx

import React,{useEffect} from 'react';
import {
  View,
  StyleSheet,
  Modal,
  Animated,
  TouchableHighlight,
  Text,
  Image
} from 'react-native';
import { connect } from 'react-redux'
import {changeState} from '../../redux/actions/modal.actions'
const ModalPoup = ({visible, children}) => {
    const (showModal, setShowModal) = React.useState(visible);
    const scaleValue = React.useRef(new Animated.Value(0)).current;
    React.useEffect(() => {
      toggleModal();
    }, (visible));
    const toggleModal = () => {
      if (visible) {
        setShowModal(true);
        Animated.spring(scaleValue, {
          toValue: 1,
          duration: 300,
          useNativeDriver: false,
        }).start();
      } else {
        setTimeout(() => setShowModal(false), 200);
        Animated.timing(scaleValue, {
          toValue: 0,
          duration: 300,
          useNativeDriver: false,
        }).start();
      }
    };

    return (
      <Modal transparent visible={showModal}>
        <View style={styles.modalBackGround}>
          <Animated.View
            style={(styles.modalContainer, {transform: ({scale: scaleValue})})}>
            {children}
          </Animated.View>
        </View>
      </Modal>
    );
  };
  const ModalFunctionality = ({img,message,heg,wid,bgcolor,changeState,modal}) => {
    //const (visible, setVisible) = React.useState(vs);
    console.log(modal)
    return (
      <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
        <ModalPoup visible={modal}>
          <View style={{alignItems: 'center'}}>
            <Image
              source={img}
              style={{height: heg, width: wid, marginVertical: 10}}
            />
          </View>
  
          <Text style={{marginVertical: 30, fontSize: 20, textAlign: 'center', color:"#5B5B5B"}}>
            {message}
          </Text>
          <View style={{alignItems: 'center'}}>
            <View style={styles.header}>
              <TouchableHighlight onPress={changeState} style={styles.buttonExit,{backgroundColor:bgcolor}}>
                <Text style={styles.testButtonExit}>Ok</Text>
              </TouchableHighlight>
            </View>
          </View>
        </ModalPoup>
      </View>
    );
  };
  const mapStateToProps = (state) => {
    return {
      modal: state.modal,
    }
  }
  const mapDispatchToProps = (dispatch) => {
    return {
      changeState: () => dispatch(changeState()),
    }
  }
  const styles = StyleSheet.create({
    modalBackGround: {
      flex: 1,
      backgroundColor: 'rgba(0,0,0,0.5)',
      justifyContent: 'center',
      alignItems: 'center',
    },
    modalContainer: {
      width: '80%',
      backgroundColor: 'white',
      paddingHorizontal: 20,
      paddingVertical: 30,
      borderRadius: 20,
      elevation: 20,
    },
    header: {
      width: '100%',
      height: 40,
      alignItems: 'flex-end',
      justifyContent: 'center',
    },
    buttonExit:{
        width:'50%',
        height:50,
        borderRadius:20,
        justifyContent: 'center',
        alignItems:'center',
    },
    testButtonExit:{
        fontSize:10,
        color:"white"
    }
  });
  export default connect(mapStateToProps,mapDispatchToProps)(ModalFunctionality)

componente padre

import React,{useState,useEffect} from 'react'
import {TextInput,View,Text,StyleSheet,Image, PixelRatio,TouchableHighlight,KeyboardAvoidingView,ScrollView} from 'react-native'
import Logo from '../../assets/logo.jpg';
import BackArrow from '../../assets/back.png';
import * as Font from 'expo-font'
import ModalFunctionality from '../modal/modalPoup'
import OctopusError from '../../assets/octopuserror.jpg'
import { connect } from 'react-redux'
import {changeState} from '../../redux/actions/modal.actions'
const SignIn=({changeState,modal})=>{
    var ( isPress, setIsPress ) =useState(false);
    var ( isPress2, setIsPress2 ) =useState(false);
    const (Email,SetEmail)=useState("")
    const (Password,SetPasword)=useState("")
    const  (fontsLoaded,setFontsLoaded)=useState(false);
    const (visible,setVisible)=useState(false)
    var touchProps = {
        activeOpacity: 1,
        underlayColor: 'white',                               
        //style: isPress ? styles.btnPress : styles.btnNormal, 
        onHideUnderlay: () => setIsPress(false),
        onShowUnderlay: () => setIsPress(true),
        onPress: () => props.navigation.navigate("Login"),                
      };
      var touchProps2 = {
        activeOpacity: 1,
        underlayColor: 'white',                               
        //style: isPress ? styles.btnPress : styles.btnNormal, 
        onHideUnderlay: () => setIsPress2(false),
        onShowUnderlay: () => setIsPress2(true),
        onPress: () => submit(),                
      };
    useEffect(()=>{
        if(!fontsLoaded){
            loadFonts();
        }
    },())
    const loadFonts=async()=>{
        await Font.loadAsync({
            'BungeeRegular': require('../../assets/fonts/Bungee-Regular.ttf')
        })
        setFontsLoaded(true);
    }
    if(!fontsLoaded){
        return(<View/>)
    }
    const submit=()=>{
        SetEmail(""),
        SetPasword("")
        if(Email ==="" || Email===null){
            changeState
            setVisible(true)
            //return(<ModalFunctionality img={OctopusError} message={"Error! Please enter a valid email"} heg={70} wid={50} bgcolor={"#F82D2D"}/>)
        }else if(Password===null || Password===""){
            //return(<ModalFunctionality img={OctopusError} message={"Error! Password cannot be void"} heg={70} wid={50} bgcolor={"#F82D2D"}/>)
        } else if(
            !/^w+((.-)?w+)*@w+((.-)?w+)*(.w{2,4})+$/.test(Email)
        ){
            //return(<ModalFunctionality img={OctopusError} message={"Error! Please enter a valid email"} heg={70} wid={50} bgcolor={"#F82D2D"}/>)
        }else{
            //llamar al reducer que inicia sesión
        }
        const userSignIn={
            Email,
            Password
        }
    }

    return(
    <KeyboardAvoidingView behavior="height" style={styles.containerKeyboardScrollView}>
        <ScrollView keyboardShouldPersistTaps="always">
        <View style={styles.container}>
            <View style={styles.container2}>
                <View style={styles.container3}><TouchableHighlight {...touchProps}><View style={styles.backButton}><Image style={styles.backButtonArrow} source={BackArrow} /></View></TouchableHighlight></View>
                <View style={styles.container4}><Image source={Logo} style={styles.logo}/></View>
            </View>
            <Text style={styles.mesadokoText}>MESADOKO</Text>
            <Text style={styles.topText}>Sign In</Text>
            <TextInput
            style={styles.fieldEmail}
            placeholder="Email"
            placeholderTextColor="#ACACAC"
            name="Email"
            onChangeText={e=>SetEmail(e)}
            defaultValue={Email}
            />    
            <TextInput
            style={styles.fieldPassword}
            secureTextEntry
            placeholder="Password"
            placeholderTextColor="#ACACAC"
            onChangeText ={e=>SetPasword(e)}
            defaultValue={Password}
             />    
            <Text style={styles.bottomTextRight}>Forgot Password?</Text>
            <TouchableHighlight style={styles.signButton} {...touchProps2}><Text style={styles.signButtonText} activeOpacity={0.9}>LET'S GO!</Text></TouchableHighlight>
            <View style={styles.containerBottom}><Text style={styles.bottomText}>Privacity</Text><Text style={styles.bottomText2}> and</Text><Text style={styles.bottomText}> Data Policy</Text></View>
            {visible ? <ModalFunctionality img={OctopusError} message={"Error! Please enter a valid email"} heg={70} wid={50} bgcolor={"#F82D2D"} vs={true}/>  : null}
            {console.log(modal)}
        </View>
        </ScrollView>
    </KeyboardAvoidingView>
    )
}
const mapStateToProps = (state) => {
    return {
      modal: state.modal,
    }
  }
  const mapDispatchToProps = (dispatch) => {
    return {
      changeState: () => dispatch(changeState()),
    }
  }
const styles=StyleSheet.create({
    container:{
        flex:1,
        justifyContent:'center',
        alignItems:'center',
        paddingTop:20
    },
    containerKeyboardScrollView:{
        flex:1,
        justifyContent:'center',
        alignItems:'center',
        padding:10,
    },
    mesadokoText:{
        color:'#F28705',
        marginTop:5,
        fontSize:40,
        fontFamily:'BungeeRegular'
        
    },
    logo:{
        marginTop:5,
        width:338/PixelRatio.get(),
        height:310/PixelRatio.get(),
    },
    fieldEmail:{
        width:330,
        height:50,
        borderRadius:15,
        borderColor:'#ACACAC',
        borderWidth:2,
        justifyContent:"center",
        padding:10
    },
    fieldPassword:{
        width:330,
        height:50,
        borderRadius:15,
        borderColor:'#ACACAC',
        borderWidth:2,
        marginTop:20,
        justifyContent:"center",
        padding:10
    },
    topText:{
        marginRight:280,
        marginBottom:15,
        fontSize:17,
        color:'#5B5B5B'
    },
    bottomTextRight:{
        marginTop:15,
        fontSize:17,
        marginLeft:183,
        color:'#F28705'
    },
    bottomText:{
        marginTop:5,
        fontSize:17,
        color:'#F28705'
    },
    bottomText2:{
        marginTop:5,
        fontSize:17,
        color:'#5B5B5B'
    },
    signButton:{
        backgroundColor: '#F28705',
        justifyContent: 'center',
        alignItems:'center',
        padding: 10,
        height: 60,
        width: 330,
        borderRadius: 10,
        marginBottom:10,
        elevation: 10,
        shadowRadius: 10,
        shadowOffset: { width: 0, height: 0 },
        shadowOpacity: 0.6,
        shadowColor: 'black',
        marginTop:40
    },
    signButtonText:{
        color:'white',
        fontSize:20,
    },
    backButton:{
        paddingBottom:20,
        marginTop:10,
        paddingRight:40
    },
    backButtonArrow:{
        height:50,
        width:40,
    },
    container2:{
        display:'flex',
        flexDirection:'row',
        width:340
    },
    containerBottom:{
        display:'flex',
        flexDirection:'row'
    },
    container3:{
        marginLeft:10,
    },
    container4:{
        marginRight:80,
    }
})
export default connect(mapDispatchToProps,mapStateToProps)(SignIn)