49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
'use client'
|
|
|
|
import { useEffect, useState } from 'react'
|
|
import { useRouter } from 'next/navigation'
|
|
|
|
export default function ProfileDropdown() {
|
|
const [open, setOpen] = useState(false)
|
|
const [profile, setProfile] = useState<{ user?: string; email?: string }>({})
|
|
const router = useRouter()
|
|
|
|
useEffect(() => {
|
|
fetch('/api/me')
|
|
.then((res) => res.json())
|
|
.then((data) => setProfile(data))
|
|
.catch(() => setProfile({}))
|
|
}, [])
|
|
|
|
const handleLogout = async () => {
|
|
window.location.href = '/logout'
|
|
}
|
|
|
|
const name = profile.email || profile.user || 'Loading...'
|
|
|
|
return (
|
|
<div className="relative">
|
|
<button
|
|
onClick={() => setOpen(!open)}
|
|
className="text-white font-medium px-4 py-2 hover:bg-zinc-800 rounded"
|
|
>
|
|
Profil ▾
|
|
</button>
|
|
|
|
{open && (
|
|
<div className="absolute right-0 mt-2 w-56 bg-white shadow-lg rounded z-50 text-zinc-900 overflow-hidden text-sm">
|
|
<div className="px-4 py-2 border-b border-zinc-200 font-medium">
|
|
{name}
|
|
</div>
|
|
<button
|
|
onClick={handleLogout}
|
|
className="block w-full text-left px-4 py-2 hover:bg-zinc-100"
|
|
>
|
|
Logout
|
|
</button>
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|