How can I add loader state to firebase's createUserWithEmailAndPassword method?

Question

I want to set a loader to my button while I call createUserWithEmailAndPassword using email & password. How can I do that?

For example in Apollo Client GraphQL, there is a loading state provided out of the box like:

const {data, loading, error} = <API call>

The given loading state automatically sets to true if the data fetching is in the works.

Is there any similar such way we can do it in firebase?

Answer 1

There isn't a built in function that's tied in with react state, so you would create the states yourself:

const [loading, setLoading] = useState(false);
const [error, setError] = useState(null);

// Whatever function is going to do the loading:
const onClick = async () => {
  try {
    setLoading(true);
    const userCredential = await createUserWithEmailAndPassword(email, password);
    setLoading(false);
  } catch (error) {
    setError(error);
    setLoading(false);
  }
}