redirect to home page after password reset via "/api/users/forgot-password"

[xu4wang]

After user make an API call to /api/users/forgot-password, a email will be sent with the link:

http://localhost:3000/admin/reset/90e569eb6bdd8985bb3b29166e32b1429c103d93 follow the link, the password can be reset successfully.

However, the user will be redirected to /admin after reset. Is there a way to redirect user to '/' instead?
The reason is the user don't have admin access in the collection config. There will be an error accessing /admin which is not good experience.

  access: {
    read: adminsAndUser,
    create: anyone,
    update: adminsAndUser,
    delete: admins,
    admin: ({ req: { user } }) => checkRole(["admin"], user),
  },

[akhrarovsaid]

Hey @xu4wang,

So, realistically, I think the flow that you want is to have this done on your own frontend - not through the Payload admin panel. The default behaviour assumes usage of the admin ui. It sounds like what you want is for this flow to be handled in your frontend app, where the user gets directed to a forgot-password page that is familiar and styled like, and is part of, the rest of your frontend.

To accomplish this, have a look at the auth > email > forgot-password section of the docs here.

This is how Payload actually handles this flow internally via api's, just for a reference if you get stuck.

What you roughly want to do here is:

• Create a custom HTML email where you attach the token as a query param and point it towards a /reset-password page
• Create a /reset-password page where you consume that attached token and validate it
  • If invalid, show some reasonable message
  • If valid, proceed to show the reset password form
  • On submission, make a request to the user collection with the new data (probably via the REST API update operation using the token to your advantage to get the user required)
    • If not successful, show a toast or some messaging
    • If successful, redirect as you'd like, to '/' or wherever

I think you will also find the following useful:

• How the Payload next package handles ForgotPassword
• How the Payload next package handles ResetPassword
• The Auth example of this flow here.

[xu4wang]

Thanks @akhrarovsaid for the detailed reference materials.