49 lines
1.4 KiB
TypeScript
49 lines
1.4 KiB
TypeScript
import { authClient } from "@code/auth/web";
|
|
import { api } from "@code/backend/convex/_generated/api";
|
|
import { Button } from "@code/ui/components/button";
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuGroup,
|
|
DropdownMenuItem,
|
|
DropdownMenuLabel,
|
|
DropdownMenuSeparator,
|
|
DropdownMenuTrigger,
|
|
} from "@code/ui/components/dropdown-menu";
|
|
import { useQuery } from "convex/react";
|
|
import { useNavigate } from "react-router";
|
|
|
|
export default function UserMenu() {
|
|
const navigate = useNavigate();
|
|
const user = useQuery(api.auth.getCurrentUser);
|
|
|
|
return (
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger render={<Button variant="outline" />}>
|
|
{user?.name}
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent className="bg-card">
|
|
<DropdownMenuGroup>
|
|
<DropdownMenuLabel>My Account</DropdownMenuLabel>
|
|
<DropdownMenuSeparator />
|
|
<DropdownMenuItem>{user?.email}</DropdownMenuItem>
|
|
<DropdownMenuItem
|
|
variant="destructive"
|
|
onClick={() => {
|
|
authClient.signOut({
|
|
fetchOptions: {
|
|
onSuccess: () => {
|
|
navigate("/login", { replace: true });
|
|
},
|
|
},
|
|
});
|
|
}}
|
|
>
|
|
Sign Out
|
|
</DropdownMenuItem>
|
|
</DropdownMenuGroup>
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
);
|
|
}
|