'use client';

interface DataTableActionsProps {
  onView?: () => void;
  onEdit?: () => void;
  onDelete?: () => void;
  editDisabled?: boolean;
  editDisabledTitle?: string;
  deleteDisabled?: boolean;
  deleteDisabledTitle?: string;
  viewLabel?: string;
  viewIcon?: string;
  customActions?: React.ReactNode;
}

export function DataTableActions({
  onView,
  onEdit,
  onDelete,
  editDisabled,
  editDisabledTitle,
  deleteDisabled,
  deleteDisabledTitle,
  viewLabel,
  viewIcon,
  customActions,
}: DataTableActionsProps) {
  return (
    <div className="flex items-center justify-end gap-2">
      {customActions}
      {onView && (
        <button
          onClick={(e) => {
            e.stopPropagation();
            onView();
          }}
          className="bg-indigo-50 hover:bg-indigo-100 text-indigo-600 dark:bg-indigo-950/40 dark:hover:bg-indigo-900/50 dark:text-indigo-400 px-3.5 py-2 rounded-none text-xs font-extrabold cursor-pointer transition flex items-center gap-1.5"
        >
          {viewIcon && <i className={viewIcon}></i>}
          <span>{viewLabel || 'Inspect'}</span>
        </button>
      )}
      {onEdit && (
        <button
          onClick={(e) => {
            e.stopPropagation();
            if (editDisabled) return;
            onEdit();
          }}
          disabled={editDisabled}
          className="bg-slate-100 hover:bg-slate-200 dark:bg-slate-800 dark:hover:bg-slate-700 text-slate-700 dark:text-slate-250 text-xs font-extrabold px-3 py-2 rounded-none transition cursor-pointer flex items-center justify-center gap-1.5 border border-slate-200/40 dark:border-slate-850 disabled:opacity-40 disabled:cursor-not-allowed disabled:hover:bg-slate-100 dark:disabled:hover:bg-slate-800"
          title={editDisabled ? (editDisabledTitle || 'Edit not allowed') : 'Edit'}
        >
          <i className="fa-solid fa-pen-to-square"></i>
          <span>Edit</span>
        </button>
      )}
      {onDelete && (
        <button
          onClick={(e) => {
            e.stopPropagation();
            if (deleteDisabled) return;
            onDelete();
          }}
          disabled={deleteDisabled}
          className="bg-rose-50 hover:bg-rose-100/70 dark:bg-rose-950/30 dark:hover:bg-rose-900/50 text-rose-600 dark:text-rose-400 border border-rose-200 dark:border-rose-900/40 text-[11px] font-bold px-2.5 py-1.5 rounded-none transition cursor-pointer flex items-center justify-center gap-1.5 disabled:opacity-40 disabled:cursor-not-allowed disabled:hover:bg-rose-50 dark:disabled:hover:bg-rose-950/30"
          title={deleteDisabled ? (deleteDisabledTitle || 'Delete not allowed') : 'Delete'}
        >
          <i className="fa-solid fa-trash"></i>
          <span>Delete</span>
        </button>
      )}
    </div>
  );
}