'use client';

import React, { type ReactNode } from 'react';
import { FloatButton } from 'antd';
import { Zap } from 'lucide-react';
import { iconTokenSize } from '@/components/icons';
import { ModalOpcoesBase, type ModalOpcaoAction } from '@/components/ModalOpcoesBase';
import { useLocale } from '@/contexts/LocaleContext';

/** Alinhado ao FAB de criação em {@link ListPageCreateFloatButton} (guia listagem / Movimentos). */
const FAB_STYLE: React.CSSProperties = {
    width: 56,
    height: 56,
    insetInlineEnd: 24,
    insetBlockEnd: 24,
};

export type ListingBulkFabModalProps = {
    /** Mostrar o FAB de ações em massa (ex.: `selectedRowKeys.length > 0`). */
    showFab: boolean;
    modalOpen: boolean;
    onOpenModal: () => void;
    onCloseModal: () => void;
    /** Impede fechar o modal durante operações em lote. */
    busy?: boolean;
    modalTitle: string;
    modalSubtitle?: string;
    actions: ModalOpcaoAction[];
    /** Texto do tooltip do FAB; omissão: "Ações em massa". */
    fabTooltipTitle?: string;
    fabAriaLabel: string;
    fabIcon?: ReactNode;
    modalWidth?: number;
    'data-testid-modal'?: string;
    'data-testid-fab'?: string;
    /** Shell visual premium (`waygestFormModal`) — alinhado ao modal de endereço PF. */
    premiumModalShell?: boolean;
};

/**
 * FAB "raio" + {@link ModalOpcoesBase} para listagens sem barra "Seleção na lista".
 * O par alternativo (criar registro) fica ao nível da página com {@link ListPageCreateFloatButton}.
 */
export function ListingBulkFabModal({
    showFab,
    modalOpen,
    onOpenModal,
    onCloseModal,
    busy = false,
    modalTitle,
    modalSubtitle,
    actions,
    fabTooltipTitle,
    fabAriaLabel,
    fabIcon,
    modalWidth = 400,
    'data-testid-modal': dataTestIdModal,
    'data-testid-fab': dataTestIdFab,
    premiumModalShell = false,
}: ListingBulkFabModalProps) {
    const { t } = useLocale();
    const resolvedFabTooltipTitle = fabTooltipTitle ?? t('listing.bulk.tooltip');

    return (
        <>
            {showFab ? (
                <FloatButton
                    type="primary"
                    icon={fabIcon ?? <Zap size={iconTokenSize.lg} aria-hidden />}
                    tooltip={{ title: resolvedFabTooltipTitle }}
                    onClick={onOpenModal}
                    aria-label={fabAriaLabel}
                    data-testid={dataTestIdFab}
                    style={FAB_STYLE}
                />
            ) : null}

            <ModalOpcoesBase
                data-testid={dataTestIdModal}
                open={modalOpen}
                onClose={() => {
                    if (!busy) onCloseModal();
                }}
                title={modalTitle}
                subtitle={modalSubtitle}
                actions={actions}
                width={modalWidth}
                premiumModalShell={premiumModalShell}
            />
        </>
    );
}