From e75f71499fd2bc2dbabf60992f423e07d33c15fd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bal=C3=A1zs=20Orb=C3=A1n?= <info@balazsorban.com>
Date: Wed, 29 Nov 2023 13:44:04 +0100
Subject: [PATCH] chore: bump `next-auth` (#491)

* chore: bump `next-auth`

* shorten message
---
 dashboard/final-example/app/lib/actions.ts    | 12 +++++++++---
 dashboard/final-example/app/ui/login-form.tsx |  6 +++---
 dashboard/final-example/package.json          |  2 +-
 3 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/dashboard/final-example/app/lib/actions.ts b/dashboard/final-example/app/lib/actions.ts
index 2de94e55..84007c99 100644
--- a/dashboard/final-example/app/lib/actions.ts
+++ b/dashboard/final-example/app/lib/actions.ts
@@ -5,6 +5,7 @@ import { sql } from '@vercel/postgres';
 import { revalidatePath } from 'next/cache';
 import { redirect } from 'next/navigation';
 import { signIn } from '@/auth';
+import { AuthError } from 'next-auth';
 
 const FormSchema = z.object({
   id: z.string(),
@@ -124,10 +125,15 @@ export async function authenticate(
   formData: FormData,
 ) {
   try {
-    await signIn('credentials', Object.fromEntries(formData));
+    await signIn('credentials', formData);
   } catch (error) {
-    if ((error as Error).message.includes('CredentialsSignin')) {
-      return 'CredentialsSignin';
+    if (error instanceof AuthError) {
+      switch (error.type) {
+        case 'CredentialsSignin':
+          return 'Invalid credentials.';
+        default:
+          return 'Something went wrong.';
+      }
     }
     throw error;
   }
diff --git a/dashboard/final-example/app/ui/login-form.tsx b/dashboard/final-example/app/ui/login-form.tsx
index d1422e71..601e6e05 100644
--- a/dashboard/final-example/app/ui/login-form.tsx
+++ b/dashboard/final-example/app/ui/login-form.tsx
@@ -12,7 +12,7 @@ import { Button } from './button';
 import { useFormState, useFormStatus } from 'react-dom';
 
 export default function LoginForm() {
-  const [state, dispatch] = useFormState(authenticate, undefined);
+  const [errorMessage, dispatch] = useFormState(authenticate, undefined);
 
   return (
     <form action={dispatch} className="space-y-3">
@@ -67,10 +67,10 @@ export default function LoginForm() {
           aria-live="polite"
           aria-atomic="true"
         >
-          {state === 'CredentialsSignin' && (
+          {errorMessage && (
             <>
               <ExclamationCircleIcon className="h-5 w-5 text-red-500" />
-              <p className="text-sm text-red-500">Invalid credentials</p>
+              <p className="text-sm text-red-500">{errorMessage}</p>
             </>
           )}
         </div>
diff --git a/dashboard/final-example/package.json b/dashboard/final-example/package.json
index c5d2c369..da29439e 100644
--- a/dashboard/final-example/package.json
+++ b/dashboard/final-example/package.json
@@ -18,7 +18,7 @@
     "bcrypt": "^5.1.1",
     "clsx": "^2.0.0",
     "next": "^14.0.2",
-    "next-auth": "^5.0.0-beta.3",
+    "next-auth": "^5.0.0-beta.4",
     "postcss": "8.4.31",
     "react": "18.2.0",
     "react-dom": "18.2.0",