59 lines
1.5 KiB
TypeScript
59 lines
1.5 KiB
TypeScript
import React from "react";
|
|
import { PencilIcon, XMarkIcon, EyeIcon } from "@heroicons/react/24/outline";
|
|
|
|
interface TableActionsProps {
|
|
onEdit: () => void;
|
|
onDelete: () => void;
|
|
onView?: () => void;
|
|
}
|
|
|
|
const TableActions: React.FC<TableActionsProps> = ({
|
|
onEdit,
|
|
onDelete,
|
|
onView,
|
|
}) => {
|
|
const handleEdit = (e: React.MouseEvent) => {
|
|
e.stopPropagation(); // Impede a propagação para a linha da tabela
|
|
onEdit();
|
|
};
|
|
|
|
const handleDelete = (e: React.MouseEvent) => {
|
|
e.stopPropagation(); // Impede a propagação para a linha da tabela
|
|
onDelete();
|
|
};
|
|
|
|
const handleView = (e: React.MouseEvent) => {
|
|
e.stopPropagation(); // Impede a propagação para a linha da tabela
|
|
onView();
|
|
};
|
|
|
|
return (
|
|
<div className="flex space-x-2">
|
|
{onView && (
|
|
<button
|
|
onClick={handleView}
|
|
className="text-gray-600 hover:text-green-600 transition-colors"
|
|
title="Ver Detalhes"
|
|
>
|
|
<EyeIcon className="w-4 h-4" />
|
|
</button>
|
|
)}
|
|
<button
|
|
onClick={handleEdit}
|
|
className="text-gray-600 hover:text-blue-600 transition-colors"
|
|
title="Editar"
|
|
>
|
|
<PencilIcon className="w-4 h-4" />
|
|
</button>
|
|
<button
|
|
onClick={handleDelete}
|
|
className="text-gray-600 hover:text-red-600 transition-colors"
|
|
title="Deletar"
|
|
>
|
|
<XMarkIcon className="w-4 h-4" />
|
|
</button>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default TableActions;
|