map Firebase auth error codes to user-friendly messages in signup

[khushboo-khatoon]

Fixes #339

Description

Previously, when signup failed, the app displayed the raw error.message string straight from Firebase to the user (e.g. "Firebase: Error (auth/email-already-in-use)."). These messages are written for developers, not end users, and looked confusing and unprofessional on screen — a normal user has no idea what "Firebase" or "auth/email-already-in-use" means.

Changes

• Added a getFriendlyErrorMessage() helper function that checks error.code (instead of the raw error.message) and maps known Firebase Auth error codes to clear, human-readable messages.
• Moved this helper to the top level of the file (outside the SignupForm component), since it doesn't depend on any component state or props — this avoids recreating the function on every render.
• Updated the catch block in onSubmit to use getFriendlyErrorMessage(error) instead of the raw error.message.

Mapped error codes

Firebase error code	Friendly message shown to user
auth/email-already-in-use	"This email is already registered. Try logging in instead."
auth/weak-password	"Password should be at least 6 characters."
auth/invalid-email	"Please enter a valid email address."
auth/network-request-failed	"Network error. Please check your connection and try again."
(any other/unknown code)	"Something went wrong. Please try again."

Before

} catch (error: unknown) {
  const message = error instanceof Error ? error.message : "Something went wrong.";
  setServerError(message);
  toast.error("Signup failed", { description: message });
}

After

function getFriendlyErrorMessage(error: unknown): string {
  const code = (error as { code?: string })?.code;

  switch (code) {
    case "auth/email-already-in-use":
      return "This email is already registered. Try logging in instead.";
    case "auth/weak-password":
      return "Password should be at least 6 characters.";
    case "auth/invalid-email":
      return "Please enter a valid email address.";
    case "auth/network-request-failed":
      return "Network error. Please check your connection and try again.";
    default:
      return "Something went wrong. Please try again.";
  }
}

// ...inside onSubmit:
} catch (error: unknown) {
  const message = getFriendlyErrorMessage(error);
  setServerError(message);
  toast.error("Signup failed", { description: message });
}

How to Test

1. Go to the signup page.
2. Try signing up with an email that's already registered → confirm you see "This email is already registered. Try logging in instead." instead of raw Firebase text.
3. Try signing up with a weak password (less than 6 characters) → confirm you see "Password should be at least 6 characters."
4. Try an invalid email format → confirm you see "Please enter a valid email address."
5. (Optional) Simulate a network failure → confirm you see "Network error. Please check your connection and try again."
6. Confirm no raw Firebase text (e.g. "Firebase: Error (auth/...)") is ever shown to the user.

Impact

Users now see clear, actionable error messages instead of confusing developer-facing text, making the signup flow feel more polished and helping users understand exactly what went wrong and what to do next.

Checklist

• Code builds and runs locally
• Manually tested all mapped error cases

[vercel]

@khushboo-khatoon is attempting to deploy a commit to the Nitya Gosain's projects Team on Vercel.

A member of the Team first needs to authorize it.

[khushboo-khatoon]

hey @Nitya-003 ,

PR is now ready to review and merge

thank u ( :