56 lines
1.8 KiB
TypeScript
56 lines
1.8 KiB
TypeScript
import React, { FC } from "react";
|
||
import { IconDotsVertical, IconEdit, IconTrash } from "@tabler/icons-react";
|
||
import { Box, Group, Menu, Text } from "@mantine/core";
|
||
import { useBoardsContext } from "@/app/deals/contexts/BoardsContext";
|
||
import { BoardSchema } from "@/lib/client";
|
||
|
||
type Props = {
|
||
board: BoardSchema;
|
||
startEditing: () => void;
|
||
isHovered?: boolean;
|
||
};
|
||
|
||
const BoardMenu: FC<Props> = ({ board, startEditing, isHovered = true }) => {
|
||
const { selectedBoard, onDeleteBoard } = useBoardsContext();
|
||
|
||
return (
|
||
<Menu>
|
||
<Menu.Target>
|
||
<Box
|
||
style={{
|
||
opacity:
|
||
isHovered || selectedBoard?.id === board.id ? 1 : 0,
|
||
cursor: "pointer",
|
||
}}
|
||
onClick={e => e.stopPropagation()}>
|
||
<IconDotsVertical />
|
||
</Box>
|
||
</Menu.Target>
|
||
<Menu.Dropdown>
|
||
<Menu.Item
|
||
onClick={e => {
|
||
e.stopPropagation();
|
||
startEditing();
|
||
}}>
|
||
<Group wrap={"nowrap"}>
|
||
<IconEdit />
|
||
<Text>Переименовать</Text>
|
||
</Group>
|
||
</Menu.Item>
|
||
<Menu.Item
|
||
onClick={e => {
|
||
e.stopPropagation();
|
||
onDeleteBoard(board);
|
||
}}>
|
||
<Group wrap={"nowrap"}>
|
||
<IconTrash />
|
||
<Text>Удалить</Text>
|
||
</Group>
|
||
</Menu.Item>
|
||
</Menu.Dropdown>
|
||
</Menu>
|
||
);
|
||
};
|
||
|
||
export default BoardMenu;
|