From 16f2b31029c68a12123e2f0e547bf2a3b8ecc867 Mon Sep 17 00:00:00 2001
From: Shrey Hirapara <shreypatel25907@gmail.com>
Date: Thu, 28 May 2026 18:37:00 +0530
Subject: [PATCH 1/2] fix: restore password visibility toggle on login page

---
 src/pages/Login/Login.tsx | 37 +++++++++++++++++++++++--------------
 1 file changed, 23 insertions(+), 14 deletions(-)

diff --git a/src/pages/Login/Login.tsx b/src/pages/Login/Login.tsx
index 92b7073e..f5730e7f 100644
--- a/src/pages/Login/Login.tsx
+++ b/src/pages/Login/Login.tsx
@@ -1,6 +1,7 @@
 import React, { useState, ChangeEvent, FormEvent, useContext } from "react";
 import axios from "axios";
 import { useNavigate, Link } from "react-router-dom";
+import { Eye, EyeOff } from "lucide-react";
 import { ThemeContext } from "../../context/ThemeContext";
 import type { ThemeContextType } from "../../context/ThemeContext";
 
@@ -15,6 +16,7 @@ const Login: React.FC = () => {
   const [formData, setFormData] = useState<LoginFormData>({ email: "", password: "" });
   const [message, setMessage] = useState<string>("");
   const [isLoading, setIsLoading] = useState<boolean>(false);
+  const [showPassword, setShowPassword] = useState<boolean>(false);
 
   const navigate = useNavigate();
   const themeContext = useContext(ThemeContext) as ThemeContextType;
@@ -108,20 +110,27 @@ const Login: React.FC = () => {
 
             <div className="relative">
               <input
-                type="password"
-                name="password"
-                autoComplete="current-password"
-                placeholder="Enter your password"
-                value={formData.password}
-                onChange={handleChange}
-                required
-                className={`w-full pl-4 pr-4 py-4 rounded-2xl focus:outline-none transition-all ${
-                  mode === "dark"
-                    ? "bg-white/5 border border-white/10 text-white placeholder-slate-400 focus:ring-2 focus:ring-purple-500"
-                    : "bg-gray-100 border border-gray-300 text-gray-900 placeholder-gray-500 focus:ring-2 focus:ring-purple-400"
-                }`}
-              />
-            </div>
+               type={showPassword ? "text" : "password"}
+               name="password"
+               autoComplete="current-password"
+               placeholder="Enter your password"
+               value={formData.password}
+               onChange={handleChange}
+               required
+               className={`w-full pl-4 pr-12 py-4 rounded-2xl focus:outline-none transition-all ${
+                 mode === "dark"
+                   ? "bg-white/5 border border-white/10 text-white placeholder-slate-400 focus:ring-2 focus:ring-purple-500"
+                   : "bg-gray-100 border border-gray-300 text-gray-900 placeholder-gray-500 focus:ring-2 focus:ring-purple-400"
+               }`}
+            />
+              <button
+                  type="button"
+                  onClick={() => setShowPassword(!showPassword)}
+                  className="absolute right-4 top-1/2 -translate-y-1/2 text-gray-500"
+                >
+                  {showPassword ? <EyeOff size={20} /> : <Eye size={20} />}
+                </button>
+             </div>
 
             <button
               type="submit"

From 4b56c037c04c266c191ee7a754bc07bc6a1653cb Mon Sep 17 00:00:00 2001
From: Shrey Patel <shreypatel25907@gmail.com>
Date: Thu, 28 May 2026 18:50:23 +0530
Subject: [PATCH 2/2] Update src/pages/Login/Login.tsx

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
---
 src/pages/Login/Login.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/pages/Login/Login.tsx b/src/pages/Login/Login.tsx
index f5730e7f..b26e4b96 100644
--- a/src/pages/Login/Login.tsx
+++ b/src/pages/Login/Login.tsx
@@ -126,6 +126,7 @@ const Login: React.FC = () => {
               <button
                   type="button"
                   onClick={() => setShowPassword(!showPassword)}
+                  aria-label={showPassword ? "Hide password" : "Show password"}
                   className="absolute right-4 top-1/2 -translate-y-1/2 text-gray-500"
                 >
                   {showPassword ? <EyeOff size={20} /> : <Eye size={20} />}