hamid zarghami
44 lines
1.3 KiB
TypeScript
44 lines
1.3 KiB
TypeScript
import { Popover, PopoverButton, PopoverPanel } from "@headlessui/react";
|
|
import { More } from "iconsax-react";
|
|
import { FC } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
type Props = {
|
|
onEdit: () => void;
|
|
onDelete: () => void;
|
|
};
|
|
|
|
const ProjectCardMenu: FC<Props> = ({ onEdit, onDelete }) => {
|
|
const { t } = useTranslation("global");
|
|
|
|
return (
|
|
<Popover className="relative">
|
|
<PopoverButton className="flex items-center justify-center size-8 rounded-lg hover:bg-[#F4F5F9] transition-colors outline-none">
|
|
<More size={20} color="#8C90A3" />
|
|
</PopoverButton>
|
|
|
|
<PopoverPanel
|
|
anchor="bottom start"
|
|
className="z-20 mt-1 min-w-[120px] rounded-xl bg-white shadow-md border border-border py-1 text-sm"
|
|
>
|
|
<button
|
|
type="button"
|
|
onClick={onEdit}
|
|
className="w-full px-4 py-2.5 text-right hover:bg-[#F4F5F9] transition-colors"
|
|
>
|
|
{t("edit")}
|
|
</button>
|
|
<button
|
|
type="button"
|
|
onClick={onDelete}
|
|
className="w-full px-4 py-2.5 text-right text-red-500 hover:bg-red-50 transition-colors"
|
|
>
|
|
{t("taskmanager.delete_project")}
|
|
</button>
|
|
</PopoverPanel>
|
|
</Popover>
|
|
);
|
|
};
|
|
|
|
export default ProjectCardMenu;
|