Firebase Error auth/admin-restricted-operation after createUserWithEmailAndPassword

Question

Im getting an Firebase: Error (auth/admin-restricted-operation) error after trying to sign up with email. (In settings of my project i have creating users with email allowed.) It could be something in my project settings? I was searching internet to solve that problem like for hours so please help, im really new to firebase.

import React, {useContext, useState, useEffect} from 'react'
import { auth } from '../firebase';
import { createUserWithEmailAndPassword, onAuthStateChanged } from "firebase/auth";

const AuthContext = React.createContext()


export function useAuth(){
    return useContext(AuthContext)
}

export function AuthProvider({children}) {
    const [currentUser, setUser] = useState();
    
    function signup(email, password){
        return createUserWithEmailAndPassword(auth, email, password);
    }

    useEffect(() => {
        const unsubscribe = onAuthStateChanged(auth, user => {
            setUser(user)
        })

        return unsubscribe
    }, [])


    const value = {
        currentUser,
        signup
    }

    return (
        <AuthContext.Provider value={value}>
            {children}
        </AuthContext.Provider>
    )
}

import {React, useRef, setError, useState} from 'react' 
import { useAuth } from '../contexts/AuthContext';

function SignUp() {
    const emailRef = useRef();
    const passwordRef = useRef();
    const passwordConfirmRef = useRef();
    const {signup} = useAuth();    

    const handleSubmit = async (e) => {
        e.preventDefault()
        await signup(emailRef.value, passwordRef.value)
    }

    return (
        <div>
            <form onSubmit={handleSubmit}>
                <label for="email">Email</label>
                <input type="text" id="email" inputRef={emailRef} required></input>
                <label for="password">Password</label>
                <input type="password" id="password" inputRef={passwordRef} required></input>
                <label for="email">Pasword Confirmation</label>
                <input type="text" id="email" inputRef={passwordConfirmRef} required></input>
                <button type="submit" >Sign Up</button>
            </form>
        </div>
    )
}

export default SignUp

import * as firebase from "firebase/app"
import { getAuth } from "firebase/auth";


const app = firebase.initializeApp({
...
})

export const auth = getAuth()
export default app

Answer 1

You saved me! Everywhere else people are incorrectly saying to enable anonymous authentication as the correct solution for [auth/admin-restricted-operation]. Of course, that is wrong.

Enabling anonymous authentication works at first, so everyone thumbs it up, but it only works because anonymous authentication doesn't require an email and password to be sent. Trouble comes later when we realize we aren't able to log in with the email and password we used to signup when we simply enable anonymous auth without addressing the actual problem.

The real answer is we are not sending email and password correctly, as in your case, so email/password auth says "no, only admins can do that kind of magic".

We have to check our sign-in data. That's the answer. Thanks so much!