FeaturesAuthenticationPassword Reset

Password Reset

A two-step flow: request a reset link via email, then set a new password using the token from that link.

Step 1 — Request reset email

import { useAuth } from '@aerostack/react'
 
function ForgotPassword() {
  const { requestPasswordReset, loading } = useAuth()
 
  const handleSubmit = async () => {
    await requestPasswordReset(email)
    // Show "check your email" confirmation
  }
}

Step 2 — Set new password

The reset email links to your app with a ?token= param. Handle it on your reset page:

import { useAuth } from '@aerostack/react'
import { useSearchParams } from 'react-router-dom'
 
function ResetPasswordPage() {
  const { resetPassword, loading, error } = useAuth()
  const [params] = useSearchParams()
  const [newPassword, setNewPassword] = useState('')
 
  const handleReset = async (e) => {
    e.preventDefault()
    const token = params.get('token')
    await resetPassword(token, newPassword)
    // Redirect to login
  }
 
  return (
    <form onSubmit={handleReset}>
      <input
        type="password"
        value={newPassword}
        onChange={e => setNewPassword(e.target.value)}
        placeholder="New password"
        minLength={8}
      />
      {error && <p className="text-red-500">{error}</p>}
      <button type="submit" disabled={loading}>Reset password</button>
    </form>
  )
}

Configure reset email redirect

Set your app’s reset URL in the dashboard under Auth → Configuration → Password Reset URL. Aerostack appends ?token=... to this URL when sending the reset email.

Email VerificationConfiguration