diff --git a/dashboard/15-final/app/ui/dashboard/log-out-button.tsx b/dashboard/15-final/app/ui/dashboard/log-out-button.tsx
index aa34779..43994bd 100644
--- a/dashboard/15-final/app/ui/dashboard/log-out-button.tsx
+++ b/dashboard/15-final/app/ui/dashboard/log-out-button.tsx
@@ -1,15 +1,21 @@
-'use client';
 import { PowerIcon } from '@heroicons/react/24/outline';
-import { signOut } from 'next-auth/react';
+import { signOut } from '@/auth';
 
-export default function LogOutButton() {
+export default async function LogOutButton() {
   return (
-    <button
-      onClick={() => signOut()}
-      className="flex h-[48px] grow items-center justify-center gap-2 rounded-md bg-gray-50 p-3 text-sm font-medium hover:bg-sky-100 hover:text-blue-600 md:flex-none md:justify-start md:p-2 md:px-3"
+    <form
+      action={async () => {
+        'use server';
+        await signOut();
+      }}
     >
-      <PowerIcon className="w-6" />
-      <div className="hidden md:block">Sign Out</div>
-    </button>
+      <button
+        type="submit"
+        className="flex h-[48px] grow items-center justify-center gap-2 rounded-md bg-gray-50 p-3 text-sm font-medium hover:bg-sky-100 hover:text-blue-600 md:flex-none md:justify-start md:p-2 md:px-3"
+      >
+        <PowerIcon className="w-6" />
+        <div className="hidden md:block">Sign Out</div>
+      </button>
+    </form>
   );
 }
diff --git a/dashboard/15-final/app/ui/login-form.tsx b/dashboard/15-final/app/ui/login-form.tsx
index 0171cc8..8c41f07 100644
--- a/dashboard/15-final/app/ui/login-form.tsx
+++ b/dashboard/15-final/app/ui/login-form.tsx
@@ -1,40 +1,11 @@
-'use client';
-
-import { signIn } from 'next-auth/react';
-import { useRouter } from 'next/navigation';
-import React, { useState } from 'react';
+import { signIn } from '@/auth';
 import { lusitana } from '@/app/ui/fonts';
 import AcmeLogo from '@/app/ui/acme-logo';
 import { AtSymbolIcon, KeyIcon } from '@heroicons/react/24/outline';
 import { Button } from './button';
 import { ArrowRightIcon } from '@heroicons/react/20/solid';
 
-export default function LoginForm() {
-  const [email, setEmail] = useState('');
-  const [password, setPassword] = useState('');
-  const [error, setError] = useState('');
-  const { replace } = useRouter();
-
-  const handleSubmit = async (e: { preventDefault: () => void }) => {
-    e.preventDefault();
-
-    try {
-      const res = await signIn('credentials', {
-        email,
-        password,
-        redirect: false,
-      });
-
-      if (res?.error) {
-        setError('Invalid Credentials');
-        return;
-      }
-
-      replace('/dashboard');
-    } catch (error) {
-      console.log(error);
-    }
-  };
+export default async function LoginForm() {
   return (
     <div className="flex items-center justify-center md:h-screen">
       <div className="relative mx-auto flex w-full max-w-[400px] flex-col space-y-2.5 p-4 md:-mt-32">
@@ -43,7 +14,13 @@ export default function LoginForm() {
             <AcmeLogo />
           </div>
         </div>
-        <form onSubmit={handleSubmit} className="space-y-3">
+        <form
+          action={async () => {
+            'use server';
+            await signIn('credentials');
+          }}
+          className="space-y-3"
+        >
           <div className="flex-1 rounded-lg bg-gray-50 px-6 pb-6 pt-5">
             <h1 className={`${lusitana.className} mb-3 text-2xl`}>
               Please log in to continue.
@@ -62,8 +39,6 @@ export default function LoginForm() {
                     id="email"
                     type="email"
                     placeholder="Enter your email address"
-                    value={email}
-                    onChange={(e) => setEmail(e.target.value)}
                   />
                   <AtSymbolIcon className="pointer-events-none absolute left-3 top-1/2 h-[18px] w-[18px] -translate-y-1/2 text-gray-500 peer-focus:text-gray-900" />
                 </div>
@@ -81,20 +56,10 @@ export default function LoginForm() {
                     id="password"
                     type="password"
                     placeholder="Enter password"
-                    value={password}
-                    onChange={(e) => setPassword(e.target.value)}
                   />
                   <KeyIcon className="pointer-events-none absolute left-3 top-1/2 h-[18px] w-[18px] -translate-y-1/2 text-gray-500 peer-focus:text-gray-900" />
                 </div>
               </div>
-              {error && (
-                <p
-                  aria-live="polite"
-                  className="mt-4 w-fit rounded-md py-1 text-sm text-red-500"
-                >
-                  {error}
-                </p>
-              )}
             </div>
           </div>
           <Button className="w-full" type="submit">
diff --git a/dashboard/15-final/auth.ts b/dashboard/15-final/auth.ts
index a4f19a6..c1d9439 100644
--- a/dashboard/15-final/auth.ts
+++ b/dashboard/15-final/auth.ts
@@ -17,7 +17,8 @@ async function getUser(email: string) {
 export const {
   handlers: { GET, POST },
   auth,
-  CSRF_experimental,
+  signIn,
+  signOut,
 } = NextAuth({
   providers: [
     Credentials({
diff --git a/dashboard/15-final/package.json b/dashboard/15-final/package.json
index 2295252..9a2b492 100644
--- a/dashboard/15-final/package.json
+++ b/dashboard/15-final/package.json
@@ -18,7 +18,7 @@
     "bcrypt": "^5.1.1",
     "clsx": "^2.0.0",
     "next": "13.5.5-canary.4",
-    "next-auth": "0.0.0-manual.83c4ebd1",
+    "next-auth": "0.0.0-manual.c8300b61",
     "postcss": "8.4.31",
     "react": "18.2.0",
     "react-dom": "18.2.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 20cd346..8d2f049 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -244,8 +244,8 @@ importers:
         specifier: 13.5.5-canary.4
         version: 13.5.5-canary.4(@babel/core@7.23.0)(react-dom@18.2.0)(react@18.2.0)
       next-auth:
-        specifier: 0.0.0-manual.83c4ebd1
-        version: 0.0.0-manual.83c4ebd1(next@13.5.5-canary.4)(react@18.2.0)
+        specifier: 0.0.0-manual.c8300b61
+        version: 0.0.0-manual.c8300b61(next@13.5.5-canary.4)(react@18.2.0)
       postcss:
         specifier: 8.4.31
         version: 8.4.31
@@ -3829,10 +3829,10 @@ packages:
     resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
     dev: true
 
-  /next-auth@0.0.0-manual.83c4ebd1(next@13.5.5-canary.4)(react@18.2.0):
-    resolution: {integrity: sha512-6nUXtVrZqTWvVz2NhUB/xbMyzxUSQycQWOquACwdpk63AcnZ3g01v+W0UX9paqkGIdqLPtI/pL6rA2N+MT58SQ==}
+  /next-auth@0.0.0-manual.c8300b61(next@13.5.5-canary.4)(react@18.2.0):
+    resolution: {integrity: sha512-0UW3ahzwqOc/H2OZ60JPUNQju+jIQSEy9SGL1Jehq+AixnNlWiTrTSEzLTtNx0O9LX3hGKWlnIAfYO2gVWx7dQ==}
     peerDependencies:
-      next: ^13.4.6
+      next: ^13.5.3
       nodemailer: ^6.6.5
       react: ^18.2.0
     peerDependenciesMeta: