Files
Balázs Orbán 65aa467c0e feat(nextjs): introduce next-auth v5 (#7443)
Next.js 13.4 [is out](https://nextjs.org/blog/next-13-4).

For discussing project-related issues, please use https://github.com/nextauthjs/next-auth/discussions/8487

The new version of NextAuth.js is based on `@auth/core`.

If you want to test it out, you can do so already, installing `next-auth@experimental`:

- **Documentation**: https://authjs.dev/reference/nextjs
- **Migration guide**: https://authjs.dev/guides/upgrade-to-v5

BREAKING CHANGE:
Follow the [migration guide](https://authjs.dev/guides/upgrade-to-v5)
2023-10-23 17:35:30 -07:00

50 lines
1.5 KiB
TypeScript

import { Avatar, AvatarFallback, AvatarImage } from "./ui/avatar"
import { Button } from "./ui/button"
import { auth } from "auth"
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuTrigger,
} from "./ui/dropdown-menu"
import { SignIn, SignOut } from "./auth-components"
export default async function UserButton() {
const session = await auth()
return session ? (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" className="relative w-8 h-8 rounded-full">
<Avatar className="w-8 h-8">
{session.user?.picture && (
<AvatarImage
src={session.user?.picture}
alt={session.user?.name ?? ""}
/>
)}
<AvatarFallback>{session.user?.email}</AvatarFallback>
</Avatar>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="w-56" align="end" forceMount>
<DropdownMenuLabel className="font-normal">
<div className="flex flex-col space-y-1">
<p className="text-sm font-medium leading-none">
{session.user?.name}
</p>
<p className="text-xs leading-none text-muted-foreground">
{session.user?.email}
</p>
</div>
</DropdownMenuLabel>
<DropdownMenuItem>
<SignOut />
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
) : (
<SignIn />
)
}