Added Client Portal(Working)

src/app/client-portal/login/page.tsx

@@ -2,7 +2,7 @@
 
 import { useState, useEffect } from "react"
 import { useRouter } from "next/navigation"
-import { Eye, EyeOff } from "lucide-react"
+import { Eye, EyeOff, AlertCircle } from "lucide-react"
 
 export default function ClientLoginPage() {
   const router = useRouter()
@@ -12,12 +12,13 @@ export default function ClientLoginPage() {
   const [loading, setLoading] = useState(false)
   const [error, setError] = useState("")
   const [checking, setChecking] = useState(true)
+  const [debugInfo, setDebugInfo] = useState("")
 
   useEffect(() => {
     fetch("/api/auth/me", { credentials: "include" })
       .then((r) => r.json())
       .then((data) => {
-        if (data.role === "client") router.push("/client-portal/dashboard")
+        if (data.user?.role === "client") router.push("/client-portal/dashboard")
         else setChecking(false)
       })
       .catch(() => setChecking(false))
@@ -27,6 +28,7 @@ export default function ClientLoginPage() {
     e.preventDefault()
     setLoading(true)
     setError("")
+    setDebugInfo("")
 
     try {
       const res = await fetch("/api/auth/login", {
@@ -36,19 +38,27 @@ export default function ClientLoginPage() {
       })
 
       const data = await res.json()
+      console.log("LOGIN RESPONSE:", res.status, data)
+
       if (!res.ok) {
         setError(data.error || "Login failed")
+        setDebugInfo(`HTTP ${res.status}`)
         return
       }
 
       if (data.user?.role !== "client") {
         setError("This portal is for clients only")
+        setDebugInfo(`User role: ${data.user?.role}`)
         return
       }
 
-      router.push("/client-portal/dashboard")
-    } catch {
+      setError("Login successful! Redirecting...")
+      setDebugInfo("")
+      setTimeout(() => { window.location.href = "/client-portal/dashboard" }, 300)
+    } catch (err) {
+      console.error("LOGIN FETCH ERROR:", err)
       setError("Connection error")
+      setDebugInfo("Check network tab for details")
     } finally {
       setLoading(false)
     }
@@ -108,8 +118,14 @@ export default function ClientLoginPage() {
           </div>
 
           {error && (
-            <div className="text-xs text-red-400 bg-red-400/5 border border-red-400/10 rounded-lg px-3 py-2">
-              {error}
+            <div className={"text-sm bg-opacity-10 border rounded-lg px-3 py-2 " + (error === "Login successful! Redirecting..."
+              ? "text-[#1BB0CE] bg-[#1BB0CE]/5 border-[#1BB0CE]/20"
+              : "text-red-400 bg-red-400/5 border-red-400/10")}>
+              <div className="flex items-center gap-2">
+                {error !== "Login successful! Redirecting..." && <AlertCircle className="h-4 w-4 shrink-0" />}
+                <span className="font-medium">{error}</span>
+              </div>
+              {debugInfo && <div className="mt-1 text-xs opacity-60">{debugInfo}</div>}
             </div>
           )}