Hotfix: add logged-out password reset flow

frontend/app/forgot-password/page.tsx

@@ -0,0 +1,79 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import BrandingLogo from '../ui/BrandingLogo'
+import { getApiBase } from '../lib/auth'
+
+export default function ForgotPasswordPage() {
+  const router = useRouter()
+  const [identifier, setIdentifier] = useState('')
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+  const [status, setStatus] = useState<string | null>(null)
+
+  const submit = async (event: React.FormEvent) => {
+    event.preventDefault()
+    if (!identifier.trim()) {
+      setError('Enter your username or email.')
+      return
+    }
+    setLoading(true)
+    setError(null)
+    setStatus(null)
+    try {
+      const baseUrl = getApiBase()
+      const response = await fetch(`${baseUrl}/auth/password/forgot`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ identifier: identifier.trim() }),
+      })
+      const data = await response.json().catch(() => null)
+      if (!response.ok) {
+        throw new Error(typeof data?.detail === 'string' ? data.detail : 'Unable to send reset link.')
+      }
+      setStatus(
+        typeof data?.message === 'string'
+          ? data.message
+          : 'If an account exists for that username or email, a password reset link has been sent.',
+      )
+    } catch (err) {
+      console.error(err)
+      setError(err instanceof Error ? err.message : 'Unable to send reset link.')
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  return (
+    <main className="card auth-card">
+      <BrandingLogo className="brand-logo brand-logo--login" />
+      <h1>Forgot password</h1>
+      <p className="lede">
+        Enter the username or email you use for Jellyfin or Magent. If the account is eligible, a reset link
+        will be emailed to you.
+      </p>
+      <form className="auth-form" onSubmit={submit}>
+        <label>
+          Username or email
+          <input
+            value={identifier}
+            onChange={(event) => setIdentifier(event.target.value)}
+            autoComplete="username"
+            placeholder="you@example.com"
+          />
+        </label>
+        {error && <div className="error-banner">{error}</div>}
+        {status && <div className="status-banner">{status}</div>}
+        <div className="auth-actions">
+          <button type="submit" disabled={loading}>
+            {loading ? 'Sending reset link…' : 'Send reset link'}
+          </button>
+        </div>
+        <button type="button" className="ghost-button" onClick={() => router.push('/login')} disabled={loading}>
+          Back to sign in
+        </button>
+      </form>
+    </main>
+  )
+}