Bug: NextJS App router - Authentication error about kinde-auth-nextjs HOT 6 CLOSED

@slayt12 @kelvinyelyen thanks for the great feedback. We can also look at updating the provided components to have a client side version. I'll add an issue to track this work

from kinde-auth-nextjs.

Hey @slayt12, thanks for raising this - I'd love to get it sorted for you.

I haven't been able to reproduce it so just a few follow up questions to narrow this down:

1. is this happening in all browsers?
2. What version of NextJS are you using?

from kinde-auth-nextjs.

Thanks for getting back to me:
NextJS Version 13.4.19
Currently using Brave browser. Also tried with firefox.

from kinde-auth-nextjs.

Hey @slayt12, I just re-read your issue which is making more sense to me now.

If you take a look at the markup for LoginLink you'll see it uses an HTML <a> tag under the hood. This is because the NextJS <Link> component does some prefetching where it calls Kinde ahead of time, which starts an auth session, this means when the browser fully redirects to Kinde it appears like you're a second user trying to hijack the first session and therefore doesn't allow you to authenticate.

We will update our docs to explain this more clearly. Is using either our provided links or a raw a tag a blocker for you?

from kinde-auth-nextjs.

Yeah with the Kinde Login/out/register provided buttons being server side components, it doesn't play well with interactive login buttons. Creating a custom button that directs it to the api directory is needed. I don't have an issue using a raw tag.

from kinde-auth-nextjs.

I’ve faced similar complexities when integrating the provided tags (SSCs) within client-side components. It’s promising to witness documentation improvements in response to these challenges. Employing custom buttons or raw tags for interactions with the auth routes have proved effective for me.

from kinde-auth-nextjs.