feat: added middleware, routes, auth-routes

Author: Harshit Yadav

.env

@@ -8,4 +8,6 @@
 # See the documentation for all the connection string options: https://pris.ly/d/connection-strings
 
 DATABASE_URL="postgresql://CodeMaster17:qc8Qn7kBDrGb@ep-falling-pine-75509530-pooler.us-east-2.aws.neon.tech/auth?sslmode=require&pgbouncer=true"
-DIRECT_URL="postgresql://CodeMaster17:[email protected]/auth?sslmode=require"
+DIRECT_URL="postgresql://CodeMaster17:[email protected]/auth?sslmode=require"
+
+AUTH_SECRET = 'secret'

README.md

@@ -134,5 +134,75 @@ export const getUserById = async (id: string) => {
   const exisitingUser = await getUserByEmail(email)
 
 ```
+
 33. Now, for `login` we have to install nextauth v5
-    `npm i next-auth@beta`
+    `npm i next-auth@beta`
+34. Create `auth.ts` file in root directory for configuration
+35. Add following code to `auth.ts` file
+    - paste the code from website
+36. Create `app/api/auth/[...nextauth].ts` file and paste the code from the wesbite
+
+- remove the edge because prisma does not support it
+
+37. Add `AUTH_SECRET` in `.env` file
+
+- for the development mode we can use any string
+
+38. Go to see logs `http://localhost:3000/api/auth/providers`
+
+39. Create middleware in `middleware.ts` in root directory
+
+- `middleware.ts` file is nextjs specific file
+- update matcher to ` matcher: ["/((?!.+\\.[\\w]+$|_next).*)", "/", "/(api|trpc)(.*)"],` from clerk
+
+40. Create `auth.config.ts` file in root directory
+
+- paste the code from website
+
+41. Update `auth.ts` file
+
+```
+// * Comnfiguration for authentication
+import NextAuth from "next-auth";
+import authConfig from "@/auth.config";
+import { db } from "./lib/database.connection";
+import { PrismaAdapter } from "@auth/prisma-adapter";
+export const {
+  handlers: { GET, POST },
+  auth,
+} = NextAuth({
+  adapter: PrismaAdapter(db), // prisma adapter is supported on non edge
+  session: { strategy: "jwt" },
+  ...authConfig,
+});
+
+
+```
+
+42. Update `api/auth/[...nextauth].ts` file
+
+```
+// * middleware works on the edge
+
+import authConfig from "./auth.config";
+import NextAuth from "next-auth";
+
+const { auth } = NextAuth(authConfig);
+
+export default auth((req) => {
+  // req.auth
+});
+
+// Optionally, don't invoke Middleware on some paths
+export const config = {
+  matcher: ["/((?!.+\\.[\\w]+$|_next).*)", "/", "/(api|trpc)(.*)"],
+};
+
+```
+
+43. Create `route.ts` file in root directory
+
+- this file will contain all types of routes
+
+44. Edit middleware.ts file
+    // cuurently here : 2:32:14

app/(protected)/settings/page.tsx

@@ -0,0 +1,13 @@
+import { auth } from '@/auth'
+import React from 'react'
+
+const Settings = async () => {
+    const user = await auth()
+    return (
+        <div>
+            {JSON.stringify(user)}
+        </div>
+    )
+}
+
+export default Settings

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

@@ -0,0 +1 @@
+export { GET, POST } from "@/auth";

auth.config.ts

@@ -0,0 +1,11 @@
+// * This file is used to trigger the middleware on the edge
+// * That is why we use auth.ts and auth.config.ts as seprate files
+
+
+import GitHub from "next-auth/providers/github";
+
+import type { NextAuthConfig } from "next-auth";
+
+export default {
+  providers: [GitHub],
+} satisfies NextAuthConfig;

auth.ts

@@ -0,0 +1,13 @@
+// * Comnfiguration for authentication
+import NextAuth from "next-auth";
+import authConfig from "@/auth.config";
+import { db } from "./lib/database.connection";
+import { PrismaAdapter } from "@auth/prisma-adapter";
+export const {
+  handlers: { GET, POST },
+  auth,
+} = NextAuth({
+  adapter: PrismaAdapter(db), // prisma adapter is supported on non edge
+  session: { strategy: "jwt" },
+  ...authConfig,
+});

middleware.ts

@@ -0,0 +1,32 @@
+// * middleware works on the edge
+
+import authConfig from "./auth.config";
+import NextAuth from "next-auth";
+import {
+  publicRoutes,
+  authRoutes,
+  apiAuthPrefix,
+  DEFAULT_LOGIN_REDIRECT,
+} from "./route";
+const { auth } = NextAuth(authConfig);
+
+export default auth((req) => {
+  // req.auth
+  const { nextUrl } = req;
+  const isLoggeedIn = !!req.auth;
+
+  const isPublicRoute = publicRoutes.includes(nextUrl.pathname);
+  const isAuthRoute = authRoutes.includes(nextUrl.pathname);
+  const isApiAuthRoute = nextUrl.pathname.startsWith(apiAuthPrefix);
+
+  if (isApiAuthRoute) {
+    return null;
+  }
+
+  // TODO ; start from here
+});
+
+// Optionally, don't invoke Middleware on some paths
+export const config = {
+  matcher: ["/((?!.+\\.[\\w]+$|_next).*)", "/", "/(api|trpc)(.*)"],
+};

route.ts

@@ -0,0 +1,22 @@
+// * an array of roues that are public
+// * These roues do not require authentication
+// @ @type {string[]}
+export const publicRoutes = ["/"];
+
+// * an array of roues that are used for authentication
+// * These routes will redirect logged in users to /settings
+// @ @type {string[]}
+export const authRoutes = ["/auth/login", "/auth/register"];
+
+/**
+ * The prefix for API authentication routes
+ * Routes that start with this prefix are used for API authentication purposes
+ * @type {string}
+ */
+export const apiAuthPrefix = "/api/auth";
+
+/**
+ * The default redirect path after logging in
+ * @type {string}
+ */
+export const DEFAULT_LOGIN_REDIRECT = "/settings";