63 lines
1.3 KiB
TypeScript
63 lines
1.3 KiB
TypeScript
import { DeleteOutlined, EditOutlined } from '@ant-design/icons';
|
|
import { Button, Popconfirm, Tooltip } from 'antd';
|
|
import { useState } from 'react';
|
|
|
|
/* =======================
|
|
DeleteButton
|
|
======================= */
|
|
|
|
interface DeleteButtonProps {
|
|
title: string;
|
|
text: string;
|
|
onOk: () => void | Promise<void>;
|
|
}
|
|
|
|
export const DeleteButton: React.FC<DeleteButtonProps> = ({
|
|
title,
|
|
text,
|
|
onOk,
|
|
}) => {
|
|
const [visible, setVisible] = useState<boolean>(false);
|
|
|
|
const handleConfirm = async () => {
|
|
await onOk();
|
|
setVisible(false);
|
|
};
|
|
|
|
return (
|
|
<Popconfirm
|
|
title={title}
|
|
open={visible}
|
|
onConfirm={handleConfirm}
|
|
onCancel={() => setVisible(false)}
|
|
>
|
|
<Tooltip title={text}>
|
|
<Button
|
|
size="small"
|
|
danger
|
|
type="primary"
|
|
icon={<DeleteOutlined />}
|
|
onClick={() => setVisible(true)}
|
|
/>
|
|
</Tooltip>
|
|
</Popconfirm>
|
|
);
|
|
};
|
|
|
|
/* =======================
|
|
EditButton
|
|
======================= */
|
|
|
|
interface EditButtonProps {
|
|
text: string;
|
|
onClick: () => void;
|
|
}
|
|
|
|
export const EditButton: React.FC<EditButtonProps> = ({ text, onClick }) => {
|
|
return (
|
|
<Tooltip title={text}>
|
|
<Button size="small" icon={<EditOutlined />} onClick={onClick} />
|
|
</Tooltip>
|
|
);
|
|
};
|