'use client';

import React from 'react';
import { ChevronDown, ChevronUp } from 'lucide-react';
import { iconTokenSize } from '@/components/icons';
import type { ColumnGroupType, ColumnType, ColumnsType } from 'antd/es/table';
import type { SortOrder } from 'antd/es/table/interface';

const TABLE_PREFIX = 'ant-table';

/**
 * Ícone de ordenação alinhado a `/suporte/chamados`: só mostra seta na coluna com `sortOrder` ativo.
 * Usa classes do Ant Design para herdar estilos do cabeçalho (incl. `DataTable.module.scss` em cabeçalho primário).
 */
export function renderListingTableSingleActiveSortIcon(sortOrder: SortOrder): React.ReactNode {
    if (sortOrder == null) {
        return null;
    }
    if (sortOrder === 'ascend') {
        return (
            <span className={`${TABLE_PREFIX}-column-sorter`}>
                <span className={`${TABLE_PREFIX}-column-sorter-inner`} aria-hidden>
                    <ChevronUp
                        aria-hidden
                        className={`${TABLE_PREFIX}-column-sorter-up active`}
                        size={iconTokenSize.xs}
                    />
                </span>
            </span>
        );
    }
    return (
        <span className={`${TABLE_PREFIX}-column-sorter`}>
            <span className={`${TABLE_PREFIX}-column-sorter-inner`} aria-hidden>
                <ChevronDown
                    aria-hidden
                    className={`${TABLE_PREFIX}-column-sorter-down active`}
                    size={iconTokenSize.xs}
                />
            </span>
        </span>
    );
}

function injectSortIconOnColumn<T extends object>(col: ColumnType<T>): ColumnType<T> {
    if (!col.sorter || col.sortIcon != null) {
        return col;
    }
    return {
        ...col,
        sortIcon: ({ sortOrder }: { sortOrder: SortOrder }) => renderListingTableSingleActiveSortIcon(sortOrder),
    };
}

/**
 * Para colunas com `sorter` e sem `sortIcon` custom, define `sortIcon` que só renderiza carets quando
 * essa coluna está ativa (igual ao padrão visual de Chamados).
 */
export function withListingTableSingleActiveSortIconColumns<T extends object>(columns: ColumnsType<T>): ColumnsType<T> {
    return columns.map((col) => {
        if ('children' in col && col.children?.length) {
            return {
                ...col,
                children: withListingTableSingleActiveSortIconColumns(col.children as ColumnsType<T>),
            } as ColumnGroupType<T>;
        }
        return injectSortIconOnColumn(col as ColumnType<T>);
    });
}