Reset Password
To reset the password for an existing user account, the accounts.reset_password()
method can be called from your component:
/ui/pages/reset_password/index.js
import joystick, { accounts } from '@joystick.js/ui';
const ResetPassword = joystick.component({
events: {
'submit form': (event = {}, instance = {}) => {
accounts.reset_password({
password: event.target.password.value,
token: instance?.url?.params?.token,
}).then(() => {
location.pathname = '/dashboard';
});
},
},
render: () => {
return `
<div class="reset-password">
<form>
<label>New Password</label>
<input type="password" name="password" placeholder="New Password" />
<button type="submit">Reset Password</button>
</form>
</div>
`;
},
});
export default ResetPassword;
Above, we listen for a submit
event on our <form></form>
element, calling to accounts.reset_password()
to reset the password for an existing user. Of note, along with the new password
field, we also include a token
field which is embedded in the auto-generated URL sent to the user during password recovery.
To access it, we utilize the instance.url
object, retrieving its params.token
value where we expect the recover token to be stored. Because we expect accounts.recover_password()
to return a Promise, we use a .then()
callback if the request is successful, redirecting to a hypothetical route that requires a logged in user (following a successful reset, the user will be automatically logged in).
API Reference
accounts.reset_password()
Function API
Function API
accounts.reset_password(options: object) => Promise;
Arguments
-
options object
An
object
defining the parameters for the user account to reset.-
password string Required
A
string
defining the new password for the existing user account. -
token string Required
A
string
defining the password reset token for the existing user account.
-