• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

194
Views
How to properly display Firebase Auth error to user using Toast and Typescript?

Suppose the user wanted to sign up or sign in to the account. However, the Firebase error appears like this. How can I display the toast notification to the user using try-catch statement with typescript?

[FirebaseError: Firebase: Error (auth/email-already-in-use).]

Here is the code I tried:

    try {
      const credential = await signUpWithEmail(data.email, data.password);
      if (credential.uid) {
        toast.show({
          title: 'Account created! ๐ŸŽŠ',
          status: 'success',
          description: 'Welcome!.',
        });
      } else {
        const auth = getAuth();
        auth.signOut();
      }
    } catch (err) {
      toast.show({
        title: 'Cannot sign-up an account.',
        status: 'error',
        description: [CONDITIONAL ERROR MESSAGE FOR DISPLAYING TO THE USER],
      });
    }

Edit: add code

about 3 years ago ยท Juan Pablo Isaza
1 answers
Answer question

0

The err object has a code property that you check check in your code, and a message property that you can display to the user.

So:

  ...
} catch (err) {
  toast.show({
    title: 'Cannot sign-up an account.',
    status: 'error',
    description: err.message,
  });
}

See the Firebase documentation on sending a password reset email that has an example of accessing these two properties.

Also see:

  • Firebase error messages in different languages?
  • list of all auth/ errors for firebase web API
  • Does Firebase Auth return an Error Code if authentification is not successful?
about 3 years ago ยท Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
ยฉ 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error