Use signIn() from Convex Auth with "password", formData, and redirectTo

[valid gust]

How do you use signIn() from Convex Auth using the password provider flow, passing in formData and also setting redirectTo?

[muted umbra]

Hi @valid gust. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

---

To use the signIn() function from Convex Auth with the password provider, you need to pass in the provider ID (which is "password" in this case), and a FormData object containing the sign-in parameters. If you want to customize the page the user is redirected to after sign-in, you can pass a redirectTo parameter in the FormData object.

Here's an example of how you can do this:

import { useAuthActions } from "@convex-dev/auth/react";

export function SignIn() {
  const { signIn } = useAuthActions();
  return (
    <form
      onSubmit={(event) => {
        event.preventDefault();
        const formData = new FormData(event.currentTarget);
        formData.append("redirectTo", "/dashboard"); // Add this line to set redirectTo
        void signIn("password", formData);
      }}
    >
      <input name="email" placeholder="Email" type="text" />
      <input name="password" placeholder="Password" type="password" />
      <button type="submit">Sign in</button>
    </form>
  );
}

In this example, after successful sign-in, the user will be redirected to the "/dashboard" page. You can replace "/dashboard" with any valid URL or path you want the user to be redirected to.

For more information, you can refer to the Convex Auth documentation (https://labs.convex.dev/auth/api_reference/react#convexauthactionscontext) and the redirect callback documentation (https://labs.convex.dev/auth/api_reference/server#callbacksredirect).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

@valid gust kapa.ai is still learning and improving, please let us know how it did by reacting below