[fix]: mutliple re-rendering of toast on sign-in process

app/signin/page.tsx

@@ -1,34 +1,40 @@
 "use client";
-import { useSession, signIn } from "next-auth/react";
-import { FaGithub, FaGoogle } from "react-icons/fa";
 import { Button } from "@nextui-org/button";
-import { Card, CardHeader, CardBody } from "@nextui-org/card";
+import { Card, CardBody, CardHeader } from "@nextui-org/card";
+import { signIn, useSession } from "next-auth/react";
 import { useRouter } from "next/navigation";
 import toast from "react-hot-toast";
-import { useEffect } from "react";
+import { FaGithub, FaGoogle } from "react-icons/fa";
+import Loading from "./loading";
+import { useEffect, useState } from "react";
 
 const Page = () => {
-  const { data: session } = useSession();
+  const { data: session, status } = useSession();
+  const [isLoggedIn, setIsLoggedIn] = useState(false);
+
   const router = useRouter();
 
   const handleSignIn = async (provider: string) => {
     try {
       await signIn(provider);
-      // Redirect to home page after sign-in
-      router.push("/");
-      toast.success("Logged in successfully");
     } catch (error) {
       toast.error("Sign in failed");
       console.error("Sign in error:", error);
     }
   };
 
   useEffect(() => {
-    if (session) {
-      router.push(`/`);
-      toast.success("Logged in successfully");
+    if (session && !isLoggedIn) {
+      setIsLoggedIn(true);
+      toast.success("Logged In");
+      router.push("/");
     }
-  }, [session, router]);
+  }, [session, isLoggedIn]);
+
+  if (status === "loading") {
+    return <Loading />;
+  }
+
   return (
     <>
       <div className="h-full w-full p-6 ">

components/Loader.tsx

@@ -1,9 +1,10 @@
-import { CircularProgress } from "@nextui-org/progress";
+import { Loader2 } from "lucide-react";
 
 const Loader = () => {
   return (
     <div className="h-screen w-full flex justify-center items-center">
-      <CircularProgress aria-label="Loading ..." />
+      {/* <CircularProgress aria-label="Loading ..." /> */}
+      <Loader2 className="animate-spin text-blue-600 h-32 w-32" />
     </div>
   );
 };

middleware.ts

@@ -0,0 +1,22 @@
+import { getServerSession } from "next-auth";
+import { NextRequest, NextResponse } from "next/server";
+import { authOptions } from "./config/authoptions";
+import { getToken } from "next-auth/jwt";
+// export { default } from "next-auth/middleware";
+
+export async function middleware(req: NextRequest) {
+  // const { url } = req;
+  // const session = await getServerSession(authOptions);
+  // const token = await getToken({req});
+
+  // console.log(token);
+
+  // if (session && ["/signin"].includes(nextUrl.pathname)) {
+  //   return NextResponse.redirect("http://localhost:3000/");
+  // }
+
+  // console.log(req);
+  return NextResponse.next();
+}
+
+// export const config = { matcher: ["/signin"] };