Fixed Compiler Auth Bug

LakshayBabbar · Sep 22, 2024 · 092fdf2 · 092fdf2
1 parent 0d58d51
commit 092fdf2
Show file tree

Hide file tree

Showing 7 changed files with 66 additions and 29 deletions.
diff --git a/src/app/api/auth/close/route.js b/src/app/api/auth/close/route.js
@@ -1,3 +1,5 @@
+export const revalidate = 0;
+
 import Project from "@/models/projects";
 import User from "@/models/users";
 import { NextResponse } from "next/server";
@@ -18,10 +20,18 @@ export async function DELETE() {
     }
     await User.findByIdAndDelete(authData?.id);
     await Project.deleteMany({ userId: authData?.id });
-    return NextResponse.json(
+    const res = NextResponse.json(
       { message: "Account closed successfully.", success: true },
       { status: 200 }
     );
+    res.cookies.set("authToken", " ", {
+      httpOnly: true,
+      secure: true,
+      sameSite: "none",
+      path: "/",
+      expires: new Date(0),
+    });
+    return res;
   } catch (error) {
     return NextResponse.json(
       { message: "An error occurred: " + error?.message, success: false },

diff --git a/src/app/api/auth/login/route.js b/src/app/api/auth/login/route.js
@@ -38,7 +38,7 @@ export async function POST(request) {
       response.cookies.set("authToken", authToken, {
         httpOnly: true,
         secure: true,
-        sameSite: "strict",
+        sameSite: "none",
         path: "/",
         expires: new Date(Date.now() + 1000 * 60 * 60 * 24 * 7),
       });

diff --git a/src/app/api/auth/logout/route.js b/src/app/api/auth/logout/route.js
@@ -1,3 +1,5 @@
+export const revalidate = 0;
+
 import { NextResponse } from "next/server";
 
 export async function GET(request) {
@@ -10,10 +12,10 @@ export async function GET(request) {
         status: 200,
       }
     );
-    res.cookies.set("authToken", "", {
+    res.cookies.set("authToken", " ", {
       httpOnly: true,
       secure: true,
-      sameSite: "strict",
+      sameSite: "none",
       path: "/",
       expires: new Date(0),
     });

diff --git a/src/app/compiler/[...slug]/page.js b/src/app/compiler/[...slug]/page.js
@@ -1,14 +1,17 @@
 import CompilerEditor from "@/components/Editor/Compiler";
+import { cookies } from "next/headers";
 
 const getData = async (id) => {
   try {
     if (!process.env.BASE_URL) {
       throw new Error("BASE_URL is not defined in environment variables");
     }
+    const token = cookies()?.get("authToken")?.value || "";
     const req = await fetch(`${process.env.BASE_URL}/api/projects/${id}`, {
       method: "GET",
       headers: {
         "Content-Type": "application/json",
+        Authorization: `Bearer ${token}`,
       },
       credentials: "include",
     });

diff --git a/src/components/Navbar/Navbar.js b/src/components/Navbar/Navbar.js
@@ -54,7 +54,13 @@ export default function Navbar() {
       })
     );
     setActive(false);
-    await fetch("/api/auth/logout");
+    await fetch("/api/auth/logout", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      cache: "no-store",
+    });
     navigate.push("/");
   };
 

diff --git a/src/components/ui/ProjectCard.jsx b/src/components/ui/ProjectCard.jsx
@@ -16,41 +16,54 @@ const ProjectCard = ({ data }) => {
     });
     data.refetch(true);
   };
+
   const languages = Object.keys(data?.languages).join(", ") || "";
+
   return (
-    <div className="w-full sm:w-80 bg-card border p-6 flex gap-4 rounded-xl hover:border-primary transition-all duration-300 shadow-lg bg-slate-100 dark:bg-slate-950">
-      <span className="text-2xl">
-        <Code2Icon />
-      </span>
-      <div className="space-y-2">
-        <h1 className="font-bold">{data.name}</h1>
-        <p className="text-sm text-muted-foreground">
-          Created at: <span>{data?.createdAt.substring(0, 10)}</span>
-        </p>
-        <p className="text-sm text-muted-foreground">
-          Last updated: <span>{data?.updatedAt?.substring(0, 10)}</span>
-        </p>
-        <p className="text-sm text-muted-foreground">
-          Type: <span>{data.type}</span>
-        </p>
-        <p className="text-sm text-muted-foreground">
-          Languages: <span>{languages}</span>
-        </p>
-        <div className="flex gap-4 items-center">
+    <div className="w-full sm:max-w-96 bg-gradient-to-r from-slate-100 to-slate-200 dark:from-slate-900 dark:to-slate-950 border border-transparent hover:border-slate-700 transition-all duration-200 p-6 rounded-2xl shadow-xl transform hover:scale-[1.02]">
+      <div className="p-6 flex flex-col gap-4">
+        <div className="flex items-center justify-between">
+          <span className="text-3xl text-primary">
+            <Code2Icon />
+          </span>
+          <h1 className="font-bold text-xl text-slate-900 dark:text-slate-100">
+            {data.name}
+          </h1>
+        </div>
+        <div className="text-sm text-gray-600 dark:text-gray-400 space-y-1">
+          <p>
+            <span className="font-semibold">Created at:&nbsp;</span>
+            {data?.createdAt.substring(0, 10)}
+          </p>
+          <p>
+            <span className="font-semibold">Last updated:&nbsp;</span>
+            {data?.updatedAt?.substring(0, 10)}
+          </p>
+          <p>
+            <span className="font-semibold">Type:</span> {data.type}
+          </p>
+          <p>
+            <span className="font-semibold">Languages:</span> {languages}
+          </p>
+        </div>
+        <div className="flex items-center justify-between mt-4">
           <Link
             href={
               data.type === "web"
                 ? `/web-editor/${data._id}`
-                : `/compiler/python/${data._id}`
+                : `/compiler/${languages}/${data._id}`
             }
           >
-            <Button size="sm" variant="outline" className="bg-transparent">
+            <Button  variant="outline" className="bg-transparent">
               Open
             </Button>
           </Link>
-          <span className="text-red-500 cursor-pointer" onClick={deleteHandler}>
+          <span
+            className="text-red-500 hover:text-red-600 cursor-pointer transition-colors"
+            onClick={deleteHandler}
+          >
             <acronym title="Delete Project">
-              <Delete />
+              <Delete className="w-6 h-6" />
             </acronym>
           </span>
         </div>

diff --git a/src/middleware.js b/src/middleware.js
@@ -2,7 +2,10 @@ import { NextResponse } from "next/server";
 import { verifyToken } from "./utils/authToken";
 
 export async function middleware(request) {
-  const token = request.cookies.get("authToken")?.value;
+  const token =
+    request.cookies.get("authToken")?.value ||
+    request.headers.get("Authorization")?.split(" ")[1] ||
+    "";
   if (
     request.nextUrl.pathname.startsWith("/api/projects") ||
     request.nextUrl.pathname.startsWith("/api/auth/close")