Renombrar /login -> /log-in en toda la web (/login da 404)

Mueve la página de login a /log-in y actualiza todas las referencias (enlace CONECTAR del header y los redirect de auth de ~45 páginas). /login ahora da 404. La API /api/auth/login no se toca (solo la ruta de página). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-07-14 21:03:31 +00:00
parent 14125dbd72
commit 20e1d5a6b5
49 changed files with 67 additions and 52 deletions
@@ -0,0 +1,121 @@
+'use client'
+
+import { useState } from 'react'
+import { useTranslations, useLocale } from 'next-intl'
+import { Turnstile } from '@/components/Turnstile'
+
+const ERROR_KEYS = ['invalidCredentials', 'missingFields', 'invalidRequest', 'captchaFailed'] as const
+
+export function LoginForm() {
+  const t = useTranslations('Login')
+  const locale = useLocale()
+  const [email, setEmail] = useState('')
+  const [password, setPassword] = useState('')
+  const [showPw, setShowPw] = useState(false)
+  const [busy, setBusy] = useState(false)
+  const [captcha, setCaptcha] = useState('')
+  const [message, setMessage] = useState<{ ok: boolean; text: string } | null>(null)
+
+  async function handleSubmit(e: React.FormEvent) {
+    e.preventDefault()
+    if (busy) return
+    if (!email.trim() || !password) {
+      setMessage({ ok: false, text: t('missingFields') })
+      return
+    }
+    setBusy(true)
+    setMessage(null)
+    try {
+      const res = await fetch('/api/auth/login', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        credentials: 'same-origin',
+        body: JSON.stringify({ email: email.trim(), password, turnstileToken: captcha }),
+      })
+      const data: { success?: boolean; needsSelection?: boolean; error?: string } = await res.json()
+      if (data.success) {
+        setMessage({ ok: true, text: t('success') })
+        // Navegación completa (no del lado cliente): fuerza que el servidor
+        // re-renderice el layout/cabecera con la sesión nueva. Con router.push
+        // el layout persiste y la cabecera seguía mostrando "Conectar".
+        window.location.assign(`/${locale}${data.needsSelection ? '/select-account' : '/my-account'}`)
+        return
+      } else {
+        const key = (ERROR_KEYS as readonly string[]).includes(data.error ?? '') ? data.error! : 'genericError'
+        setMessage({ ok: false, text: t(key) })
+        setBusy(false)
+      }
+    } catch {
+      setMessage({ ok: false, text: t('genericError') })
+      setBusy(false)
+    }
+  }
+
+  return (
+    <>
+      <form onSubmit={handleSubmit} acceptCharset="utf-8" noValidate>
+        <table className="middle-center-table">
+          <tbody>
+            <tr>
+              <td>
+                <input
+                  type="email"
+                  maxLength={320}
+                  name="email"
+                  id="username"
+                  placeholder={t('email')}
+                  autoFocus
+                  required
+                  value={email}
+                  onChange={(e) => setEmail(e.target.value)}
+                />
+              </td>
+            </tr>
+            <tr>
+              <td>
+                <input
+                  type={showPw ? 'text' : 'password'}
+                  maxLength={16}
+                  name="password"
+                  id="password"
+                  placeholder={t('password')}
+                  required
+                  value={password}
+                  onChange={(e) => setPassword(e.target.value)}
+                />
+                <span
+                  className={`far toggle-password ${showPw ? 'fa-eye-slash' : 'fa-eye'}`}
+                  onClick={() => setShowPw((v) => !v)}
+                  role="button"
+                  aria-label="toggle"
+                />
+              </td>
+            </tr>
+            <tr>
+              <td>
+                <Turnstile onVerify={setCaptcha} />
+              </td>
+            </tr>
+            <tr>
+              <td>
+                <button
+                  type="submit"
+                  className="login-button"
+                  disabled={busy}
+                >
+                  {busy ? t('connecting') : t('submit')}
+                </button>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </form>
+      <hr />
+      <div className="alert-message" style={{ display: message ? 'block' : 'none' }}>
+        {message && (
+          <span className={message.ok ? 'ok-form-response' : 'red-form-response'}>{message.text}</span>
+        )}
+      </div>
+    </>
+  )
+}
@@ -0,0 +1,33 @@
+import { getTranslations, setRequestLocale } from 'next-intl/server'
+import { Link } from '@/i18n/navigation'
+import { PageShell } from '@/components/PageShell'
+import { LoginForm } from './LoginForm'
+
+export default async function LoginPage({ params }: { params: Promise<{ locale: string }> }) {
+  const { locale } = await params
+  setRequestLocale(locale)
+  const t = await getTranslations('Login')
+
+  return (
+    <PageShell title={t('title')}>
+      <div className="box-content">
+        <div className="body-box-content centered">
+          <LoginForm />
+          <br />
+          <p>
+            <Link href="/recover">{t('forgot')}</Link>
+          </p>
+          <p>
+            <Link href="/recover">{t('forgotActivation')}</Link>
+          </p>
+          <br />
+          <p>
+            {t('newHere')} <Link href="/create-account">{t('createAccount')}</Link>
+          </p>
+          <br />
+          <p className="grey-info2">{t('publicNote')}</p>
+        </div>
+      </div>
+    </PageShell>
+  )
+}