🚸 ux: improve logout flow completely

app/(safe-mode-page)/auth/logout/page.tsx

@@ -1,9 +0,0 @@
-import { cookies } from "next/headers";
-import { redirect } from "next/navigation";
-
-const page = async () => {
-  (await cookies()).delete("auth_token");
-  redirect("/");
-};
-
-export default page;

app/(safe-mode-page)/auth/logout/route.tsx

@@ -0,0 +1,7 @@
+import { cookies } from "next/headers";
+import { NextResponse } from "next/server";
+
+export const GET = async (request: Request) => {
+  (await cookies()).delete("auth_token");
+  return NextResponse.redirect(new URL("/", request.url), 303);
+};

shared/models/auth/logout.ts

@@ -1,8 +1,6 @@
 "use server";
 
 import { backendFetch, BackendResponse } from "@/shared/helpers/backendFetch";
-import { cookies } from "next/headers";
-import { redirect } from "next/navigation";
 
 export const logout = async () => {
   const res = (await backendFetch("auth/logout", {
@@ -10,7 +8,10 @@ export const logout = async () => {
   })) as BackendResponse;
 
   if (res.success) {
-    redirect("/auth/logout");
+    return {
+      success: true,
+      message: "Logout successful",
+    };
   } else {
     return {
       success: false,

shared/widgets/navbar/components/LogoutAlert.tsx

@@ -11,6 +11,7 @@ import {
 import { Spinner } from "@/shared/libs/shadcn/ui/spinner";
 import { logout } from "@/shared/models/auth/logout";
 import { Button } from "@base-ui/react";
+import { useRouter } from "next/navigation";
 import React from "react";
 import { toast } from "sonner";
 
@@ -21,6 +22,7 @@ const LogoutAlert = ({
   openState: boolean;
   setOpenState: React.Dispatch<React.SetStateAction<boolean>>;
 }) => {
+  const router = useRouter();
   const [isLoading, setIsLoading] = React.useState(false);
   const continueLogout = async () => {
     setIsLoading(true);
@@ -33,6 +35,16 @@ const LogoutAlert = ({
           "An error occurred while logging out. Please try again later.",
         richColors: true,
       });
+    } else {
+      toast.success(res.message || "Logout successful", {
+        position: "bottom-right",
+        description: "You have been logged out successfully.",
+        richColors: true,
+      });
+      router.push("/auth/logout");
+      setTimeout(() => {
+        window.location.reload();
+      }, 2000);
     }
   };