fix(auth): display OAuth errors on the login page
Maps NextAuth error codes (OAuthCallbackError, AccessDenied, OAuthSignin) from the ?error= query param to user-friendly messages shown above the Microsoft sign-in button. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
352b14cec7
commit
bef401aa76
1 changed files with 18 additions and 0 deletions
|
|
@ -4,6 +4,15 @@ import { useState } from "react";
|
|||
import { signIn } from "next-auth/react";
|
||||
import { useRouter, useSearchParams } from "next/navigation";
|
||||
|
||||
const SSO_ERROR_MESSAGES: Record<string, string> = {
|
||||
AccessDenied:
|
||||
"Your Microsoft account is not registered in PPMS. Contact your administrator to request access.",
|
||||
OAuthCallbackError:
|
||||
"Sign-in with Microsoft failed. Please try again or contact your administrator.",
|
||||
OAuthSignin:
|
||||
"Could not initiate Microsoft sign-in. Please try again.",
|
||||
};
|
||||
|
||||
export function LoginForm() {
|
||||
const [email, setEmail] = useState("");
|
||||
const [password, setPassword] = useState("");
|
||||
|
|
@ -13,6 +22,9 @@ export function LoginForm() {
|
|||
const router = useRouter();
|
||||
const searchParams = useSearchParams();
|
||||
const callbackUrl = searchParams.get("callbackUrl") ?? "/dashboard";
|
||||
const oauthError = searchParams.get("error");
|
||||
const oauthErrorMessage =
|
||||
oauthError ? (SSO_ERROR_MESSAGES[oauthError] ?? "Sign-in failed. Please try again.") : null;
|
||||
|
||||
async function handleSso() {
|
||||
setSsoLoading(true);
|
||||
|
|
@ -41,6 +53,12 @@ export function LoginForm() {
|
|||
|
||||
return (
|
||||
<div className="space-y-5">
|
||||
{oauthErrorMessage && (
|
||||
<p className="text-sm text-danger-700 bg-danger-50 rounded-lg px-3 py-2">
|
||||
{oauthErrorMessage}
|
||||
</p>
|
||||
)}
|
||||
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleSso}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue