import { useMemo, useState } from 'react';
import { useNavigate, Link } from 'react-router-dom';
import { useAuth } from '../../contexts/AuthContext';
import { Download, PenTool } from 'lucide-react';
import toast from 'react-hot-toast';

export default function LoginPage() {
  const { login } = useAuth();
  const navigate = useNavigate();
  const [form, setForm] = useState({ email: '', password: '' });
  const [loading, setLoading] = useState(false);
  const apiBaseUrl = (import.meta.env.VITE_API_URL || 'http://localhost:4000').replace(/\/$/, '');
  const androidApkUrl = `${apiBaseUrl}/downloads/android-apk`;
  const showAndroidDownload = useMemo(() => {
    if (typeof navigator === 'undefined') return false;
    return /Android/i.test(navigator.userAgent || '');
  }, []);

  const handleChange = (e) => setForm((f) => ({ ...f, [e.target.name]: e.target.value }));

  const handleSubmit = async (e) => {
    e.preventDefault();
    setLoading(true);
    try {
      await login(form.email, form.password);
      navigate('/dashboard');
    } catch (err) {
      const code = err.response?.data?.code;
      const message = err.response?.data?.error || 'Error al iniciar sesión';

      if (code === 'EMAIL_NOT_VERIFIED') {
        toast.success('Tu cuenta aún no está validada. Te enviamos un nuevo correo de confirmación.');
      } else if (code === 'ACCOUNT_LOCKED') {
        toast.error('Tu cuenta fue bloqueada temporalmente. Revisa tu correo para desbloquear el sistema.');
      } else if (code === 'MAIL_SEND_FAILED') {
        toast.error(message);
      } else if (code === 'UNLOCK_MAIL_SEND_FAILED') {
        toast.error(message);
      } else {
        toast.error(message);
      }
    } finally {
      setLoading(false);
    }
  };

  return (
    <div className="auth-page">
      <div className="auth-card">
        <div className="auth-logo">
          <PenTool size={32} />
          <h1>LinkedSign</h1>
          <p>Firma digital segura</p>
        </div>
        <form onSubmit={handleSubmit} className="auth-form">
          <div className="field">
            <label>Correo electrónico</label>
            <input type="email" name="email" value={form.email} onChange={handleChange} required autoFocus />
          </div>
          <div className="field">
            <label>Contraseña</label>
            <input type="password" name="password" value={form.password} onChange={handleChange} required />
          </div>
          <button type="submit" className="btn btn-primary btn-full" disabled={loading}>
            {loading ? 'Ingresando...' : 'Iniciar sesión'}
          </button>
          {showAndroidDownload && (
            <a className="btn btn-secondary btn-full auth-download-btn" href={androidApkUrl}>
              <Download size={14} />
              Descargar app Android
            </a>
          )}
        </form>
        <p className="auth-link">
          ¿No tienes cuenta? <Link to="/register">Registrarse</Link>
        </p>
      </div>
    </div>
  );
}