'use client';

import React from 'react';
import {
    Button,
    Tooltip,
} from 'antd';
import { Menu } from 'lucide-react';
import { ICON_SIZE_MD } from '@/components/icons';
import styles from './ListingActionsColumnCell.module.scss';

export type ListingActionsColumnCellProps = {
    tooltipTitle?: React.ReactNode;
    ariaLabel: string;
    onOpen: (e: React.MouseEvent<HTMLElement>) => void;
    'data-testid'?: string;
};

/**
 * Botão textual ⋮ para abrir menu/modal de opções da linha (com Tooltip).
 */
export function ListingActionsColumnCell({
    tooltipTitle = 'Opções',
    ariaLabel,
    onOpen,
    'data-testid': dataTestId,
}: ListingActionsColumnCellProps) {
    return (
        <Tooltip title={tooltipTitle}>
            <Button
                type="text"
                icon={<Menu size={ICON_SIZE_MD} aria-hidden />}
                className={styles.rowActionBtn}
                onClick={(e) => {
                    e.stopPropagation();
                    onOpen(e);
                }}
                aria-label={ariaLabel}
                data-testid={dataTestId}
            />
        </Tooltip>
    );
}