patient pages moved to middleware authentication from localstorage

client/app/(patient)/signin/otp-verification/page.tsx

@@ -20,7 +20,6 @@ const OtpVerificationPage = () => {
    const { toast } = useToast();
    const router = useRouter();
    const [isLoading, setLoading] = useState(true);
-   const { patientToken } = useAuth();
 
    useEffect(() => {
       const timer = setTimeout(() => {
@@ -32,7 +31,7 @@ const OtpVerificationPage = () => {
    if (isLoading) {
       return <AuthSkelton />;
    }
-   if (otpMail && !patientToken) {
+   if (otpMail) {
       const handleResend = async () => {
          setSending(true);
          resendOtp(

client/app/(patient)/signin/page.tsx

@@ -1,11 +1,49 @@
 import { Metadata } from "next";
-import FormSection from "@/components/page-components/patient/auth/SignInPageSection";
+import SigninForm from "@/components/forms/patient/SigninForm";
+import Image from "next/image";
+import Link from "next/link";
+import { Banners } from "@/constants";
+import GoogleSignInButton from "@/components/page-components/patient/auth/OAuth";
+
 
 export const metadata: Metadata = {
    title: "SignIn",
 };
 const SignIn = () => {
-   return <FormSection />;
+   return (
+      <div className="flex h-screen max-h-screen">
+         <section className="remove-scrollbar container my-auto">
+            <div className="sub-container max-w-[496px]">
+               <Image
+                  src={"/assets/icons/logo-full.svg"}
+                  width={1000}
+                  height={1000}
+                  alt="patient"
+                  className="mb-12 h-10 w-fit"
+               />
+               <SigninForm />
+
+               <GoogleSignInButton />
+
+               <div className="text-14-regular py-12 flex justify-between">
+                  <p className="justify-items-end text-dark-600 xl:text-left">
+                     © {new Date().getFullYear()} AVM Ayurvedic.
+                  </p>
+                  <Link href={"/admin"} className="text-green-500 text-xs">
+                     Staff-Login
+                  </Link>
+               </div>
+            </div>
+         </section>
+         <Image
+            src={Banners.patient_signin}
+            height={1000}
+            width={1000}
+            alt="patient"
+            className="side-img max-w-[50%]"
+         />
+      </div>
+   );
 };
 
 export default SignIn;

client/app/(patient)/signup/page.tsx

@@ -1,12 +1,40 @@
-import SignUnFormSection from "@/components/page-components/patient/auth/SignUnPageSection";
 import { Metadata } from "next";
+import Image from "next/image";
+import SignupForm from "@/components/forms/patient/SignupForm";
+import { Banners } from "@/constants";
+import OAuth from '@/components/page-components/patient/auth/OAuth'
 
 export const metadata: Metadata = {
    title: "SignUp",
 };
 
 const Register = () => {
-   return <SignUnFormSection />;
+   return (
+      <div className="flex h-screen max-h-screen">
+         <section className="remove-scrollbar container">
+            <div className="sub-container max-w-[860px] flex-1 flex-col py-10">
+               <Image
+                  src="/assets/icons/logo-full.svg"
+                  height={1000}
+                  width={1000}
+                  alt="patient"
+                  className="mb-12 h-10 w-fit"
+               />
+               <SignupForm />
+               <OAuth />
+               <p className="copyright py-12">© {new Date().getFullYear()} AVM Ayurvedic.</p>
+            </div>
+         </section>
+
+         <Image
+            src={Banners.patient_signup}
+            height={1000}
+            width={1000}
+            alt="patient"
+            className="side-img max-w-[390px]"
+         />
+      </div>
+   );
 };
 
 export default Register;

client/components/page-components/patient/auth/OAuth.tsx

@@ -6,7 +6,6 @@ import { app } from "@/config/firebaseConfig";
 import { useAuth } from "@/lib/hooks/useAuth";
 import { useOAuthSigninPatient } from "@/lib/hooks/patient/usePatientAuth";
 import { getAuth, signInWithPopup, GoogleAuthProvider } from "firebase/auth";
-import { Link } from "lucide-react";
 import Image from "next/image";
 import { useRouter } from "next/navigation";
 

client/middleware.ts

@@ -1,17 +1,20 @@
 import { NextResponse } from 'next/server';
-import type { NextRequest } from 'next/server';
+import { NextRequest } from 'next/server';
+import patientMiddleware from './middleware/patientMiddleware';
+import adminMiddleware from './middleware/adminMiddleware';
+import doctorMiddleware from './middleware/doctorMiddleware';
 
 export function middleware(request: NextRequest) {
   const { pathname } = request.nextUrl;
-  if (pathname === '/admin') {
-    return NextResponse.redirect(new URL('/admin/dashboard', request.url));
-  }
-  if (pathname === '/doctor') {
-    return NextResponse.redirect(new URL("/doctor/slots", request.url));
-  }
+
+  let response = patientMiddleware(request, pathname);
+  if (response) return response;
+
+  response = adminMiddleware(request, pathname);
+  if (response) return response;
+
+  response = doctorMiddleware(request, pathname);
+  if (response) return response;
+
   return NextResponse.next();
 }
-
-export const config = {
-  matcher: ['/admin/:path*', "/doctor/:path"],
-};

client/middleware/adminMiddleware.ts

@@ -0,0 +1,21 @@
+import { NextRequest, NextResponse } from "next/server";
+
+const adminMiddleware = (request: NextRequest, pathname: string) => {
+    if (pathname === '/admin') {
+        return NextResponse.redirect(new URL('/admin/dashboard', request.url));
+    }
+
+    const adminToken = request.cookies.get("adminToken")?.value;
+
+    if (adminToken) {
+
+    } else {
+        if (pathname.startsWith('/admin')) {
+            return NextResponse.rewrite(new URL('/404', request.url));
+        }
+    }
+
+    return undefined;
+};
+
+export default adminMiddleware;

client/middleware/doctorMiddleware.ts

@@ -0,0 +1,19 @@
+import { NextRequest, NextResponse } from "next/server";
+
+const doctorMiddleware = (request: NextRequest, pathname: string) => {
+    if (pathname === '/doctor') {
+        return NextResponse.redirect(new URL('/doctor/slots', request.url));
+    }
+
+    const doctorToken = request.cookies.get("doctorToken")?.value;
+
+    if (!doctorToken) {
+        if (pathname.startsWith('/doctor')) {
+            return NextResponse.rewrite(new URL('/404', request.url));
+        }
+    }
+
+    return undefined;
+};
+
+export default doctorMiddleware;

client/middleware/patientMiddleware.ts

@@ -0,0 +1,28 @@
+import { NextRequest, NextResponse } from "next/server";
+
+const patientMiddleware = (request: NextRequest, pathname: string) => {
+    const patientToken = request.cookies.get("patientToken")?.value;
+
+    if (patientToken) {
+        if (
+            pathname === '/signin' ||
+            pathname === '/signup' ||
+            pathname === '/signin/opt-verification' ||
+            pathname === '/signin/reset-password'
+        ) {
+            return NextResponse.rewrite(new URL('/404', request.url));
+        }
+    } else {
+        if (
+            pathname === '/profile' ||
+            pathname === '/appointments' ||
+            pathname === '/register'
+        ) {
+            return NextResponse.rewrite(new URL('/404', request.url));
+        }
+    }
+
+    return undefined;
+};
+
+export default patientMiddleware;