diff --git a/docs/pages/guides/pages/signin.mdx b/docs/pages/guides/pages/signin.mdx index 96e6113f1a..644ec9feb9 100644 --- a/docs/pages/guides/pages/signin.mdx +++ b/docs/pages/guides/pages/signin.mdx @@ -99,6 +99,7 @@ We can now build our own custom sign in page. ```tsx filename="app/signin/page.tsx" /providerMap/ import { signIn, auth, providerMap } from "@/auth.ts" +import { AuthError } from 'next-auth' export default async function SignInPage() { return ( @@ -107,7 +108,20 @@ export default async function SignInPage() {
{ "use server" - await signIn(provider.id) + try { + await signIn(provider.id) + } catch (error) { + // Signin can fail for a number of reasons, such as the user + // not existing, or the user not having the correct role. + // In some cases, you may want to redirect to a custom error + if (error instanceof AuthError) { + return redirect(`${SIGNIN_ERROR_URL}?error=${error.type}`) + } + + // Otherwise if a redirects happens NextJS can handle it + // so you can just re-thrown the error and let NextJS handle it. + throw error + } }} >