downGraded from auth.js to nextjs or v5 to v4

- added files needed for middleware and other also
- removed -auth.ts since not needed in nextauthv4

Author: yeabnoah

.env.example

@@ -0,0 +1,20 @@
+// "use client";
+
+// import { useSession } from "next-auth/react";
+// import { redirect } from "next/navigation";
+
+// const Dashboard = () => {
+//   const { data: session } = useSession({
+//     required: true,
+//     // onUnauthenticated() {
+//     //   redirect("/signIn");
+//     // },
+//   });
+//   return (
+//     <div className=" text-2xl min-h-screen flex justify-center items-center">
+//       Dashboard
+//     </div>
+//   );
+// };
+
+// export default Dashboard;

app/(authentication)/dashboard/note.txt

@@ -0,0 +1,11 @@
+import React from "react";
+
+const Dashboard = () => {
+  return (
+    <div className=" min-h-screen flex justify-center items-center text-2xl">
+      Dashboard (protected)
+    </div>
+  );
+};
+
+export default Dashboard;

app/(authentication)/dashboard/page.tsx

@@ -0,0 +1,11 @@
+import React from "react";
+
+const Register = () => {
+  return (
+    <div className=" text-2xl flex justify-center items-center min-h-screen">
+      Register
+    </div>
+  );
+};
+
+export default Register;

app/(authentication)/register/page.tsx

@@ -0,0 +1,11 @@
+import React from "react";
+
+const SignIn = () => {
+  return (
+    <div className=" text-2xl min-h-screen flex items-center justify-center">
+      SignIn
+    </div>
+  );
+};
+
+export default SignIn;

app/(authentication)/signIn/page.tsx

@@ -1,2 +1,52 @@
-import { handlers } from "@/auth"; // Referring to the auth.ts we just created
-export const { GET, POST } = handlers;
+import connectDB from "@/lib/mongodb";
+import NextAuth, { NextAuthOptions } from "next-auth";
+import CredentialsProvider from "next-auth/providers/credentials";
+
+// Define a type for your user
+interface User {
+  id: string;
+  name: string;
+  email: string;
+}
+
+export const authOptions: NextAuthOptions = {
+  providers: [
+    CredentialsProvider({
+      name: "Credentials",
+      credentials: {
+        username: { label: "Username", type: "text" },
+        password: { label: "Password", type: "password" },
+      },
+      async authorize(credentials: Record<string, string> | undefined, req) {
+        await connectDB();
+
+        const username = credentials?.username;
+        const password = credentials?.password;
+
+        // Replace this with your actual user validation logic
+        if (username === "test" && password === "test") {
+          const user: User = {
+            id: "1",
+            name: "Test User",
+            email: "[email protected]",
+          };
+          return user;
+        } else {
+          return null;
+        }
+      },
+    }),
+  ],
+
+  session: {
+    strategy: "jwt",
+  },
+  secret: process.env.NEXTAUTH_SECRET,
+  pages: {
+    signIn: "/",
+  },
+};
+
+const handler = NextAuth(authOptions);
+
+export { handler as GET, handler as POST };

app/api/auth/[...nextauth]/route.ts

@@ -2,6 +2,7 @@ import type { Metadata } from "next";
 import { Space_Grotesk as FontSans } from "next/font/google";
 import "./globals.css";
 import { cn } from "@/lib/utils";
+import Provider from "@/provider/sessionProvider";
 
 const fontSans = FontSans({
   subsets: ["latin"],
@@ -37,7 +38,7 @@ export default function RootLayout({
           fontSans.variable
         )}
       >
-        {children}
+        <Provider> {children}</Provider>
       </body>
     </html>
   );

app/layout.tsx

@@ -1 +1,3 @@
-export { auth as middleware } from "@/auth";
+export { default } from "next-auth/middleware";
+
+export const config = { matcher: ["/dashboard"] };

auth.ts

@@ -11,11 +11,13 @@
   "dependencies": {
     "@radix-ui/react-icons": "^1.3.0",
     "@radix-ui/react-slot": "^1.1.0",
+    "@types/bcrypt": "^5.0.2",
+    "bcrypt": "^5.1.1",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
     "mongoose": "^8.5.1",
     "next": "14.2.5",
-    "next-auth": "5.0.0-beta.19",
+    "next-auth": "^4.24.7",
     "react": "^18",
     "react-dom": "^18",
     "react-icons": "^5.2.1",