hiento09 86f0ffc7d1
Chore/disable submodule (#56)
* Chore disable git submodule for web-client and app-backend

* Chore add newest source code of app-backend and web-client

---------

Co-authored-by: Hien To <tominhhien97@gmail.com>
2023-09-05 16:29:07 +07:00

57 lines
1.8 KiB
TypeScript

import Link from "next/link";
import { Popover, Transition } from "@headlessui/react";
import { Fragment } from "react";
import useGetCurrentUser from "@/_hooks/useGetCurrentUser";
type Props = {
onLogOutClick: () => void;
};
export const MenuHeader: React.FC<Props> = ({ onLogOutClick }) => {
const { user } = useGetCurrentUser();
if (!user) {
return <div></div>;
}
return (
<Transition
as={Fragment}
enter="transition ease-out duration-200"
enterFrom="opacity-0 translate-y-1"
enterTo="opacity-100 translate-y-0"
leave="transition ease-in duration-150"
leaveFrom="opacity-100 translate-y-0"
leaveTo="opacity-0 translate-y-1"
>
<Popover.Panel className="absolute shadow-profile -right-2 top-full z-10 mt-3 w-[224px] overflow-hidden rounded-[6px] bg-white shadow-lg ring-1 ring-gray-200">
<div className="py-3 px-4 gap-2 flex flex-col">
<h2 className="text-[20px] leading-[25px] tracking-[-0.4px] font-bold text-[#111928]">
{user.displayName}
</h2>
<span className="text-[#6B7280] leading-[17.5px] text-sm">
{user.email}
</span>
</div>
<hr />
<button
onClick={onLogOutClick}
className="px-4 py-3 text-sm w-full text-left text-gray-700"
>
Sign Out
</button>
<hr />
<div className="flex gap-2 px-4 py-2 justify-center items-center">
<Link href="/privacy">
<span className="text-[#6B7280] text-xs">Privacy</span>
</Link>
<div className="w-1 h-1 bg-[#D9D9D9] rounded-lg" />
<Link href="/support">
<span className="text-[#6B7280] text-xs">Support</span>
</Link>
</div>
</Popover.Panel>
</Transition>
);
};