🤠 Check Auth State

Get the current user server and client-side

Add the Session Provider

AuthProvider.tsx 
'use client';

import { SessionProvider } from 'next-auth/react';

type Props = {
  children: React.ReactNode;
};

export default function AuthProvider({ children }: Props) {
  return <SessionProvider>{children}</SessionProvider>;
}

Use it in the root layout

App.tsx 
export default function RootLayout({ children }: Props) {
  return (
    <AuthProvider>
        ...
    </AuthProvider>
  )

Serverside

import { getServerSession } from 'next-auth';


  const session = await getServerSession();

  if (!session) {
    // redirect or render something else
  }

Clientside

"use client";

import { useSession } from "next-auth/react"

export default function AuthCheck({ children }: { children: React.ReactNode }) {
    const { data: session, status } = useSession();

    console.log(session, status)

    if (status === 'authenticated') {
        return <>{children}</>
    } else {
        return <>Not logged in to see this</>
    }
}

Questions? Let's chat

Open Discord