import type { ColumnDef } from '@tanstack/react-table';
import { useMemo } from 'react';
import { IconButton } from '@/components/common/IconButton';
import { tableRowIconButtonClass } from '@/lib/icon-button-classes';
import { SortableColumnHeader } from '@/components/ui/sortable-column-header';
import type { ChartOfAccountListItem } from '@/features/chart-of-accounts/types';
import { useI18n } from '@/hooks/use-i18n';

type SortHandler = (column: 'code' | 'name' | 'account_type' | 'is_blocked') => void;

function buildChartOfAccountsColumns(
    t: (key: string, replacements?: Record<string, string | number>) => string,
    onSort: SortHandler,
    canManage: boolean,
    onEdit: (id: number) => void,
): ColumnDef<ChartOfAccountListItem>[] {
    return [
        {
            accessorKey: 'code',
            header: () => (
                <SortableColumnHeader label={t('settings.chart_of_accounts.table.columns.code')} onSort={() => onSort('code')} />
            ),
            cell: ({ row }) => <span className="font-mono text-xs font-medium">{row.original.code}</span>,
        },
        {
            accessorKey: 'name',
            header: () => (
                <SortableColumnHeader
                    label={t('settings.chart_of_accounts.table.columns.name')}
                    onSort={() => onSort('name')}
                />
            ),
            cell: ({ row }) => (
                <span className="max-w-md truncate" title={row.original.name}>
                    {row.original.name}
                </span>
            ),
        },
        {
            accessorKey: 'account_type',
            header: () => (
                <SortableColumnHeader
                    label={t('settings.chart_of_accounts.table.columns.type')}
                    onSort={() => onSort('account_type')}
                />
            ),
            cell: ({ row }) => (
                <span className="text-muted-foreground">{row.original.account_type_label}</span>
            ),
        },
        {
            accessorKey: 'closed_marker',
            header: t('settings.chart_of_accounts.table.columns.closed_marker'),
            cell: ({ row }) => row.original.closed_marker ?? <span className="text-muted-foreground">—</span>,
        },
        {
            accessorKey: 'is_blocked',
            header: () => (
                <SortableColumnHeader
                    label={t('settings.chart_of_accounts.table.columns.blocked')}
                    onSort={() => onSort('is_blocked')}
                />
            ),
            cell: ({ row }) =>
                row.original.is_blocked ? t('common.boolean.yes') : t('common.boolean.no'),
        },
        {
            id: 'actions',
            header: () => (
                <span className="block text-end text-[11px] font-semibold leading-tight text-foreground/85">
                    {t('settings.chart_of_accounts.table.columns.actions')}
                </span>
            ),
            cell: ({ row }) =>
                canManage ? (
                    <div className="flex justify-end">
                        <IconButton
                            type="button"
                            variant="text"
                            color="ghost"
                            size="sm"
                            className={tableRowIconButtonClass}
                            aria-label={t('settings.chart_of_accounts.table.edit_row_aria')}
                            onClick={() => onEdit(row.original.id)}
                            icon="solar:pen-bold-duotone"
                        />
                    </div>
                ) : null,
        },
    ];
}

export function useChartOfAccountsColumns(onSort: SortHandler, canManage: boolean, onEdit: (id: number) => void) {
    const { t } = useI18n();

    return useMemo(
        () => buildChartOfAccountsColumns(t, onSort, canManage, onEdit),
        [t, onSort, canManage, onEdit],
    );
}