'use client';

import { Columns3 } from 'lucide-react';
import { ICON_SIZE_MD } from '@/components/icons';
import React, { useMemo, useRef } from 'react';
import {
    ModalOpcoesBase,
    type ModalOpcaoAction,
    type ModalOpcaoGroup,
} from '@/components/ModalOpcoesBase/ModalOpcoesBase';
import { useLocale } from '@/contexts/LocaleContext';

export type ListingPageOptionsModalProps = {
    open: boolean;
    onClose: () => void;
    title?: string;
    subtitle?: string;
    onColunasVisiveis?: () => void;
    /** Quando false, omite a opção "Colunas visíveis" (ex.: feature ainda não disponível). */
    showColunasOption?: boolean;
    colunasDisabled?: boolean;
    colunasDisabledReason?: string;
    extraActions?: ModalOpcaoAction[];
    /** Título do grupo das `extraActions` (omite o heading se vazio). */
    extraGroupTitle?: string;
    /** Links do registry (`useModuleRelatedLinks`) — grupo "Navegação". */
    navigationActions?: ModalOpcaoAction[];
    width?: number;
    'data-testid'?: string;
    'aria-label'?: string;
    /** Shell visual premium (`waygestFormModal`) — alinhado ao modal de endereço PF. */
    premiumModalShell?: boolean;
};

/**
 * Modal de opções da página de listagem (não confundir com opções por linha).
 */
export function ListingPageOptionsModal({
    open,
    onClose,
    title = 'Opções da listagem',
    subtitle,
    onColunasVisiveis,
    showColunasOption = true,
    colunasDisabled = false,
    colunasDisabledReason,
    extraActions = [],
    extraGroupTitle,
    navigationActions = [],
    width = 380,
    'data-testid': dataTestId,
    'aria-label': ariaLabel,
    premiumModalShell = false,
}: ListingPageOptionsModalProps) {
    const { t } = useLocale();
    const pendingColunasRef = useRef(false);
    const onColunasVisiveisRef = useRef(onColunasVisiveis);
    onColunasVisiveisRef.current = onColunasVisiveis;

    const resolvedDisabledReason =
        colunasDisabledReason ??
        (colunasDisabled ? 'Indisponível nesta vista.' : undefined);

    const colunasAction: ModalOpcaoAction | null =
        showColunasOption && onColunasVisiveis
            ? {
                  key: 'colunas',
                  label: 'Colunas visíveis',
                  icon: <Columns3 size={ICON_SIZE_MD} aria-hidden />,
                  disabled: colunasDisabled,
                  disabledReason: resolvedDisabledReason,
                  onClick: () => {
                      if (colunasDisabled) {
                          return;
                      }
                      // Abre o modal de colunas só depois do fecho completo (evita overlap / clique “morto”).
                      pendingColunasRef.current = true;
                      onClose();
                  },
              }
            : null;

    const groups: ModalOpcaoGroup[] | undefined = useMemo(() => {
        if (navigationActions.length === 0 && extraActions.length === 0) {
            return undefined;
        }
        const result: ModalOpcaoGroup[] = [];
        if (colunasAction) {
            result.push({
                key: 'personalize',
                title: t('navigation.relatedLinks.modal.groupPersonalize'),
                actions: [colunasAction],
            });
        }
        if (navigationActions.length > 0) {
            result.push({
                key: 'navigation',
                title: t('navigation.relatedLinks.modal.groupNavigation'),
                actions: navigationActions,
            });
        }
        if (extraActions.length > 0) {
            result.push({
                key: 'extra',
                ...(extraGroupTitle ? { title: extraGroupTitle } : {}),
                actions: extraActions,
            });
        }
        return result.length > 0 ? result : undefined;
    }, [colunasAction, extraActions, extraGroupTitle, navigationActions, t]);

    const actions: ModalOpcaoAction[] = useMemo(
        () => [
            ...(colunasAction ? [colunasAction] : []),
            ...extraActions,
        ],
        [colunasAction, extraActions],
    );

    return (
        <ModalOpcoesBase
            open={open}
            onClose={onClose}
            title={title}
            subtitle={subtitle}
            groups={groups}
            actions={groups ? [] : actions}
            width={width}
            data-testid={dataTestId}
            aria-label={ariaLabel ?? title}
            premiumModalShell={premiumModalShell}
            afterClose={() => {
                if (!pendingColunasRef.current) {
                    return;
                }
                pendingColunasRef.current = false;
                onColunasVisiveisRef.current?.();
            }}
        />
    );
}