fix: arreglar bug de recarga cuando login con credenciales incorrectas. arreglar espaciados y estilos específicos.
Cambiar emojis por iconos para mantener coherencia visual. Eliminado SVG de iconos de ojos para la contraseña e implementados iconos de la misma librería.
This commit is contained in:
@@ -2,6 +2,7 @@ import { useState, useEffect } from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { getUserHistory, deleteHistoryItem } from '../services/docService';
|
||||
import Step3FinalGraph from '../components/editor/Step3FinalGraph';
|
||||
import { FiEye, FiTrash2, FiBarChart2, FiInbox, FiClock } from 'react-icons/fi';
|
||||
|
||||
export default function History() {
|
||||
const [historyItems, setHistoryItems] = useState([]);
|
||||
@@ -64,12 +65,13 @@ export default function History() {
|
||||
{/* Lista de Historial */}
|
||||
{isLoading ? (
|
||||
<div className="bg-white p-12 rounded-3xl shadow-sm border border-slate-200 flex flex-col items-center justify-center text-slate-400 border-dashed">
|
||||
<div className="animate-spin text-4xl mb-4">⏳</div>
|
||||
<p className="font-medium">Cargando tus gráficas...</p>
|
||||
<div className="text-6xl"><FiClock className="w-16 h-16 mb-4 opacity-50" strokeWidth={1.5} /></div>
|
||||
<p className="font-medium text-lg">Cargando tus gráficas...</p>
|
||||
|
||||
</div>
|
||||
) : historyItems.length === 0 ? (
|
||||
<div className="bg-white p-12 rounded-3xl shadow-sm border border-slate-200 flex flex-col items-center justify-center text-slate-400 border-dashed">
|
||||
<span className="text-6xl mb-4">📭</span>
|
||||
<span className="text-6xl"><FiInbox className="w-16 h-16 mb-4 opacity-50" strokeWidth={1.5} /></span>
|
||||
<p className="font-medium text-lg">Aún no has guardado ningún modelo.</p>
|
||||
<p className="text-sm mt-2">Ve al editor, crea una gráfica y dale a "Guardar".</p>
|
||||
</div>
|
||||
@@ -86,7 +88,7 @@ export default function History() {
|
||||
<div className="p-6 flex flex-col sm:flex-row justify-between items-center gap-4 bg-slate-50/50 rounded-t-2xl">
|
||||
<div className="flex items-center gap-4 w-full sm:w-auto">
|
||||
<div className="w-12 h-12 bg-blue-100 text-blue-600 rounded-full flex items-center justify-center text-xl shadow-inner">
|
||||
📊
|
||||
<FiBarChart2 className="w-5 h-5" strokeWidth={2.5} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-xl font-bold text-slate-800">{item.name || 'Modelo sin título'}</h3>
|
||||
@@ -111,7 +113,7 @@ export default function History() {
|
||||
className="px-4 py-2.5 bg-white border border-red-200 text-red-500 font-bold rounded-xl hover:bg-red-50 transition-colors shadow-sm"
|
||||
title="Borrar modelo"
|
||||
>
|
||||
Borrar
|
||||
<FiTrash2 className="w-5 h-5" strokeWidth={2.5} />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -2,7 +2,7 @@ import { useState, useEffect, useRef } from 'react';
|
||||
import { Link, useNavigate, useSearchParams } from 'react-router-dom';
|
||||
import { useAuth } from '../context/AuthContext';
|
||||
import { authService } from '../services/authService';
|
||||
import EyeIcon from '../components/EyeIcon';
|
||||
import { FiEye, FiEyeOff } from 'react-icons/fi';
|
||||
|
||||
export default function Login() {
|
||||
const [email, setEmail] = useState('');
|
||||
@@ -70,7 +70,7 @@ export default function Login() {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex-1 flex items-center justify-center">
|
||||
<div className="flex-1 flex items-center justify-center py-4">
|
||||
<div className="max-w-md w-full bg-white p-10 rounded-3xl shadow-sm border border-slate-200">
|
||||
|
||||
<div className="text-center mb-8">
|
||||
@@ -108,7 +108,11 @@ export default function Login() {
|
||||
onClick={() => setShowPassword(!showPassword)}
|
||||
className="absolute right-4 top-1/2 -translate-y-1/2 text-slate-400 hover:text-slate-600 transition-colors focus:outline-none"
|
||||
>
|
||||
<EyeIcon isOpen={showPassword} />
|
||||
{showPassword ? (
|
||||
<FiEye className="w-5 h-5" strokeWidth={2} />
|
||||
) : (
|
||||
<FiEyeOff className="w-5 h-5" strokeWidth={2} />
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -2,7 +2,7 @@ import { useState } from 'react';
|
||||
import { useNavigate, Link } from 'react-router-dom';
|
||||
import { useAuth } from '../context/AuthContext';
|
||||
import { authService } from '../services/authService';
|
||||
import EyeIcon from '../components/EyeIcon';
|
||||
import { FiEye, FiEyeOff } from 'react-icons/fi';
|
||||
|
||||
export default function Register() {
|
||||
const [username, setUsername] = useState('');
|
||||
@@ -37,7 +37,7 @@ export default function Register() {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex-1 flex items-center justify-center">
|
||||
<div className="flex-1 flex items-center justify-center py-4">
|
||||
<div className="max-w-md w-full bg-white p-10 rounded-3xl shadow-sm border border-slate-200">
|
||||
|
||||
<div className="text-center mb-8">
|
||||
@@ -58,7 +58,7 @@ export default function Register() {
|
||||
type="text" required autoComplete="username"
|
||||
className="w-full px-5 py-3 rounded-2xl border border-slate-200 focus:ring-2 focus:ring-blue-500 outline-none transition-all bg-slate-50 focus:bg-white"
|
||||
value={username} onChange={(e) => setUsername(e.target.value)}
|
||||
placeholder="Ej: usuario99"
|
||||
placeholder="Ej: alexis99"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -86,7 +86,11 @@ export default function Register() {
|
||||
type="button" onClick={() => setShowPassword(!showPassword)}
|
||||
className="absolute right-4 top-1/2 -translate-y-1/2 text-slate-400 hover:text-slate-600 transition-colors focus:outline-none"
|
||||
>
|
||||
<EyeIcon isOpen={showPassword} />
|
||||
{showPassword ? (
|
||||
<FiEye className="w-5 h-5" strokeWidth={2} />
|
||||
) : (
|
||||
<FiEyeOff className="w-5 h-5" strokeWidth={2} />
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -105,7 +109,11 @@ export default function Register() {
|
||||
type="button" onClick={() => setShowConfirmPassword(!showConfirmPassword)}
|
||||
className="absolute right-4 top-1/2 -translate-y-1/2 text-slate-400 hover:text-slate-600 transition-colors focus:outline-none"
|
||||
>
|
||||
<EyeIcon isOpen={showConfirmPassword} />
|
||||
{showConfirmPassword ? (
|
||||
<FiEye className="w-5 h-5" strokeWidth={2} />
|
||||
) : (
|
||||
<FiEyeOff className="w-5 h-5" strokeWidth={2} />
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user