Next.js Discord

Discord Forum

NextAuth.js and Next14

Unanswered
Dwarf Hotot posted this in #help-forum
Open in Discord
Dwarf HototOP
Hi, I am using Next (14.0.19) and NextAuth.js (v4), I want to make a web with discord login (I already found one in github for Next 12) but having the new version of Next the code does not work as I expected, I am a self-taught programmer, I do not know much about Next or react, I am trying basic things, the web of Next 12 worked and I understand how the code works and many things, I am trying things with Next, I am trying to create a simple app for testing, my problem is with the layout. js and the page.js, at the moment I have these two codes (The layout.js does not work, I attach the error I get), I just hope you do not judge my way of learning and thanks to those who want to help. In page.js I put session as a constant because I don't know how to pass the session and i already have the [...nextauth].js

23 Replies

Cape horse mackerel
NextJS 14 uses app router by default, so you have to setup next-auth with app router as described here https://next-auth.js.org/configuration/initialization#route-handlers-app
@Cape horse mackerel NextJS 14 uses app router by default, so you have to setup next-auth with app router as described here https://next-auth.js.org/configuration/initialization#route-handlers-app
Dwarf HototOP
But how do i pass the session to all routes? I'm trying to use the layout to pass for all childrens
could you help me a little with the code to understand it?, it would help me, I am not a novice programmer, I have been doing it for 4 years with Java but I am new to next
Cape horse mackerel
// auth-provider.jsx
export default function AuthProvider({ children, ...props }) {
  return (
    <SessionProvider {...props} >
      {children}
    </SessionProvider>
  );
};

// root layout => app/layout.jsx
const RootLayout = ({ children }) => {
  return <AuthProvider>{children}</AuthProvider>
}
Dwarf HototOP
Thanks you I'll try in a while
Cape horse mackerel
yes
Dwarf HototOP
Okay I'll convert it to js
Cape horse mackerel
ok, I also converted my example to the js
Dwarf HototOP
Ahh alr thank you so much I'll try when i go home :felicidad:
Dwarf HototOP
This is how i have my code rn, but im getting this error :Sadge:
Cape horse mackerel
you should embed auth-provider within layout.js not app.js
@Cape horse mackerel you should embed auth-provider within `layout.js` not `app.js`
Dwarf HototOP
Should I make some folder for example called context out of app then? or how
ohh
got it
@Cape horse mackerel you should embed auth-provider within `layout.js` not `app.js`
Dwarf HototOP
But I'm still getting "Error: React Context is unavailable in Server Components"
probably im doing it wrong
Cape horse mackerel
but your layout.js and page.js should be jsx not js I believe.
And why dont you use app router instead of pages, the app router is now recommended
@Dwarf Hotot But I'm still getting "Error: React Context is unavailable in Server Components"
Pixiebob
Add "use client" to your auth provider
@Pixiebob Add "use client" to your auth provider
Dwarf HototOP
I'll try
@Pixiebob Add "use client" to your auth provider
Cape horse mackerel
yeah