import { ButtonDownloadConfig } from 'app/modules/exportToXls/components/buttonDownloadXLS/buttonDownloadXLS.types';
import { ColumnConfig } from 'app/shared/modules/tables/dataTable/dataTable.types';
import { PaymentDataState } from '../root/store/vesselDetails.types';

const PAYMENT_TABLE_COLUMNS = {
  PERIOD: 'Period',
  DESCRIPTION: 'Description',
  PAYMENT_DATE: 'Payment date',
  AMOUNT: 'Amount',
};

export const tableColumns: ColumnConfig<PaymentDataState>[] = [
  {
    columnName: PAYMENT_TABLE_COLUMNS.PERIOD,
    align: 'left',
    cellType: 'date',
    getValue: item => item.period,
    width: 30,
  },
  {
    columnName: PAYMENT_TABLE_COLUMNS.DESCRIPTION,
    align: 'left',
    cellType: 'text',
    getValue: item => item.description,
    width: 30,
  },
  {
    columnName: PAYMENT_TABLE_COLUMNS.PAYMENT_DATE,
    align: 'left',
    cellType: 'fullDate',
    getValue: item => item.date,
    width: 30,
  },
  {
    columnName: PAYMENT_TABLE_COLUMNS.AMOUNT,
    align: 'right',
    cellType: 'number',
    getValue: item => item.result,
  },
];

export const xlsConfig: ButtonDownloadConfig<PaymentDataState>[] = [
  {
    header: PAYMENT_TABLE_COLUMNS.PERIOD,
    key: 'period',
    width: 20,
  },
  {
    header: PAYMENT_TABLE_COLUMNS.DESCRIPTION,
    key: 'description',
    width: 20,
  },
  {
    header: PAYMENT_TABLE_COLUMNS.PAYMENT_DATE,
    key: 'date',
    width: 20,
  },
  {
    header: PAYMENT_TABLE_COLUMNS.AMOUNT,
    key: 'result',
    width: 20,
  },
];