# Request Password Reset Component

PropelAuth's Request Password Reset component allows you to customize the component to start password reset flows in your application. This component will send a [reset password email](https://docs.propelauth.com/overview/misc/transactional-emails) to the provided email address. It is designed to be used when your user has a [Login State](https://ui.propelauth.com/login-signup-apis#login-state) of `LOGIN_REQUIRED` and does not remember their password.

If you're looking for a component that will allow a logged in user the ability to update their password, or one with a [Login State](https://ui.propelauth.com/login-signup-apis#login-state) of `UPDATE_PASSWORD_REQUIRED`, check out our [Update User Password](https://ui.propelauth.com/account-page-components/update-user-password) component.

We highly recommend reviewing the [Login and Signup Guide](https://ui.propelauth.com/login-signup-apis) if using any of our login or signup components.

## Request Password Reset

### Email

Send Password Reset Email

---

## [Shadcn Installation](https://ui.propelauth.com/login-signup-apis/request-reset-password-email#shadcn-installation)

Install this component from our [shadcn registry](https://ui.propelauth.com/getting-started/component-registry).

```bash
npx shadcn@latest add https://components.propelauth.com/r/request-password-reset.json
```

---

# Reference APIs

These are the APIs that are used by the above component. You can use these APIs directly in your own code.

## [sendForgotPasswordEmail](https://ui.propelauth.com/login-signup-apis/request-reset-password-email#send-forgot-password-email)

Sends the user an email to reset their password if an account with that email exists.

## Arguments

- Name `email` *Type string*  
Description The email of the user

## Success Response

- Name `message` *Type string*  
Description A confirmation message, such as 'If that email address is in our database, we will send you an email to reset your password.'
- Name `sniper_links` *Type dictionary*  
Description

A dictionary of sniper links you can provide to the user for `gmail`, `outlook`, and `yahoo`.

## Response Functions

The response object has a **handle** function that you can use to handle the response. These functions can be async, and you can return values from them.

- Name `success`  
Description Successful request.
- Name `badRequest`  
Description Incorrect arguments provided.
- Name `unexpectedOrUnhandled`  
Description An unexpected error occurred.

### Request

```
const { sendForgotPasswordEmail } = useAuthFrontendApis()

const response = await sendForgotPasswordEmail({
    email: "test@example.com"
})
response.handle({
    success(data) {
        console.log(data)
    },
    badRequest(error) {
        for (const [field, fieldErrorMessage] of Object.entries(error.user_facing_errors)) {
            console.log('Error: "' + fieldErrorMessage + '" for field: "' + field + '"')
        }
    },
    unexpectedOrUnhandled(error) {
        console.error('Unexpected or unhandled', error.user_facing_error)
    },
})
```

### Successful Response

```
{
    "message": "If that email address is in our database, we will send you an email to reset your password.",
    "sniper_links": {
        "gmail": "https://mail.google.com/mail/u/0/#search/propelauth",
        "outlook": "https://outlook.live.com/mail/0/inbox",
        "yahoo": "https://mail.yahoo.com/d/folders/1"
    }
}
```