From 3eb8de7d3748438c9f98698540bc4632d5eead0f Mon Sep 17 00:00:00 2001
From: dmolinari <dmolinari@eldia.com>
Date: Wed, 22 Apr 2026 11:58:15 -0300
Subject: [PATCH] =?UTF-8?q?Feat:=20Ojito=20clave=20en=20Login=20y=20Scroll?=
 =?UTF-8?q?ToTop=20global=20al=20cambiar=20de=20p=C3=A1gina?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Frontend/src/App.tsx                   | 14 +++++++++++++-
 Frontend/src/components/LoginModal.tsx | 26 ++++++++++++++++++--------
 Frontend/src/pages/CondicionesPage.tsx |  1 -
 3 files changed, 31 insertions(+), 10 deletions(-)

diff --git a/Frontend/src/App.tsx b/Frontend/src/App.tsx
index c0830ea..3e2e8f0 100644
--- a/Frontend/src/App.tsx
+++ b/Frontend/src/App.tsx
@@ -1,5 +1,5 @@
 import { useState, useEffect } from 'react';
-import { BrowserRouter as Router, Routes, Route, Link, Navigate, useNavigate, useLocation } from 'react-router-dom';
+import { BrowserRouter as Router, Routes, Route, Link, Navigate, useNavigate, useLocation, useNavigationType } from 'react-router-dom';
 import HomePage from './pages/HomePage';
 import ExplorarPage from './pages/ExplorarPage';
 import VehiculoDetailPage from './pages/VehiculoDetailPage';
@@ -333,6 +333,17 @@ function MainLayout() {
   );
 }
 
+function ScrollToTop() {
+  const { pathname } = useLocation();
+  const navType = useNavigationType();
+  useEffect(() => {
+    if (navType !== "POP") {
+      window.scrollTo({ top: 0, behavior: "instant" });
+    }
+  }, [pathname, navType]);
+  return null;
+}
+
 function App() {
   useEffect(() => {
     const mpPublicKey = import.meta.env.VITE_MP_PUBLIC_KEY;
@@ -342,6 +353,7 @@ function App() {
   return (
     <AuthProvider>
       <Router>
+        <ScrollToTop />
         <MainLayout />
       </Router>
     </AuthProvider>
diff --git a/Frontend/src/components/LoginModal.tsx b/Frontend/src/components/LoginModal.tsx
index 017b22b..0661950 100644
--- a/Frontend/src/components/LoginModal.tsx
+++ b/Frontend/src/components/LoginModal.tsx
@@ -102,6 +102,7 @@ export default function LoginModal({ onSuccess, onClose, initialMode }: Props) {
   // Estados de Login
   const [username, setUsername] = useState("");
   const [password, setPassword] = useState("");
+  const [showLoginPass, setShowLoginPass] = useState(false);
 
   // Para controlar si mostramos la opción de reenviar email no verificado
   const [showResend, setShowResend] = useState(false);
@@ -553,14 +554,23 @@ export default function LoginModal({ onSuccess, onClose, initialMode }: Props) {
             <label className="text-xs font-black uppercase tracking-widest text-gray-500 block mb-1.5 ml-1">
               Contraseña
             </label>
-            <input
-              required
-              type="password"
-              value={password}
-              onChange={(e) => setPassword(e.target.value)}
-              className="w-full bg-white/5 border border-white/10 rounded-xl px-4 py-3.5 text-white outline-none focus:border-blue-500 transition-all placeholder:text-gray-600 focus:bg-white/10"
-              placeholder="••••••••"
-            />
+            <div className="relative">
+              <input
+                required
+                type={showLoginPass ? "text" : "password"}
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                className="w-full bg-white/5 border border-white/10 rounded-xl pl-4 pr-12 py-3.5 text-white outline-none focus:border-blue-500 transition-all placeholder:text-gray-600 focus:bg-white/10"
+                placeholder="••••••••"
+              />
+              <button
+                type="button"
+                onClick={() => setShowLoginPass(!showLoginPass)}
+                className="absolute right-4 top-1/2 -translate-y-1/2 text-gray-500 hover:text-white transition-colors"
+              >
+                {showLoginPass ? <EyeSlashIcon /> : <EyeIcon />}
+              </button>
+            </div>
             <div className="text-right mt-2">
               <button
                 type="button"
diff --git a/Frontend/src/pages/CondicionesPage.tsx b/Frontend/src/pages/CondicionesPage.tsx
index 53fd180..0593b0c 100644
--- a/Frontend/src/pages/CondicionesPage.tsx
+++ b/Frontend/src/pages/CondicionesPage.tsx
@@ -7,7 +7,6 @@ export default function CondicionesPage() {
   const [show, setShow] = useState(false);
 
   useEffect(() => {
-    window.scrollTo(0, 0);
     const t = setTimeout(() => setShow(true), 100);
     return () => clearTimeout(t);
   }, []);