import type { PropsWithChildren } from 'react';
import React from 'react';
import { amountFormatter, rateFormatter } from 'src/utils/amount-helpers';
import PaymentDescription from 'src/components/shared/payment-description';
import { getCurrencyLabel } from 'src/utils/currency';
import type { GridTableColumnDefinition } from '@theorchard/suite-components';
import type { CellProps } from '@theorchard/suite-components/dist/esm/src/components/table/base/types';
import type { MilestoneType } from 'src/types/abacus-contract-advance';

const ContractAdvancePaidListTableColumns = (
    milestoneOptionsMap: MilestoneType
) => {
    const CONTRACT_ADVANCE_PAID_LIST_COLUMNS: GridTableColumnDefinition<unknown>[] =
        [
            {
                name: 'createdAt',
                title: 'Date Added',
                fixed: true,
                Cell: ({
                    data: { createdAt },
                }: PropsWithChildren<CellProps<any>>) => <>{createdAt}</>,
            },
            {
                name: 'advanceDescription',
                title: 'Payment Description',
                minWidth: '200px',
                Cell: ({
                    data: {
                        advanceDescription,
                        referencePaymentType,
                        worksheetPaymentContractAdvances,
                    },
                }: PropsWithChildren<CellProps<any>>) => {
                    const worksheetPaymentContractAdvancesItem =
                        worksheetPaymentContractAdvances.items[0];
                    return (
                        <div style={{ whiteSpace: 'pre-wrap' }}>
                            <PaymentDescription
                                worksheetPaymentContractAdvanceId={
                                    worksheetPaymentContractAdvancesItem?.worksheetPaymentContractAdvanceId
                                }
                                paymentName={advanceDescription}
                                referencePaymentTypeId={
                                    referencePaymentType?.referencePaymentTypeId
                                }
                            />
                        </div>
                    );
                },
            },
            {
                name: 'amount',
                title: 'Amount',
                align: 'right',
                Cell: ({
                    data: { amount, currencyCode },
                }: PropsWithChildren<CellProps<any>>) => (
                    <>{amountFormatter(amount, currencyCode)}</>
                ),
            },
            {
                name: 'currencyCode',
                title: 'Currency',
                Cell: ({
                    data: { currencyCode },
                }: PropsWithChildren<CellProps<any>>) => (
                    <>{getCurrencyLabel(currencyCode)}</>
                ),
            },
            {
                name: 'withholdingTaxAmount',
                title: 'WHT',
                align: 'right',
            },
            {
                name: 'vatAmount',
                title: 'VAT',
                align: 'right',
            },
            {
                name: 'usSourceIncomeRate',
                title: 'US Source Income Rate',
                align: 'right',
                Cell: ({
                    data: { usSourceIncomeRate },
                }: PropsWithChildren<CellProps<any>>) => (
                    <>{rateFormatter(usSourceIncomeRate)}</>
                ),
            },
            {
                name: 'amountAfterWithholdingAndVat',
                title: 'Post Tax Payable Amount',
                align: 'right',
            },
            {
                name: 'milestone',
                title: 'Milestone',
                Cell: ({
                    data: { milestone },
                }: PropsWithChildren<CellProps<any>>) => (
                    <>{milestoneOptionsMap[milestone]}</>
                ),
            },
            {
                name: 'milestoneDescription',
                title: 'Milestone Description',
                minWidth: '200px',
                Cell: ({
                    data: { milestoneDescription },
                }: PropsWithChildren<CellProps<any>>) => (
                    <div
                        style={{
                            whiteSpace: 'pre-wrap',
                        }}
                    >
                        {milestoneDescription}
                    </div>
                ),
            },
            {
                name: 'milestoneDate',
                title: 'Milestone Reached On',
                Cell: ({
                    data: { milestoneDate },
                }: PropsWithChildren<CellProps<any>>) => <>{milestoneDate}</>,
            },
            {
                name: 'note',
                title: 'Payment Notes',
                minWidth: '150px',
                Cell: ({
                    data: { note },
                }: PropsWithChildren<CellProps<any>>) => (
                    <div
                        style={{
                            whiteSpace: 'pre-wrap',
                        }}
                    >
                        {note ? note : '-'}
                    </div>
                ),
            },
            {
                name: 'datePaid',
                title: 'Date Paid',
                Cell: ({
                    data: { datePaid },
                }: PropsWithChildren<CellProps<any>>) => <>{datePaid || '-'}</>,
            },
            {
                name: 'statementPeriodName',
                title: 'Statement Period',
                Cell: ({
                    data: { statementPeriod },
                }: PropsWithChildren<CellProps<any>>) => (
                    <>{statementPeriod?.statementPeriodName}</>
                ),
            },
            {
                name: 'advancePayeeCurrencyCode',
                title: 'Payment Currency',
                Cell: ({
                    data: { advancePayeeCurrencyCode },
                }: PropsWithChildren<CellProps<any>>) => (
                    <>
                        {advancePayeeCurrencyCode
                            ? getCurrencyLabel(advancePayeeCurrencyCode)
                            : '-'}
                    </>
                ),
            },
            {
                name: 'advanceAmountPayeeCurrency',
                title: 'Amount in Payment Currency',
                align: 'right',
                Cell: ({
                    data: {
                        advanceAmountPayeeCurrency,
                        advancePayeeCurrencyCode,
                    },
                }: PropsWithChildren<CellProps<any>>) => (
                    <>
                        {advanceAmountPayeeCurrency
                            ? amountFormatter(
                                  Math.abs(advanceAmountPayeeCurrency),
                                  advancePayeeCurrencyCode
                              )
                            : '-'}
                    </>
                ),
            },
        ];

    return CONTRACT_ADVANCE_PAID_LIST_COLUMNS;
};

export default ContractAdvancePaidListTableColumns;
