React-native hooks form validation

I am practicing React native. I have created two input fields. where user can type email and password. I made one state with three variables, they are email, password and errorMessage. For Email validation I have use Firebase. when submit the form without filling anything I got invalid error, so it means my firebase auth works. But when fill up the form with email and password field then I am getting Error Error: signInWithEmailAndPassword failed: First argument "email" must be a valid string.

when I console log the handleChange Events. I am getting bunch of objects. it looks this:

am event SyntheticEvent {
  "_dispatchInstances": FiberNode {
    "tag": 5,
    "key": null,
    "type": "RCTSinglelineTextInputView",
  },
  "_dispatchListeners": [Function _onChange],
  "_targetInst": FiberNode {
    "tag": 5,
    "key": null,
    "type": "RCTSinglelineTextInputView",
  },
  "bubbles": undefined, and so on ........

Instead of React native's onChangeText I have used onChange. I also tried with onChangeText but I got the same error. Is there any way to submit the react native form in functional component?

This is my signIn form

import React, { ReactElement, useState } from 'react';
import styled from 'styled-components';
import { Text, View, TextInput, TouchableOpacity } from 'react-native';
import * as firebase from 'firebase';

interface Props {

}

export default function Login({ }: Props): ReactElement {

  const [state, setState] = useState({
    email: '',
    password: '',
    errorMessage: null
  })


  const { errorMessage } = state;

  const handleChange = event => {
    console.log("I am event", event);
    setState({
      ...state,
      [event.target.id]: event.target.value
    });
  };

  const handleSubmit = event => {
    event.preventDefault();
    const { email, password } = state;
    firebase.auth().signInWithEmailAndPassword(email, password).catch(error => setState({ errorMessage: error.message }))
  };


  // const handleSubmit = () => {
  //   const { email, password } = state;
  //   firebase.auth().signInWithEmailAndPassword(email, password).catch(error => setState({ errorMessage: error.message }))
  // }

  return (
    <Container>
      <Greeting >{`Hello again. \nWelcome Back`}</Greeting>
      <ErrorMessageContainer >
        {ErrorMessage && <ErrorMessage >{errorMessage} </ErrorMessage>}
      </ErrorMessageContainer>
      <Form style={{ marginHorizontal: 30 }}>
        <View>
          <InputTitle>
            Email Address
          </InputTitle>
          <Input
            autoCapitalize="none"
            onChange={handleChange}
            value={state.email}
            id="email"
          ></Input>
        </View>
        <View style={{ marginTop: 32 }}>
          <InputTitle>
            password
         </InputTitle>
          <Input
            secureTextEntry
            autoCapitalize="none"
            onChange={handleChange}
            value={state.password}
            id="password"
          ></Input>
        </View>
      </Form>
      <SubmitButton style={{ marginHorizontal: 30 }}
        onPress={handleSubmit}
      >
        <ButtonText>
          Sign In
                </ButtonText>
      </SubmitButton>
      <TouchableOpacity style={{ marginTop: 30, alignItems: "center" }} >
        <ButtonText style={{ color: "black", fontSize: 15 }}>
          New to Social App?
                  <Text style={{ fontWeight: "500", color: "#E9446A" }}> Sign up </Text>
        </ButtonText>
      </TouchableOpacity>
    </Container>
  )
};



const Container = styled.View`
          flex:1;

        `

const Greeting = styled.Text`
          margin-top: 30px;
          font-weight: 400;
          text-align: center;
          font-size: 20px
        `

const ErrorMessageContainer = styled.View`
          height: 72px;
          align-items: center;
          justify-content: center;
          margin-top: 30px;

        `


const ErrorMessage = styled.Text`
          font-weight: 500;
          color: red;
          font-size: 15px;
        `

const Form = styled.View`
          margin-bottom: 48px;
        `;
const InputTitle = styled.Text`
          color: #8a8f9e;
          font-size: 10px;
          text-transform: uppercase;
        `

const Input = styled.TextInput`
          border-bottom-color: #8a8f9e;
          border-bottom-width: 0.5px;
          height: 40px;
          font-size: 15px;
          color: black;
        `;
const SubmitButton = styled.TouchableOpacity`
          background-color: #00203FFF;
          height: 52px;
          border-radius: 4px;
          align-items: center;
          justify-content: center;

        `;
const ButtonText = styled.Text`
          color: #fff;
          font-weight: 500;
        `