import { signIn, signOut, useSession } from "next-auth/react";

export default function NavBar() {
    const { data, status } = useSession();

    return (
        <nav className='flex flex-row h-12 bg-gray-900 justify-end items-center p-4 gap-1 shadow mb-4'>
            {status === 'loading' && <>...</>}
            {status === 'unauthenticated' && <button onClick={() => signIn('keycloak')}>Log in</button>}
            {status === 'authenticated' && <>
                <span>{data?.user?.name}</span>
                <button onClick={() => signOut()}>(Log out)</button>
            </>}
        </nav>
    )
}