import type { PropsWithChildren } from 'react';
import React from 'react';
import { Link } from 'react-router-dom';
import { Tag } from '@theorchard/suite-components';
import { GlyphIcon } from '@theorchard/suite-icons';
import { getContributorDetail } from 'src/urls/frontend-royalties';
import type { GridTableColumnDefinition } from '@theorchard/suite-components';
import type { CellProps } from '@theorchard/suite-components/dist/esm/src/components/table/base/types';
import type { AbacusNrContractContributor } from 'src/types/abacus-nr-contract-contributor';

const NrContractContributorsTableColumns = () => {
    const NR_CONTRACT_CONTRIBUTOR_LIST_COLUMNS: GridTableColumnDefinition<AbacusNrContractContributor>[] =
        [
            {
                fixed: true,
                name: 'contributorId',
                title: 'Contributors',
                Cell: ({
                    data: { contributorId, contributorName, isAbacusProfile },
                }: PropsWithChildren<
                    CellProps<AbacusNrContractContributor>
                >) => (
                    <div>
                        {isAbacusProfile ? (
                            <Link
                                key={contributorId}
                                to={getContributorDetail(contributorId)}
                            >
                                {contributorName}
                            </Link>
                        ) : (
                            <span>{contributorName}</span>
                        )}
                        <br />
                        <span className="ContractContributors-ContributorLabel">
                            {contributorId}
                        </span>
                    </div>
                ),
            },
            {
                fixed: true,
                name: 'schedules',
                title: 'Schedules (# Of Contributions)',
                Cell: ({
                    data: {
                        autoAdd,
                        scheduleAttachmentsCount,
                        scheduleId,
                        scheduleName,
                    },
                }: PropsWithChildren<
                    CellProps<AbacusNrContractContributor>
                >) => (
                    <div
                        className="ContractDetail-nr-contributor-scheduleItem"
                        key={scheduleId}
                        style={{
                            whiteSpace: 'pre-wrap',
                        }}
                    >
                        {!scheduleId ? (
                            <div className="mb-2 text-muted">No Schedules</div>
                        ) : (
                            <>
                                {`${scheduleName} - (${scheduleAttachmentsCount})`}
                                {autoAdd && (
                                    <Tag>
                                        <span className="AutoAdd-container">
                                            <GlyphIcon name="check" size={12} />
                                            <span className="AutoAdd-text">
                                                Auto add new
                                            </span>
                                        </span>
                                    </Tag>
                                )}
                            </>
                        )}
                    </div>
                ),
            },
        ];

    return NR_CONTRACT_CONTRIBUTOR_LIST_COLUMNS;
};

export default NrContractContributorsTableColumns;