My firebase Create User trigger 2 times instead of one-CodePudding

Creating a react app usign react-firebase-hook,firebase,react-hook-form,daisyUI The problem is When I am pressing submit button it triggers 2 times in the console and when using the Button; Sign Up With Google it triggers 3times.Thanks for your time in advance.

In SingUP function:

import auth from '../../firebase.init';
import { useSignInWithGoogle } from 'react-firebase-hooks/auth';
import { useForm } from "react-hook-form";
import { useCreateUserWithEmailAndPassword } from 'react-firebase-hooks/auth';

function SignUp() {
  const [signInWihGoogle, googleUser, googleLoading, googleError] = useSignInWithGoogle(auth);
  const { register, formState: { errors }, handleSubmit } = useForm();

  const [
    createUserWithEmailAndPassword,
    user,
    loading,
    error,
  ] = useCreateUserWithEmailAndPassword(auth);

This function is triggering:

  const onSubmit = data =>{
    createUserWithEmailAndPassword(data.email,data.password);
    alert('You successfully created your account');
  }

<form onSubmit={handleSubmit(onSubmit)}>


          <div >
              <label >
                <span >Name</span>
              </label>
              <input 
              type="text" 
              placeholder="Pls type name here" 
              
              {...register("name", {
                        required:{
                          value: true,
                          message:'Name is Required'
                        },
                        minLength: {
                          value:2,
                          message:'Name must be 2 or more characters
                        }
                      })}/>
             
            </div>
                ... .... ...
              <input 
                type='submit' 
                value= 'Signup'
                />
             </form>
        <p className='text-center text-xs pt-1'>Already have an account?<Link 
        className='text-secondary' to='/login'> Please Login</Link></p>

        <div >OR</div>
           <button 
            onClick={() => signInWihGoogle()}
            >Continue with Google</button>
       </div>

CodePudding user response：

Do you still have the strict mode tag in your App? If so: delete it and if you want you can read more on it here: https://reactjs.org/docs/strict-mode.html