'use client';

import React, { useMemo } from 'react';
import { ListingSavedFiltersSection } from '@/components/listings';
import {
    ENTREGAS_GLOBAL_LIST_MODULE_KEY,
    entregasGlobalFiltrosToPayload,
} from '../utils/entregasGlobalFiltrosPayload';

type Props = {
    enabled: boolean;
    status: string;
    tipo: string;
    projetoId: string;
};

export function EntregasGlobalFiltrosSalvosSection({ enabled, status, tipo, projetoId }: Props) {
    const snapshotKey = useMemo(
        () => JSON.stringify({ status, tipo, projetoId }),
        [status, tipo, projetoId],
    );

    return (
        <ListingSavedFiltersSection
            moduleKey={ENTREGAS_GLOBAL_LIST_MODULE_KEY}
            enabled={enabled}
            snapshotKey={snapshotKey}
            openButtonTestId="projetos-entregas-global-salvar-vista"
            modalTestId="projetos-entregas-global-salvar-vista-modal"
            buttonLabel="Salvar filtros"
            modalTitle="Salvar visualização atual"
            saveDescription="Inclui projeto, status e tipo aplicados na aba Filtrar."
            buildPayload={() => entregasGlobalFiltrosToPayload({ status, tipo, projetoId })}
        />
    );
}