import { formatDate } from '@erp/core/client';
import { DataTableColumnHeader } from '@repo/rdx-ui/components';
import type { ColumnDef } from "@tanstack/react-table";
import * as React from "react";
import { CustomerInvoiceStatusBadge } from '../../components';
import { useTranslation } from '../../i18n';
import { InvoiceSummaryFormData } from '../../schemas/invoice-resume.form.schema';



export function useInvoicesListColumns(): ColumnDef<InvoiceSummaryFormData>[] {
  //const { t, readOnly, currency_code, language_code } = useInvoiceContext();
  const { t } = useTranslation();

  // Atención: Memoizar siempre para evitar reconstrucciones y resets de estado de tabla
  return React.useMemo<ColumnDef<InvoiceSummaryFormData>[]>(() => [
    {
      accessorKey: "invoice_number",
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("pages.list.grid_columns.invoice_number")} className='text-left' />
      ),
      cell: ({ row }) => (
        <div className='font-semibold text-left text-primary'>
          {row.getValue('invoice_number')}
        </div>
      ),
      enableHiding: false,
      enableSorting: false,
      size: 32,
    }, {
      accessorKey: "status",
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("pages.list.grid_columns.status")} className='text-left' />
      ),
      cell: ({ row }) => (
        <CustomerInvoiceStatusBadge status={row.getValue('status')} />
      ),
      enableSorting: false,
      size: 32,
    }, {
      accessorKey: "series",
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("pages.list.grid_columns.series")} className='text-left' />
      ),
      cell: ({ row }) => (
        <div className='font-medium text-left'>
          {row.getValue('series')}
        </div>

      ),
      enableSorting: false,
      size: 32,
    }, {
      accessorKey: "invoice_date",
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("pages.list.grid_columns.invoice_date")} className='text-left tabular-nums' />
      ),
      cell: ({ row }) => (
        <div className='font-medium text-left tabular-nums'>
          {formatDate(row.getValue('invoice_date'))}
        </div>

      ),
      enableSorting: false,
      size: 32,
    }, {
      accessorKey: "operation_date",
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("pages.list.grid_columns.operation_date")} className='text-left tabular-nums' />
      ),
      cell: ({ row }) => (
        <div className='font-medium text-left tabular-nums'>
          {formatDate(row.getValue('operation_date'))}
        </div>

      ),
      enableSorting: false,
      size: 32,
    }, {
      id: "recipient_tin",
      accessorKey: "recipient.tin",
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("pages.list.grid_columns.recipient_tin")} className='text-left tabular-nums' />
      ),
      cell: ({ row }) => (
        <div className='font-medium text-left tabular-nums'>
          {row.getValue('recipient_tin')}
        </div>
      ),
      enableSorting: false,
      size: 32,
    }, {
      accessorKey: "recipient.name",
      id: "recipient_name",
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("pages.list.grid_columns.recipient_name")} className='text-left tabular-nums' />
      ),
      cell: ({ row }) => (
        <div className='font-semibold text-left tabular-nums'>
          {row.getValue('recipient_name')}
        </div>
      ),
      enableSorting: false,
      size: 32,
    }, {
      accessorKey: "total_amount_fmt",
      header: ({ column }) => (
        <DataTableColumnHeader column={column} title={t("pages.list.grid_columns.total_amount")} className='text-right tabular-nums' />
      ),
      cell: ({ row }) => (
        <div className='font-semibold text-right tabular-nums'>
          {row.getValue('total_amount_fmt')}
        </div>
      ),
      enableSorting: false,
      size: 32,
    }

  ], [t]);
}
