Hey is a decentralized and permissionless social media app built with Lens Protocol 馃尶
1import { Menu, MenuButton, MenuItem, MenuItems } from "@headlessui/react";
2import type { AccountFragment } from "@hey/indexer";
3import { TipIcon } from "@/components/Shared/Icons/TipIcon";
4import MenuTransition from "@/components/Shared/MenuTransition";
5import TipMenu from "@/components/Shared/TipMenu";
6import { Button, Tooltip } from "@/components/Shared/UI";
7import stopEventPropagation from "@/helpers/stopEventPropagation";
8import { useAccountStore } from "@/store/persisted/useAccountStore";
9
10interface TipButtonProps {
11 account: AccountFragment;
12}
13
14const TipButton = ({ account }: TipButtonProps) => {
15 const { currentAccount } = useAccountStore();
16
17 if (currentAccount?.address === account.address) {
18 return null;
19 }
20
21 return (
22 <Menu as="div" className="relative">
23 <MenuButton
24 aria-label="Tip"
25 as={Button}
26 onClick={stopEventPropagation}
27 outline
28 >
29 <Tooltip content="Tip" placement="top" withDelay>
30 <TipIcon className="-mx-2 my-1 size-4 text-gray-500" />
31 </Tooltip>
32 </MenuButton>
33 <MenuTransition>
34 <MenuItems
35 anchor="bottom end"
36 className="z-[5] mt-2 w-max origin-top-right rounded-xl border border-gray-200 bg-white shadow-xs focus:outline-hidden dark:border-gray-700 dark:bg-gray-900"
37 static
38 >
39 <MenuItem>
40 {({ close }) => <TipMenu account={account} closePopover={close} />}
41 </MenuItem>
42 </MenuItems>
43 </MenuTransition>
44 </Menu>
45 );
46};
47
48export default TipButton;