From 1458c143bc350b3ce7643cad3fe06886bd593f9d Mon Sep 17 00:00:00 2001
From: rafael <rafaelminaya20@hotmail.com>
Date: Sat, 22 Nov 2025 22:41:16 -0400
Subject: [PATCH] Update `ProfilePage`: Replace username with email in profile
 form

Replaced the username field with an email field in the profile form. Updated form logic, validation messages, and input placeholders accordingly. Adjusted UI labels and input types to reflect the change.
---
 src/components/Profile/ProfilePage.js | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/components/Profile/ProfilePage.js b/src/components/Profile/ProfilePage.js
index 7aca076..60d791b 100644
--- a/src/components/Profile/ProfilePage.js
+++ b/src/components/Profile/ProfilePage.js
@@ -58,7 +58,7 @@ const ProfilePage = () => {
   const initials = computeInitials(profile.firstName, profile.lastName);
 
   const [form, setForm] = useState({
-    username: profile.username,
+    email: profile.email,
     firstName: profile.firstName,
     lastName: profile.lastName,
     password: '',
@@ -67,7 +67,7 @@ const ProfilePage = () => {
   useEffect(() => {
     if (showModal) {
       setForm({
-        username: profile.username,
+        email: profile.email,
         firstName: profile.firstName,
         lastName: profile.lastName,
         password: '',
@@ -87,8 +87,8 @@ const ProfilePage = () => {
     e.preventDefault();
 
     // Validaciones básicas
-    if (!form.username.trim() || !form.firstName.trim() || !form.lastName.trim()) {
-      alert('Por favor, completa los campos: usuario, nombre y apellido.');
+    if (!form.email.trim() || !form.firstName.trim() || !form.lastName.trim()) {
+      alert('Por favor, completa los campos: correo, nombre y apellido.');
       return;
     }
 
@@ -100,7 +100,7 @@ const ProfilePage = () => {
     // En una app real, aquí llamarías a la API para actualizar perfil y contraseña.
     setProfile((prev) => ({
       ...prev,
-      username: form.username.trim(),
+      email: form.email.trim(),
       firstName: form.firstName.trim(),
       lastName: form.lastName.trim(),
       // La contraseña NO se guarda en localStorage; solo se simula el flujo.
@@ -169,15 +169,15 @@ const ProfilePage = () => {
                 <div className="form-row">
                   <div className="form-group" style={{ flex: 1 }}>
                     <label>
-                      <i className="fas fa-user-circle" aria-hidden="true"></i> Usuario
+                      <i className="fas fa-envelope" aria-hidden="true"></i> Correo electrónico
                     </label>
                     <input
                       className="input"
-                      type="text"
-                      name="username"
-                      value={form.username}
+                      type="email"
+                      name="email"
+                      value={form.email}
                       onChange={handleChange}
-                      placeholder="Nombre de usuario"
+                      placeholder="correo@ejemplo.com"
                       required
                     />
                   </div>