'use client';

import React from 'react';
import { Button } from 'antd';

import styles from './FiltrosModalFooterPadrao.module.scss';

export type FiltrosModalFooterPadraoProps = {
    /** Obrigatório um de `onLimparTodos` / `onLimpar`. */
    onLimparTodos?: () => void;
    /** Alias legado de `onLimparTodos`. */
    onLimpar?: () => void;
    /** Fechar o modal. Obrigatório um de `onFechar` / `onCancel`. */
    onFechar?: () => void;
    /** Alias legado de `onFechar`. */
    onCancel?: () => void;
    /** Quando false, omite o link "Limpar todos" (ex.: modal só informativo, sem rascunho a repor). */
    showLimparTodos?: boolean;
    /**
     * Quando true, mostra o botão primário "Filtrar".
     * Se omitido, fica true quando há `onFiltrar` / `onAplicar`.
     */
    showFiltrarPrimary?: boolean;
    /**
     * Ação do botão "Filtrar". Se omitido com primário visível, usa-se fechar
     * (ex.: critérios já aplicados em tempo real e o primário só fecha o diálogo).
     */
    onFiltrar?: () => void;
    /** Alias legado de `onFiltrar`. */
    onAplicar?: () => void;
    disabledFiltrar?: boolean;
    limparTodosLabel?: string;
    fecharLabel?: string;
    filtrarLabel?: string;
    dataTestIdLimparTodos?: string;
};

/**
 * Footer padrão do modal de filtros (listagens tipo Movimentos): limpar à esquerda; "Fechar" + "Filtrar" à direita.
 * Em mobile: "Limpar", "Aplicar/Filtrar" e "Fechar" numa única linha com largura distribuída.
 *
 * @see `docs/frontend/listagens/plano-rollout-listagem-movimentos.md` §1.2
 */
export function FiltrosModalFooterPadrao({
    onLimparTodos,
    onLimpar,
    onFechar,
    onCancel,
    showFiltrarPrimary,
    onFiltrar,
    onAplicar,
    disabledFiltrar = false,
    showLimparTodos = true,
    limparTodosLabel = 'Limpar todos os filtros',
    fecharLabel = 'Fechar',
    filtrarLabel = 'Filtrar',
    dataTestIdLimparTodos,
}: FiltrosModalFooterPadraoProps) {
    const fechar = onFechar ?? onCancel ?? (() => undefined);
    const filtrarHandler = onFiltrar ?? onAplicar;
    const showPrimary = showFiltrarPrimary ?? Boolean(filtrarHandler);
    const runFiltrar = filtrarHandler ?? fechar;
    const limpar = onLimparTodos ?? onLimpar ?? (() => undefined);

    return (
        <div
            className={`${styles.footer} ${!showLimparTodos ? styles.footerWithoutLimpar : ''}`.trim()}
        >
            {showLimparTodos ? (
                <Button
                    danger
                    type="link"
                    onClick={limpar}
                    data-testid={dataTestIdLimparTodos}
                    className={styles.limparBtn}
                    aria-label={limparTodosLabel}
                >
                    <span className={styles.limparTextFull}>{limparTodosLabel}</span>
                    <span className={styles.limparTextShort}>Limpar</span>
                </Button>
            ) : null}
            <div className={styles.trailing}>
                <Button onClick={fechar} className={styles.fecharBtn}>
                    {fecharLabel}
                </Button>
                {showPrimary ? (
                    <Button
                        type="primary"
                        onClick={runFiltrar}
                        disabled={disabledFiltrar}
                        className={styles.aplicarBtn}
                    >
                        {filtrarLabel}
                    </Button>
                ) : null}
            </div>
        </div>
    );
}