signIn hook not redirecting directly to the good provider

[edonadei]

Question 💬

`Hello, and thank you for this wonderful library.

I have a simple issue, I'm trying to use the signIn hook, and it works well, but I would like to directly start the google workflow, and not having the sign in page.

Here's my implementation.

<a onClick={() => signIn("google", { callbackUrl: "/" })}>
      <span className="sr-only">Sign in with Google</span> 
</a>

But at the moment, each time I'm clicking that span, it redirects me on the sign in page.

I'm on version 3.27.3 of next-auth.

Thanks!

How to reproduce ☕️

<a onClick={() => signIn("google", { callbackUrl: "/" })}>
      <span className="sr-only">Sign in with Google</span> 
</a>

Contributing 🙌🏽

Yes, I am willing to help answer this question in a PR

[balazsorban44]

signIn is usually associated with the action of signing in, and not a page navigation, so I think more often you want to use a button element. Especially in this case, where you have an onClick event handler on an a that has no href. If I had to guess, you have to do call .preventDefault() before signIn.

Tell me if that works.

[edonadei]

Wow, thanks for this fast answer, I tried this, but it does not work.

<a
  onClick={(e) => {
    e.preventDefault();
    signIn("google", { callbackUrl: "/" });
  }}
>

[edonadei]

I even tried to modify it as a button with .preventDefault. but it's still the same behavior.

[edonadei]

Man, I'm sorry it just works, was an issue with Next that just stopped to auto-refresh even if it was still up. Sorry for losing your time and thanks for the help.

[balazsorban44]

No problem! Glad it worked out! 😄