Moralis Login issue in react

This is my signup page

import {
  } from '@chakra-ui/react';
import React from 'react'
import { useState , useEffect } from 'react';
import { useMoralis } from "react-moralis";
import { useNavigate } from 'react-router-dom';
  export default function Signup() {
    const { signup, isAuthenticated, hasAuthError, auth , user } = useMoralis();
    const navigate = useNavigate();

    const [signupData , setSignupData] = useState({
      name: '',
      email: '',
      password: '',
      cpassword: ''

    const {name , email , password , cpassword} = signupData

    const onChange = (e) => {
      setSignupData((prevState) => ({
        [] :
      }) )

    useEffect(() => {
      console.log('AUTH:', auth)
      console.log('HASAUTH ERROR:', hasAuthError)
      console.log('USER:', user)
      if (auth.state === "authenticated") {
        console.log("Invalid credentials")

    return (
      <Stack minH={'100vh'} direction={{ base: 'column', md: 'row' }}>
           <Flex flex={1}>
            alt={'Signup Image'}
        <Flex p={8} flex={1} align={'center'} justify={'center'}>
          <Stack spacing={4} w={'full'} maxW={'md'}>
            <Heading fontSize={'2xl'}>Sign up to your account</Heading>
            <FormControl id="name">
              <FormLabel>Full Name</FormLabel>
              <Input type="text" name='name' value={name} onChange={onChange} />
            <FormControl id="email">
              <FormLabel>Email address</FormLabel>
              <Input type="email" name='email' value={email} onChange={onChange}  />
            <FormControl id="password">
              <Input type="password" name='password' value={password} onChange={onChange} />
            <FormControl id="confirm-password">
              <FormLabel> Confirm Password</FormLabel>
              <Input type="password" name='cpassword' value={cpassword} onChange={onChange} />
            <Stack spacing={10} pt={2}>
                type= "submit"
                  bg: 'blue.500',
                onClick={() => signup( , ,signupData.password , signupData.cpassword)}
                Sign up
            <Stack pt={6}>
              <Text align={'center'}>
                Already a user? <Link color={'blue.400'}>Login</Link>

I am getting an error like this..

Failed to load resource: the server responded with a status of 400 ()
AUTH: Objecterror: Error: Email address format is invalid.
    at handleError (http://localhost:3000/static/js/bundle.js:124664:17)state: "error"[[Prototype]]: Object
Signup.jsx:43 HASAUTH ERROR: true
Signup.jsx:44 USER: null
Signup.jsx:51 Invalid credentials

How can I fix this .. Please help

can you log the parameters that are used here?

It is showing all the data which i enter in the input .
I have to console like this right ?
console.log( , ,signupData.password , signupData.cpassword)

Yeppp like that, try and see what you get

Yes , I get the data which I enter in the input

cool hmm so what’s the issue again? can’t find any description above

AUTH: {state: ‘error’, error: Error: Email address format is invalid.
at handleError (http://localhost:3000/static/js/bundle.…}

this same error

btw I don’t think you need to include confirm password in signup

Why ?

I want tht in my project

coz it’s not part of the parameters for the signup function. Seems like now we even just need username and password only for this.

Here it also shows another way to signup with more like manual DB insert approach.

But confirm password usually isn’t a part of any authentication function in general, it’s usually something handled by form validation libraries to check whether the password and confirm password are the same.

But why is it showing email format is invalid ?

hmmm how does your email looks like? just give me the format (coz email are sensitive)

based on the error, it might be you’re inputting something that’s not email :thinking:

Normal - [email protected]

hmmm :thinking: how about you try

() => signup(, signupData.password ,

POST 400

AUTH: {state: ‘error’, error: Error: Email address format is invalid.
at handleError (http://localhost:3000/static/js/bundle.…}

No the same error…

this shouldnt give this error, i think if an email has @ and . it should be a valid entry :thinking:, try check if there are spaces before or after and delete the spaces it should just be plain email :thinking:
and if it is acceptable in your input field it should aslo work there

you can also try to use individual hooks for the properties which i dont believe is the problem but you can try that out and log out signupData to see what it return when you try to sign up